인프런 커뮤니티 질문&답변

안녕하세요.

지난번 질문 드렸던 것은 해결이 되었는데요. (인터셉터 / DB 마이그 postgres -> mssql / fcm push )

구성은 강의 파일 기반으로 추가 및 수정 하고 있습니다.

nest js 서버( + fcm 송신 서버) -> android(fcm 알림 수신)

android fcm 수신 후 백그라운드 데이터 가공 (서버/로컬 data 처리 ) -> 가공 데이터로 push 생성

데이터 가공 (hooks) 하기 위해 (FetchData.ts) 파일을 import 하였습니다. (ok)

import useFetchData from '@/hooks/useFetchData';

발생한 push 알림 메세지를 클릭시 특정 화면으로 이동하고 싶은데요.

ex) FeedList.tsx // FeedHomeScreen.tsx 쪽으로 이동하고 싶은데요.. 잘 안되고 있습니다.

(이벤트 발생 위치는 알지만 처리를 못하고 있습니다.)

App내에서 hooks을 사용해서 그런지

App 내에서 useNavigation() 을 사용해서 처리 하려고 했더니

navigation.navigate('RootNavigator');

MainDrawerNavigator / FeedList / FeedHomeScreen 등등 해봤는데 시작 전에 에러나 가더라고요.

렌더링 에러가 납니다.

import React, { useEffect } from 'react';
import { StatusBar, Platform } from 'react-native';
import { NavigationContainer, useNavigation } from '@react-navigation/native';
import { QueryClientProvider } from '@tanstack/react-query';
import Toast, { BaseToast, BaseToastProps, ErrorToast } from 'react-native-toast-message';

import MainDrawerNavigator from './src/navigations/drawer/MainDrawerNavigator';
import AuthStackNavigator from './src/navigations/stack/AuthStackNavigator';
import useAuth from '@/hooks/queries/useAuth';

import RootNavigator from './src/navigations/root/RootNavigator';
import queryClient from './src/api/queryClient';
import { colors } from '@/constants';
import useThemeStorage from '@/hooks/useThemeStorage';

// push 추가
import messaging from '@react-native-firebase/messaging';
import PushNotification from 'react-native-push-notification';
import PushNotificationIOS from '@react-native-community/push-notification-ios';
import { getEncryptStorage, setEncryptStorage } from '@/utils/encryptStorage';
import useFetchData from '@/hooks/useFetchData';

const App = () => {
  const navigation = useNavigation();    // 화면 이동용
  const { theme } = useThemeStorage();
  const { fetchData } = useFetchData();  // 데이터 가공

  usePushNotifications(fetchData, navigation); // FCM수신 -> 가공data 전달
  useTokenRegistration();  // 토큰 저장

  return (
    <QueryClientProvider client={queryClient}>
      <NavigationContainer>
        <StatusBar
          barStyle={theme === 'light' ? 'dark-content' : 'light-content'}
          backgroundColor={theme === 'light' ? colors['light'].WHITE : colors['light'].BLACK}
        />
        <RootNavigator />              
        <Toast config={toastConfig} />
      </NavigationContainer>
    </QueryClientProvider>
  );
};

어떻게 접근 해야 할지 잘 모르겠습니다.

베이스가 부족해서 그런지 네이게이터와 스크린 (단순 이동 뿐이 못하겠습니다. ㅎㅎ)

주말 잘 보내세요 감사합니다.