From ca0e19d1d8d83d63a75d071ce848bfc504b41016 Mon Sep 17 00:00:00 2001
From: d0422 <rlfehd2013@naver.com>
Date: Wed, 25 Sep 2024 19:14:40 +0900
Subject: [PATCH 1/8] =?UTF-8?q?chore:=20error=20boundary=20=ED=8C=A8?=
 =?UTF-8?q?=ED=82=A4=EC=A7=80=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/react-native/package.json |  1 +
 yarn.lock                          | 12 ++++++++++++
 2 files changed, 13 insertions(+)

diff --git a/packages/react-native/package.json b/packages/react-native/package.json
index 87797e2b..dbcb62a3 100644
--- a/packages/react-native/package.json
+++ b/packages/react-native/package.json
@@ -32,6 +32,7 @@
     "design-system": "workspace:^",
     "nativewind": "^2.0.11",
     "react": "18.2.0",
+    "react-error-boundary": "^4.0.13",
     "react-native": "0.74.3",
     "react-native-calendars": "^1.1306.0",
     "react-native-date-picker": "^5.0.4",
diff --git a/yarn.lock b/yarn.lock
index 3cee8222..03f20a90 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -14625,6 +14625,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-error-boundary@npm:^4.0.13":
+  version: 4.0.13
+  resolution: "react-error-boundary@npm:4.0.13"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+  peerDependencies:
+    react: ">=16.13.1"
+  checksum: 50398d080015d51d22c6f94c56f4ea336d10232d72345b36ee6f15b6b643666d20b072829b02f091a80e5af68fe67f68a62ef0d2b649dbd759ead929304449af
+  languageName: node
+  linkType: hard
+
 "react-freeze@npm:^1.0.0":
   version: 1.0.4
   resolution: "react-freeze@npm:1.0.4"
@@ -14983,6 +14994,7 @@ __metadata:
     nativewind: ^2.0.11
     prettier: ^3.3.3
     react: 18.2.0
+    react-error-boundary: ^4.0.13
     react-native: 0.74.3
     react-native-calendars: ^1.1306.0
     react-native-date-picker: ^5.0.4

From 67790f143db11e60894c4da9d7a48b4c1cc69644 Mon Sep 17 00:00:00 2001
From: d0422 <rlfehd2013@naver.com>
Date: Wed, 25 Sep 2024 19:14:58 +0900
Subject: [PATCH 2/8] =?UTF-8?q?chore:=20queries=20=EC=8B=A4=ED=8C=A8?=
 =?UTF-8?q?=EC=8B=9C=20error=EB=A5=BC=20throw=ED=95=98=EB=8F=84=EB=A1=9D?=
 =?UTF-8?q?=20=EC=84=A4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/react-native/src/App.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/react-native/src/App.tsx b/packages/react-native/src/App.tsx
index 57ed6302..bb7fb94e 100644
--- a/packages/react-native/src/App.tsx
+++ b/packages/react-native/src/App.tsx
@@ -8,6 +8,7 @@ const queryClient = new QueryClient({
   defaultOptions: {
     queries: {
       retry: false,
+      throwOnError: true,
     },
   },
 });

From 1413c89c2a0219156cbb0784801bfc8fe1633199 Mon Sep 17 00:00:00 2001
From: d0422 <rlfehd2013@naver.com>
Date: Wed, 25 Sep 2024 19:15:40 +0900
Subject: [PATCH 3/8] =?UTF-8?q?feat:=20=EC=97=90=EB=9F=AC=20=EC=BB=B4?=
 =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/common/Error.tsx           | 36 +++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 packages/react-native/src/components/common/Error.tsx

diff --git a/packages/react-native/src/components/common/Error.tsx b/packages/react-native/src/components/common/Error.tsx
new file mode 100644
index 00000000..58a9462c
--- /dev/null
+++ b/packages/react-native/src/components/common/Error.tsx
@@ -0,0 +1,36 @@
+import { Font } from 'design-system';
+import { SafeAreaView, TouchableOpacity, View } from 'react-native';
+import LinearGradient from 'react-native-linear-gradient';
+
+export default function Error() {
+  return (
+    <LinearGradient
+      colors={['#FF1919', '#000000']}
+      start={{ x: 0, y: -0.5 }}
+      end={{ x: 0, y: 0.5 }}
+      className="h-full"
+    >
+      <LinearGradient
+        colors={['rgba(0, 0, 0, 0.4)', 'rgba(0, 0, 0, 0.4)']}
+        start={{ x: 0, y: 0 }}
+        end={{ x: 0, y: 1 }}
+        className="h-full"
+      >
+        <SafeAreaView className="flex-1">
+          <View className="flex-1" style={{}}>
+            <View className="flex-1 justify-center items-center">
+              <Font.Bold type="body2" color="white">
+                오류가 발생했습니다!
+              </Font.Bold>
+              <TouchableOpacity className="bg-Button-red rounded-xl px-4 py-2 mt-4">
+                <Font type="body2" color="white">
+                  새로고침
+                </Font>
+              </TouchableOpacity>
+            </View>
+          </View>
+        </SafeAreaView>
+      </LinearGradient>
+    </LinearGradient>
+  );
+}

From 5a3104f44e9167ea7ae9afb481f3039b0793eb77 Mon Sep 17 00:00:00 2001
From: d0422 <rlfehd2013@naver.com>
Date: Wed, 25 Sep 2024 19:17:14 +0900
Subject: [PATCH 4/8] =?UTF-8?q?feat:=20ErrorBoundary=20=EC=84=A4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../react-native/src/hooks/useGeolocation.ts  |  2 +-
 packages/react-native/src/pages/Splash.tsx    |  2 +-
 .../src/routes/StackNavigator.tsx             | 42 ++++++++++++-------
 3 files changed, 29 insertions(+), 17 deletions(-)

diff --git a/packages/react-native/src/hooks/useGeolocation.ts b/packages/react-native/src/hooks/useGeolocation.ts
index 55fd870d..6486a6c1 100644
--- a/packages/react-native/src/hooks/useGeolocation.ts
+++ b/packages/react-native/src/hooks/useGeolocation.ts
@@ -54,7 +54,7 @@ export default function useGeolocation() {
       return null;
     }
 
-    const result = new Promise<GeolocationResponse>((resolve) => {
+    const result = await new Promise<GeolocationResponse>((resolve) => {
       Geolocation.getCurrentPosition((pos) => resolve(pos));
     });
     return result;
diff --git a/packages/react-native/src/pages/Splash.tsx b/packages/react-native/src/pages/Splash.tsx
index fca3a655..83835590 100644
--- a/packages/react-native/src/pages/Splash.tsx
+++ b/packages/react-native/src/pages/Splash.tsx
@@ -21,7 +21,7 @@ export default function Splash() {
       setRefresh(refresh);
       return navigation.navigate('Main');
     });
-  }, []);
+  });
 
   return (
     <BackGroundGradient withoutScroll>
diff --git a/packages/react-native/src/routes/StackNavigator.tsx b/packages/react-native/src/routes/StackNavigator.tsx
index 2bb3fbc7..6cd11e02 100644
--- a/packages/react-native/src/routes/StackNavigator.tsx
+++ b/packages/react-native/src/routes/StackNavigator.tsx
@@ -1,13 +1,17 @@
 import { createStackNavigator } from '@react-navigation/stack';
+import { ErrorBoundary } from 'react-error-boundary';
+import { QueryErrorResetBoundary } from '@tanstack/react-query';
+import { useNavigation } from '@react-navigation/native';
 import Login from '@pages/Login/Login';
 import TabScreens from '@pages/TabScreens';
 import CameraPage from '@/pages/CameraPage';
 import SignupStackNavigator from './SignupStackNavigator';
-import { StackParamList } from '@/types/navigation';
+import { StackNavigation, StackParamList } from '@/types/navigation';
 import SettingStackNavigator from './SettingStackNavigator';
 import Landing from '@/pages/Landing';
 import Splash from '@/pages/Splash';
 import TOS from '@/pages/TOS';
+import Error from '@/components/common/Error';
 
 const Stack = createStackNavigator<StackParamList>();
 
@@ -17,20 +21,28 @@ const Stack = createStackNavigator<StackParamList>();
  * 해당 StackNavigator 컴포넌트를 이곳에 추가합니다.
  */
 export default function StackNavigator() {
+  const navigation = useNavigation<StackNavigation<'Home/Main'>>();
   return (
-    <Stack.Navigator
-      screenOptions={{
-        headerShown: false,
-      }}
-    >
-      <Stack.Screen name="Splash" component={Splash} />
-      <Stack.Screen name="TOS" component={TOS} />
-      <Stack.Screen name="Login" component={Login} />
-      <Stack.Screen name="Signup" component={SignupStackNavigator} />
-      <Stack.Screen name="Main" component={TabScreens} />
-      <Stack.Screen name="Camera" component={CameraPage} />
-      <Stack.Screen name="Setting/Main" component={SettingStackNavigator} />
-      <Stack.Screen name="Landing" component={Landing} />
-    </Stack.Navigator>
+    <QueryErrorResetBoundary>
+      <ErrorBoundary
+        fallback={<Error />}
+        onReset={() => navigation.navigate('Splash')}
+      >
+        <Stack.Navigator
+          screenOptions={{
+            headerShown: false,
+          }}
+        >
+          <Stack.Screen name="Splash" component={Splash} />
+          <Stack.Screen name="TOS" component={TOS} />
+          <Stack.Screen name="Login" component={Login} />
+          <Stack.Screen name="Signup" component={SignupStackNavigator} />
+          <Stack.Screen name="Main" component={TabScreens} />
+          <Stack.Screen name="Camera" component={CameraPage} />
+          <Stack.Screen name="Setting/Main" component={SettingStackNavigator} />
+          <Stack.Screen name="Landing" component={Landing} />
+        </Stack.Navigator>
+      </ErrorBoundary>
+    </QueryErrorResetBoundary>
   );
 }

From 2bb96d5222f40ae5a80b355d174439d10c110d70 Mon Sep 17 00:00:00 2001
From: d0422 <rlfehd2013@naver.com>
Date: Wed, 25 Sep 2024 20:36:48 +0900
Subject: [PATCH 5/8] =?UTF-8?q?feat:=20withSpotErrorBoundary=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/HOC/withSpotErrorBoundary.tsx | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)
 create mode 100644 packages/react-native/src/components/HOC/withSpotErrorBoundary.tsx

diff --git a/packages/react-native/src/components/HOC/withSpotErrorBoundary.tsx b/packages/react-native/src/components/HOC/withSpotErrorBoundary.tsx
new file mode 100644
index 00000000..0a3ba17a
--- /dev/null
+++ b/packages/react-native/src/components/HOC/withSpotErrorBoundary.tsx
@@ -0,0 +1,16 @@
+import React from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+import Error from '../common/Error';
+
+export default function withSpotErrorBoundary<T extends object>(
+  Component: React.ComponentType<T>,
+) {
+  return function ErrorBoundaryComponent({ ...props }: T) {
+    return (
+      <ErrorBoundary fallback={<Error />}>
+        {/* eslint-disable-next-line react/jsx-props-no-spreading */}
+        <Component {...props} />
+      </ErrorBoundary>
+    );
+  };
+}

From 90d1b587b34c6e4d39ea66924e46ce4212f1eb3b Mon Sep 17 00:00:00 2001
From: d0422 <rlfehd2013@naver.com>
Date: Wed, 25 Sep 2024 20:37:37 +0900
Subject: [PATCH 6/8] =?UTF-8?q?feat:=20Error=EC=8B=9C=20Splash=EB=A1=9C=20?=
 =?UTF-8?q?=EB=B3=B4=EB=82=B4=EB=8F=84=EB=A1=9D=20=EC=B2=98=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../react-native/src/components/common/Error.tsx | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/packages/react-native/src/components/common/Error.tsx b/packages/react-native/src/components/common/Error.tsx
index 58a9462c..b0c9e84d 100644
--- a/packages/react-native/src/components/common/Error.tsx
+++ b/packages/react-native/src/components/common/Error.tsx
@@ -1,8 +1,12 @@
-import { Font } from 'design-system';
 import { SafeAreaView, TouchableOpacity, View } from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+import { Font } from 'design-system';
 import LinearGradient from 'react-native-linear-gradient';
+import { StackNavigation } from '@/types/navigation';
 
 export default function Error() {
+  const navigation = useNavigation<StackNavigation<'Home/Main'>>();
+
   return (
     <LinearGradient
       colors={['#FF1919', '#000000']}
@@ -22,7 +26,15 @@ export default function Error() {
               <Font.Bold type="body2" color="white">
                 오류가 발생했습니다!
               </Font.Bold>
-              <TouchableOpacity className="bg-Button-red rounded-xl px-4 py-2 mt-4">
+              <TouchableOpacity
+                className="bg-Button-red rounded-xl px-4 py-2 mt-4"
+                onPress={() =>
+                  navigation.reset({
+                    index: 0,
+                    routes: [{ name: 'Splash' }],
+                  })
+                }
+              >
                 <Font type="body2" color="white">
                   새로고침
                 </Font>

From 72848a2667b0ba87da0436dc8a030bd9c17256f3 Mon Sep 17 00:00:00 2001
From: d0422 <rlfehd2013@naver.com>
Date: Wed, 25 Sep 2024 20:39:41 +0900
Subject: [PATCH 7/8] =?UTF-8?q?feat:=20withSpotErrorBoundary=EB=A1=9C=20?=
 =?UTF-8?q?=EB=9D=BC=EC=9A=B0=ED=8C=85=20=EA=B0=90=EC=8B=B8=EB=8F=84?=
 =?UTF-8?q?=EB=A1=9D=20=EC=B2=98=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/routes/StackNavigator.tsx             | 53 +++++++++++--------
 1 file changed, 30 insertions(+), 23 deletions(-)

diff --git a/packages/react-native/src/routes/StackNavigator.tsx b/packages/react-native/src/routes/StackNavigator.tsx
index 6cd11e02..cb31fa0d 100644
--- a/packages/react-native/src/routes/StackNavigator.tsx
+++ b/packages/react-native/src/routes/StackNavigator.tsx
@@ -1,17 +1,15 @@
 import { createStackNavigator } from '@react-navigation/stack';
-import { ErrorBoundary } from 'react-error-boundary';
 import { QueryErrorResetBoundary } from '@tanstack/react-query';
-import { useNavigation } from '@react-navigation/native';
 import Login from '@pages/Login/Login';
 import TabScreens from '@pages/TabScreens';
 import CameraPage from '@/pages/CameraPage';
 import SignupStackNavigator from './SignupStackNavigator';
-import { StackNavigation, StackParamList } from '@/types/navigation';
+import { StackParamList } from '@/types/navigation';
 import SettingStackNavigator from './SettingStackNavigator';
 import Landing from '@/pages/Landing';
 import Splash from '@/pages/Splash';
 import TOS from '@/pages/TOS';
-import Error from '@/components/common/Error';
+import withSpotErrorBoundary from '@/components/HOC/withSpotErrorBoundary';
 
 const Stack = createStackNavigator<StackParamList>();
 
@@ -21,28 +19,37 @@ const Stack = createStackNavigator<StackParamList>();
  * 해당 StackNavigator 컴포넌트를 이곳에 추가합니다.
  */
 export default function StackNavigator() {
-  const navigation = useNavigation<StackNavigation<'Home/Main'>>();
   return (
     <QueryErrorResetBoundary>
-      <ErrorBoundary
-        fallback={<Error />}
-        onReset={() => navigation.navigate('Splash')}
+      <Stack.Navigator
+        screenOptions={{
+          headerShown: false,
+        }}
       >
-        <Stack.Navigator
-          screenOptions={{
-            headerShown: false,
-          }}
-        >
-          <Stack.Screen name="Splash" component={Splash} />
-          <Stack.Screen name="TOS" component={TOS} />
-          <Stack.Screen name="Login" component={Login} />
-          <Stack.Screen name="Signup" component={SignupStackNavigator} />
-          <Stack.Screen name="Main" component={TabScreens} />
-          <Stack.Screen name="Camera" component={CameraPage} />
-          <Stack.Screen name="Setting/Main" component={SettingStackNavigator} />
-          <Stack.Screen name="Landing" component={Landing} />
-        </Stack.Navigator>
-      </ErrorBoundary>
+        <Stack.Screen name="Splash" component={withSpotErrorBoundary(Splash)} />
+        <Stack.Screen name="TOS" component={withSpotErrorBoundary(TOS)} />
+        <Stack.Screen name="Login" component={withSpotErrorBoundary(Login)} />
+        <Stack.Screen
+          name="Signup"
+          component={withSpotErrorBoundary(SignupStackNavigator)}
+        />
+        <Stack.Screen
+          name="Main"
+          component={withSpotErrorBoundary(TabScreens)}
+        />
+        <Stack.Screen
+          name="Camera"
+          component={withSpotErrorBoundary(CameraPage)}
+        />
+        <Stack.Screen
+          name="Setting/Main"
+          component={withSpotErrorBoundary(SettingStackNavigator)}
+        />
+        <Stack.Screen
+          name="Landing"
+          component={withSpotErrorBoundary(Landing)}
+        />
+      </Stack.Navigator>
     </QueryErrorResetBoundary>
   );
 }

From 4505c7170cf007b0de89988c7ff376db78354306 Mon Sep 17 00:00:00 2001
From: d0422 <rlfehd2013@naver.com>
Date: Wed, 25 Sep 2024 20:41:18 +0900
Subject: [PATCH 8/8] =?UTF-8?q?feat:=20=EC=97=90=EB=9F=AC=20=EC=BB=B4?=
 =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EB=A9=94=EC=8B=9C=EC=A7=80=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/react-native/src/components/common/Error.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/react-native/src/components/common/Error.tsx b/packages/react-native/src/components/common/Error.tsx
index b0c9e84d..e5388975 100644
--- a/packages/react-native/src/components/common/Error.tsx
+++ b/packages/react-native/src/components/common/Error.tsx
@@ -24,7 +24,10 @@ export default function Error() {
           <View className="flex-1" style={{}}>
             <View className="flex-1 justify-center items-center">
               <Font.Bold type="body2" color="white">
-                오류가 발생했습니다!
+                오류가 발생했어요.
+              </Font.Bold>
+              <Font.Bold type="body2" color="white">
+                잠시 뒤에 시도해볼까요?
               </Font.Bold>
               <TouchableOpacity
                 className="bg-Button-red rounded-xl px-4 py-2 mt-4"