11/* eslint-disable react/react-in-jsx-scope */
22import { Env } from '@env' ;
33import { useColorScheme } from 'nativewind' ;
4- import React , { useEffect } from 'react' ;
4+ import React , { useCallback , useEffect } from 'react' ;
55import { useTranslation } from 'react-i18next' ;
66
77import { BackgroundGeolocationItem } from '@/components/settings/background-geolocation-item' ;
@@ -15,15 +15,19 @@ import { ThemeItem } from '@/components/settings/theme-item';
1515import { ToggleItem } from '@/components/settings/toggle-item' ;
1616import { UnitSelectionBottomSheet } from '@/components/settings/unit-selection-bottom-sheet' ;
1717import { FocusAwareStatusBar , ScrollView } from '@/components/ui' ;
18+ import { AlertDialog , AlertDialogBackdrop , AlertDialogBody , AlertDialogContent , AlertDialogFooter , AlertDialogHeader } from '@/components/ui/alert-dialog' ;
1819import { Box } from '@/components/ui/box' ;
20+ import { Button , ButtonText } from '@/components/ui/button' ;
1921import { Card } from '@/components/ui/card' ;
2022import { Heading } from '@/components/ui/heading' ;
23+ import { Text } from '@/components/ui/text' ;
2124import { VStack } from '@/components/ui/vstack' ;
2225import { useAnalytics } from '@/hooks/use-analytics' ;
2326import { useAuth , useAuthStore } from '@/lib' ;
2427import { logger } from '@/lib/logging' ;
2528import { getBaseApiUrl } from '@/lib/storage/app' ;
2629import { openLinkInBrowser } from '@/lib/utils' ;
30+ import { clearAllAppData } from '@/services/app-reset.service' ;
2731import { useCoreStore } from '@/stores/app/core-store' ;
2832import { useUnitsStore } from '@/stores/units/store' ;
2933
@@ -36,6 +40,7 @@ export default function Settings() {
3640 const { login, status, isAuthenticated } = useAuth ( ) ;
3741 const [ showServerUrl , setShowServerUrl ] = React . useState ( false ) ;
3842 const [ showUnitSelection , setShowUnitSelection ] = React . useState ( false ) ;
43+ const [ showLogoutConfirm , setShowLogoutConfirm ] = React . useState ( false ) ;
3944 const activeUnit = useCoreStore ( ( state ) => state . activeUnit ) ;
4045 const { units } = useUnitsStore ( ) ;
4146
@@ -44,6 +49,30 @@ export default function Settings() {
4449 return activeUnit ?. Name || t ( 'common.unknown' ) ;
4550 } , [ activeUnit , t ] ) ;
4651
52+ /**
53+ * Handles logout confirmation - clears all data and signs out
54+ */
55+ const handleLogoutConfirm = useCallback ( async ( ) => {
56+ setShowLogoutConfirm ( false ) ;
57+
58+ trackEvent ( 'user_logout_confirmed' , {
59+ hadActiveUnit : ! ! activeUnit ,
60+ } ) ;
61+
62+ // Clear all app data first using the centralized service
63+ try {
64+ await clearAllAppData ( ) ;
65+ } catch ( error ) {
66+ logger . error ( {
67+ message : 'Error during app data cleanup on logout' ,
68+ context : { error } ,
69+ } ) ;
70+ }
71+
72+ // Then sign out
73+ await signOut ( ) ;
74+ } , [ signOut , trackEvent , activeUnit ] ) ;
75+
4776 const handleLoginInfoSubmit = async ( data : { username : string ; password : string } ) => {
4877 logger . info ( {
4978 message : 'Updating login info' ,
@@ -89,7 +118,7 @@ export default function Settings() {
89118 < Item text = { t ( 'settings.server' ) } value = { getBaseApiUrl ( ) } onPress = { ( ) => setShowServerUrl ( true ) } textStyle = "text-info-600" />
90119 < Item text = { t ( 'settings.login_info' ) } onPress = { ( ) => setShowLoginInfo ( true ) } textStyle = "text-info-600" />
91120 < Item text = { t ( 'settings.active_unit' ) } value = { activeUnitName } onPress = { ( ) => setShowUnitSelection ( true ) } textStyle = "text-info-600" />
92- < Item text = { t ( 'settings.logout' ) } onPress = { signOut } textStyle = "text-error-600" />
121+ < Item text = { t ( 'settings.logout' ) } onPress = { ( ) => setShowLogoutConfirm ( true ) } textStyle = "text-error-600" />
93122 </ VStack >
94123 </ Card >
95124
@@ -122,6 +151,27 @@ export default function Settings() {
122151 < LoginInfoBottomSheet isOpen = { showLoginInfo } onClose = { ( ) => setShowLoginInfo ( false ) } onSubmit = { handleLoginInfoSubmit } />
123152 < ServerUrlBottomSheet isOpen = { showServerUrl } onClose = { ( ) => setShowServerUrl ( false ) } />
124153 < UnitSelectionBottomSheet isOpen = { showUnitSelection } onClose = { ( ) => setShowUnitSelection ( false ) } />
154+
155+ { /* Logout Confirmation Dialog */ }
156+ < AlertDialog isOpen = { showLogoutConfirm } onClose = { ( ) => setShowLogoutConfirm ( false ) } >
157+ < AlertDialogBackdrop />
158+ < AlertDialogContent >
159+ < AlertDialogHeader >
160+ < Heading size = "lg" > { t ( 'settings.logout_confirm_title' ) } </ Heading >
161+ </ AlertDialogHeader >
162+ < AlertDialogBody >
163+ < Text > { t ( 'settings.logout_confirm_message' ) } </ Text >
164+ </ AlertDialogBody >
165+ < AlertDialogFooter >
166+ < Button variant = "outline" action = "secondary" onPress = { ( ) => setShowLogoutConfirm ( false ) } >
167+ < ButtonText > { t ( 'common.cancel' ) } </ ButtonText >
168+ </ Button >
169+ < Button action = "negative" onPress = { handleLogoutConfirm } >
170+ < ButtonText > { t ( 'settings.logout' ) } </ ButtonText >
171+ </ Button >
172+ </ AlertDialogFooter >
173+ </ AlertDialogContent >
174+ </ AlertDialog >
125175 </ Box >
126176 ) ;
127177}
0 commit comments