0

My react native Expo android app always crashes when the app is closed/not running and a notification is clicked.

It opens up showing the splashscreen and then crashes after a few seconds

If the app is already opened when the notification is clicked, It works fine.

This is a production build, it didn't report or show up any bugs(Bugsnag didn't show up any errors).

How can I fix this, please?

*someone suggested I check out the error with logcat but I have no idea what the error means in react native or how to fix it

Error logcat detected

your contribution would be appreciated.

Before now, I thought it was because of the way my app navigator was arranged.

I had three navigators,

  1. InitNavigator - contained only the splashscreen
  2. AuthNavigator - authentication screens
  3. AppNavigator - contained screens that the users see when they login successfully

My first implementation was that appNavigator conditionally mounted only when the user logs in. The app knows a user is logged in when it sees a JWT in the asyncStorage.

So I had to get information from asyncStorage first when the app is launched

But after experiencing this issue, I made sure all navigators were mounted when the app loads

<AppStack.Navigator
      screenOptions={{ headerShown: false }}
      // initialRouteName={routes.APP_NAVIGATOR.SINGLE_POST}
    >
      {/* Initial/Splash Screen */}
      <AppStack.Group>
        <AppStack.Screen name="splashScreen" component={SplashScreen} />
      </AppStack.Group>
      {/* Authentication Screen */}
      <AppStack.Group>
        <AppStack.Screen
          name={routes.AUTH_STACK_NAVIGATOR.SIGNUP_NAVIGATOR}
          component={UserProvider}
        />
      </AppStack.Group>
      <AppStack.Group>
        {/* <AppStack.Screen name="demo" component={ViewCommunityProfile} /> */}
        <AppStack.Screen
          name={routes.APP_NAVIGATOR.COMMUNITY_NAVIGATOR}
          component={SideDrawer}
        />

        <AppStack.Screen
          name={routes.APP_NAVIGATOR.SET_LOCATION}
          component={Location}
        />

        <AppStack.Screen
          name="EditCommunityProfile"
          component={EditCommunityProfile}
        />
        <AppStack.Screen
          name={routes.APP_NAVIGATOR.CREATE_POST_NAVIGATOR}
          component={CreatePostNavigator}
        />
        <AppStack.Screen
          name={routes.APP_NAVIGATOR.PROFILE_NAVIGATOR}
          component={ProfileNavigator}
        />
        <AppStack.Screen
          name={routes.APP_NAVIGATOR.CHAT_NAVIGATOR}
          component={ChatNavigator}
        />
        <AppStack.Screen
          name={routes.APP_NAVIGATOR.SINGLE_POST}
          component={SinglePost}
        />
      </AppStack.Group>
    </AppStack.Navigator>

This is the code used for handling notification

  • notification is handled in a context wrapping the entire app
responseListener.current =
      Notifications.addNotificationResponseReceivedListener((response) => {
        const notificatonContent = response.notification.request.content;
        if (notificatonContent.data?.url) {
          openUsingDefaultUrl(notificatonContent.data.url);
        } else {
          openUsingDefaultUrl("/notification");
        }
      });

I also added code to handle notifications clicked when app is in Background

import * as TaskManager from "expo-task-manager";

const BACKGROUND_NOTIFICATION_TASK = "BACKGROUND-NOTIFICATION-TASK";

TaskManager.defineTask(
  BACKGROUND_NOTIFICATION_TASK,
  ({ data, error, executionInfo }) => {
    if (error) {
      Bugsnag.notify(error);
    }
    if (data) {
      if (data?.url) {
        openUsingDefaultUrl(data.url);
      } else {
        openUsingDefaultUrl("/notification");
      }
    }
  }
);
Austin Ezeh
  • 11
  • 2

1 Answers1

0

Do not wrap your entire app inside a context for notifications, it will break the app. I recently found that out a the hard way, refer to the expo docs for the correct setup https://docs.expo.dev/versions/latest/sdk/notifications/.

Nadeem Johnson
  • 11
  • 3