Alternative useState in react-native class component - reactjs

Question

i'm aware i cant use useState in class components, but there's this tutorial i'm trying to relpicate in my App. They used a functional component unlike me.
Their App.js in the tutorial is like this:
const App = () => {
useEffect(()=>{
fcmService.registerAppWithFCM();
fcmService.register(onRegister, onNotification, onOpenNotification);
localNotificationService.configure(onOpenNotification)
},[])
const onRegister = (token) => {
console.log("[App] Token", token);
}
const onNotification = (notify) => {
// console.log("[App] onNotification", notify);
const options = {
soundName: 'default',
playSound: true,
}
localNotificationService.showNotification(
0,
notify.notification.title,
notify.notification.body,
notify,
options,
)
}
const onOpenNotification = async (notify) => {
console.log('notify', notify);
}
So basically, const onOpenNotification, const onRegister, const onNotification are called in another file imported into App.js. I tried adding them in my App.js like :
class App extends Component {
componentDidMount() {
fcmService.registerAppWithFCM();
fcmService.register(onRegister, onNotification, onOpenNotification);
localNotificationService.configure(onOpenNotification)
const onRegister = (token) => {
console.log("[App] Token", token);
}
const onNotification = (notify) => {
// console.log("[App] onNotification", notify);
const options = {
soundName: 'default',
playSound: true,
}
localNotificationService.showNotification(
0,
notify.notification.title,
notify.notification.body,
notify,
options,
)
}
const onOpenNotification = async (notify) => {
console.log('notify', notify);
}
}
}
My console.log shows these errors:
LOG [FCMService] getInitialNotification getInitialNotification null
LOG [LocalNotificationService] onRegister: {"os": "android", "token": "emA0hq4KCMq0j:APA91bEWbOUXjxdIs_s2ksSbjwxhdMVfr35y9sZBUIYX72Q9obU7daQw4zI-a0qn6KsvxWvGtQoEdPlTq5l98trb-yhmtARDcliqAayi_r0K8f_"}
LOG [FCMService] getToken Rejected [TypeError: onRegister is not a function. (In 'onRegister(fcmToken)', 'onRegister' is undefined)]
I'm guessing that's because the const functions() are not properly structured, Whats the best way to replicate this tutorial, preferably if I don't have to change to a functional component
I don't think I would be able to put all the information you might need to help here, but I would appreciate if you could take some time to see how the 2 imported files I talked about are structured and how they call the const onRegister in App.js
Thank you!

Answer 1

EDIT: Updated Code
Try moving the methods to class level.
class App extends Component {
componentDidMount() {
fcmService.registerAppWithFCM();
fcmService.register(this.onRegister, this.onNotification, this.onOpenNotification);
localNotificationService.configure(this.onOpenNotification)
}
onRegister = (token) => {
console.log("[App] Token", token);
}
onNotification = (notify) => {
// console.log("[App] onNotification", notify);
const options = {
soundName: 'default',
playSound: true,
}
localNotificationService.showNotification(0,notify.notification.title,
notify.notification.body, notify, options,)
}
onOpenNotification = async (notify) => {
console.log('notify', notify);
}
}