My app crashes when I tap on notification

Please provide the following:

  1. SDK Version: 42
  2. Platforms(Android/iOS/web/all): Android/iOS

I’m having a problem with the Expo Notification, every time I click on it my app simply closes

code:

useEffect(() => {
    notificationListener.current = Notifications.addNotificationReceivedListener(notification => {
      const { request: { content: { data } } } = notification;
      if (typeof data?.type === "undefined") {
        Alert.alert(
          "Pedido aceito",
          `O pedido #${data.id} foi aceito pelo profissional`,
          [{ Text: "OK" }]
        );
      }
    });

    responseListener.current = Notifications.addNotificationResponseReceivedListener(
      notification => {
        const { request: { content: { data } } } = notification;
        if (data?.type === "chat") {
          const { id } = data;
          getChatRoom(id);
        }
      }
    );

    return () => {
      Notifications.removeNotificationSubscription(notificationListener.current);
      Notifications.removeNotificationSubscription(responseListener.current);
    };
  }, []);

packge.json:

{
  "name": "biuri",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "@expo/webpack-config": "^0.13.1",
    "eslint": "^7.31.0",
    "eslint-config-airbnb": "^18.2.1",
    "eslint-config-airbnb-base": "^14.2.1",
    "eslint-plugin-import": "^2.23.4",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-react": "^7.24.0",
    "jest": "^27.0.6",
    "mocha": "^9.0.3",
    "react-devtools": "^4.14.0",
    "react-native-scripts": "^2.0.1",
    "react-test-renderer": "^17.0.2",
    "schedule": "^0.5.0",
    "webpack-bundle-analyzer": "^4.4.2"
  },
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "eject": "expo eject",
    "e2e": "detox test --configuration ios.sim"
  },
  "dependencies": {
    "@ptomasroos/react-native-multi-slider": "^2.2.2",
    "@react-native-async-storage/async-storage": "^1.15.5",
    "@react-native-community/datetimepicker": "^3.5.2",
    "@react-native-community/masked-view": "^0.1.11",
    "@react-native-masked-view/masked-view": "^0.2.6",
    "@react-navigation/bottom-tabs": "^5.11.11",
    "@react-navigation/compat": "^5.3.15",
    "@react-navigation/drawer": "^5.12.5",
    "@react-navigation/native": "^5.9.4",
    "@react-navigation/stack": "^5.14.5",
    "axios": "^0.21.1",
    "babel-eslint": "^10.1.0",
    "date-fns": "^2.23.0",
    "eslint-plugin-react-hooks": "^4.2.0",
    "expo": "^42.0.3",
    "expo-apple-authentication": "^3.2.1",
    "expo-asset": "^8.3.3",
    "expo-blur": "^9.0.3",
    "expo-camera": "^11.2.2",
    "expo-contacts": "^9.2.5",
    "expo-device": "^3.3.0",
    "expo-facebook": "^11.3.1",
    "expo-image-picker": "^10.2.2",
    "expo-intent-launcher": "^9.1.0",
    "expo-linear-gradient": "^9.2.0",
    "expo-linking": "^2.3.1",
    "expo-notifications": "^0.12.3",
    "expo-status-bar": "^1.0.4",
    "expo-updates": "^0.8.2",
    "imutable": "^0.0.1",
    "loadtest": "^5.1.2",
    "moment": "^2.29.1",
    "moment-range": "^4.0.2",
    "prop-types": "^15.7.2",
    "query-string": "^7.0.1",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-42.0.0.tar.gz",
    "react-native-animatable": "^1.3.3",
    "react-native-calendar-strip": "^2.2.4",
    "react-native-calendars": "^1.1264.0",
    "react-native-elements": "^3.4.2",
    "react-native-gesture-handler": "^1.10.3",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-material-dropdown-v2": "^0.11.1",
    "react-native-modal": "^12.0.3",
    "react-native-modal-datetime-picker": "^10.2.0",
    "react-native-paper": "^4.9.2",
    "react-native-reanimated": "^2.2.0",
    "react-native-screens": "^3.4.0",
    "react-native-searchbar": "^1.16.0",
    "react-native-sentry": "^0.43.2",
    "react-native-slider": "^0.11.0",
    "react-native-snap-carousel": "^3.9.1",
    "react-native-touchable-scale": "^2.1.2",
    "react-native-vector-icons": "^8.1.0",
    "react-native-webview": "^11.6.5",
    "react-redux": "^7.2.4",
    "redux": "^4.1.0",
    "redux-devtools-extension": "^2.13.9",
    "redux-persist": "^6.0.0",
    "redux-thunk": "^2.3.0",
    "sentry-expo": "^4.0.1",
    "styled-components": "^5.3.0"
  },
  "detox": {
    "configurations": {
      "ios.sim": {
        "binaryPath": "bin/Exponent.app",
        "type": "ios.simulator",
        "name": "iPhone 7"
      }
    }
  }
}

You’re probably hitting a fatal JS error in the codepath inside of addNotificationResponseReceivedListener. Looks like the issue could be with your de-structuring, make sure you’ve got the type right- Notifications - Expo Documentation

You were right that was the mistake
I was putting:
const { request: { content: { data } } } = notification;
Now I put:
const { notification: { request: { content: { date } } } } = notification;
And the error didn’t appear anymore.

Dude, thank you so much for helping me.
Abraços

1 Like

This topic was automatically closed 20 days after the last reply. New replies are no longer allowed.