feat: better error management actions

parti-renaissance · Jun 12, 2024 · cc1ac6b · cc1ac6b
1 parent 81f571b
commit cc1ac6b
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 9 deletions.
diff --git a/app/(tabs)/actions/index.tsx b/app/(tabs)/actions/index.tsx
@@ -5,11 +5,12 @@ import ActionForm from '@/components/ActionForm/ActionForm'
 import AddressAutocomplete from '@/components/AddressAutoComplete/AddressAutocomplete'
 import Select from '@/components/base/Select/Select'
 import Text from '@/components/base/Text'
-import BoundarySuspenseWrapper from '@/components/BoundarySuspenseWrapper'
+import BoundarySuspenseWrapper, { DefaultErrorFallback } from '@/components/BoundarySuspenseWrapper'
 import Button from '@/components/Button'
 import GradientButton from '@/components/Buttons/GradientButton'
 import { ActionCard, ActionVoxCardProps, SubscribeButton } from '@/components/Cards'
 import EmptyState from '@/components/EmptyStates/EmptyEvent/EmptyEvent'
+import PageLayout from '@/components/layouts/PageLayout/PageLayout'
 import MapboxGl from '@/components/Mapbox/Mapbox'
 import MobileWallLayout from '@/components/MobileWallLayout/MobileWallLayout'
 import ModalOrPageBase from '@/components/ModalOrPageBase/ModalOrPageBase'
@@ -22,8 +23,9 @@ import { useSession } from '@/ctx/SessionProvider'
 import { Action, ActionStatus, ActionType, isFullAction, RestAction, RestActionAuthor, RestActionParticipant } from '@/data/restObjects/RestActions'
 import { QUERY_KEY_PAGINATED_ACTIONS, useAction, usePaginatedActions } from '@/hooks/useActions/useActions'
 import { useLazyRef } from '@/hooks/useLazyRef'
-import { QUERY_KEY_LOCATION, useLocation, useLocationPermission } from '@/hooks/useLocation'
+import { LocationPermissionError, QUERY_KEY_LOCATION, useLocation, useLocationPermission } from '@/hooks/useLocation'
 import MapButton from '@/screens/doorToDoor/DoorToDoorMapButton'
+import LocationAuthorization from '@/screens/doorToDoor/LocationAuthorization'
 import { useOnFocus } from '@/utils/useOnFocus.hook'
 import { CameraStop } from '@rnmapbox/maps'
 import { OnPressEvent } from '@rnmapbox/maps/src/types/OnPressEvent'
@@ -75,7 +77,18 @@ export default function ActionsScreen() {
   }
 
   return (
-    <BoundarySuspenseWrapper>
+    <BoundarySuspenseWrapper
+      errorChildren={(props) => {
+        if (props.error instanceof LocationPermissionError) {
+          return <LocationAuthorization onAuthorizationRequest={() => props.resetErrorBoundary()} />
+        }
+        return (
+          <PageLayout.StateFrame>
+            <DefaultErrorFallback {...props} />
+          </PageLayout.StateFrame>
+        )
+      }}
+    >
       <Page />
     </BoundarySuspenseWrapper>
   )

diff --git a/src/components/BoundarySuspenseWrapper.tsx b/src/components/BoundarySuspenseWrapper.tsx
@@ -1,5 +1,4 @@
 import { Suspense } from 'react'
-import { err } from 'react-native-svg'
 import Button from '@/components/Button'
 import PageLayout from '@/components/layouts/PageLayout/PageLayout'
 import { QueryErrorResetBoundary } from '@tanstack/react-query'
@@ -15,7 +14,7 @@ type BoundarySuspenseWrapperProps = {
   errorChildren?: (err: FallbackProps) => React.ReactNode
 }
 
-const DefaultErrorFallback = ({ resetErrorBoundary }: FallbackProps) => (
+export const DefaultErrorFallback = ({ resetErrorBoundary }: FallbackProps) => (
   <>
     <Image source={require('../assets/images/blocs.png')} height={200} width={200} objectFit={'contain'} />
     <Text color="$gray6" textAlign="center">
@@ -34,9 +33,15 @@ const BoundarySuspenseWrapper = (props: BoundarySuspenseWrapperProps) => (
     {({ reset }) => (
       <ErrorBoundary
         onReset={reset}
-        fallbackRender={(EBprops) => (
-          <PageLayout.StateFrame>{props.errorChildren ? props.errorChildren(EBprops) : <DefaultErrorFallback {...EBprops} />}</PageLayout.StateFrame>
-        )}
+        fallbackRender={(EBprops) =>
+          props.errorChildren ? (
+            props.errorChildren(EBprops)
+          ) : (
+            <PageLayout.StateFrame>
+              <DefaultErrorFallback {...EBprops} />
+            </PageLayout.StateFrame>
+          )
+        }
       >
         <Suspense
           fallback={

diff --git a/src/hooks/useLocation.tsx b/src/hooks/useLocation.tsx
@@ -1,7 +1,7 @@
 import { useSuspenseQuery } from '@tanstack/react-query'
 import * as Geolocation from 'expo-location'
 
-class LocationPermissionError extends Error {
+export class LocationPermissionError extends Error {
   constructor() {
     super('Location permission denied')
     this.name = 'LocationPermissionError'