fix: rebase/reviews changes

Signed-off-by: clegirar <clemntgirard@gmail.com>

js/packages/screens/gates/Stream/Stream.tsx → js/packages/components/account/StreamWithProgress.tsx

@@ -6,9 +6,8 @@ import { useSelector } from 'react-redux'
 import { UnifiedText } from '@berty/components/shared-components/UnifiedText'
 import { useAppDimensions } from '@berty/contexts/app-dimensions.context'
 import { useStyles } from '@berty/contexts/styles'
-import { useAppDispatch } from '@berty/hooks'
-import { useDeleteAccount, useRestart } from '@berty/hooks'
-import { ScreenFC } from '@berty/navigation'
+import { useAppDispatch, useRestart } from '@berty/hooks'
+import { useDeleteAccount } from '@berty/hooks'
 import {
 	selectDaemonAddress,
 	selectStreamError,
@@ -17,7 +16,7 @@ import {
 } from '@berty/redux/reducers/ui.reducer'
 import { useThemeColor } from '@berty/store'
 
-const StreamInProgressCmp: React.FC<{}> = () => {
+const StreamWithProgressCmp: React.FC<{}> = () => {
 	const { text } = useStyles()
 	const { scaleSize } = useAppDimensions()
 	const colors = useThemeColor()
@@ -63,16 +62,18 @@ const StreamInProgressCmp: React.FC<{}> = () => {
 
 const gutter = 50
 
-export const Stream: ScreenFC<'Gates.Stream'> = () => {
+export const StreamWithProgress = () => {
 	const streamInProgress = useSelector(selectStreamInProgress)
 	const streamError = useSelector(selectStreamError)
 	const deleteAccount = useDeleteAccount()
 	const daemonAddress = useSelector(selectDaemonAddress)
 	const dispatch = useAppDispatch()
 	const restart = useRestart()
 
-	const [newAddress, setNewAddress] = React.useState(daemonAddress)
 	const colors = useThemeColor()
+
+	const [newAddress, setNewAddress] = React.useState(daemonAddress)
+
 	const changeAddress = React.useCallback(() => {
 		dispatch(setDaemonAddress({ value: newAddress }))
 	}, [dispatch, newAddress])
@@ -115,5 +116,5 @@ export const Stream: ScreenFC<'Gates.Stream'> = () => {
 			</View>
 		)
 	}
-	return <StreamInProgressCmp />
+	return <StreamWithProgressCmp />
 }

js/packages/components/account/Unary.tsx

@@ -0,0 +1,16 @@
+import React from 'react'
+import { StatusBar } from 'react-native'
+
+import { FlexCenterViewPriv } from '../flex'
+import { UnifiedText } from '../shared-components/UnifiedText'
+
+export const Unary: React.FC = ({ children }) => {
+	return (
+		<>
+			<StatusBar barStyle='dark-content' />
+			<FlexCenterViewPriv>
+				<UnifiedText>{children}</UnifiedText>
+			</FlexCenterViewPriv>
+		</>
+	)
+}

js/packages/components/account/index.ts

@@ -0,0 +1,2 @@
+export { StreamWithProgress } from './StreamWithProgress'
+export { Unary } from './Unary'

js/packages/components/debug/AppInspector.tsx

@@ -25,7 +25,7 @@ import { UnifiedText } from '../shared-components/UnifiedText'
 
 const { RootDir } = NativeModules
 
-const accountService = createServiceClient(beapi.account.AccountService, rpcBridge, null)
+const accountClient = createServiceClient(beapi.account.AccountService, rpcBridge, null)
 
 const styles = StyleSheet.create({
 	safeViewContainer: {
@@ -142,7 +142,7 @@ const fetchProtoAccountList = (
 	t: any,
 ) => {
 	const f = async () => {
-		const resp = await accountService.listAccounts({})
+		const resp = await accountClient.listAccounts({})
 
 		if (!resp) {
 			updateAccountProtoEntries({})
@@ -193,14 +193,14 @@ const accountAction = async (
 				t('debug.inspector.accounts.action-delete.action-account-manager-confirm'),
 				() => {
 					// close account if necessary
-					accountService
+					accountClient
 						.closeAccount({})
 						.catch((err: Error) => {
 							console.warn(err)
 							Alert.alert(t('debug.inspector.accounts.action-delete.error-close'), err.message)
 						})
 						// delete account
-						.then(() => accountService.deleteAccount({ accountId: accountId }))
+						.then(() => accountClient.deleteAccount({ accountId: accountId }))
 						.then(() => Alert.alert(t('debug.inspector.accounts.action-delete.success-feedback')))
 						.catch((err: Error) => {
 							console.warn(err)

js/packages/components/flex/FlexCenterView.priv.tsx

@@ -0,0 +1,10 @@
+import React from 'react'
+import { View } from 'react-native'
+
+import { useStyles } from '@berty/contexts/styles'
+
+export const FlexCenterViewPriv: React.FC = ({ children }) => {
+	const { flex } = useStyles()
+
+	return <View style={[flex.tiny, flex.align.center, flex.justify.center]}>{children}</View>
+}

js/packages/components/flex/index.ts

@@ -0,0 +1 @@
+export { FlexCenterViewPriv } from './FlexCenterView.priv'

js/packages/hooks/accounts.hooks.ts

@@ -2,12 +2,7 @@ import { useCallback } from 'react'
 
 import beapi from '@berty/api'
 import { selectSelectedAccount } from '@berty/redux/reducers/ui.reducer'
-import {
-	createNewAccount,
-	deleteAccount,
-	updateAccount,
-	switchAccount,
-} from '@berty/utils/accounts/accountUtils'
+import { createAccount, deleteAccount, updateAccount } from '@berty/utils/accounts'
 
 import { useAppDispatch, useAppSelector } from './core.hooks'
 import { useAccount } from './messenger.hooks'
@@ -18,15 +13,10 @@ export const useDeleteAccount = () => {
 	return useCallback(() => deleteAccount(selectedAccount, dispatch), [selectedAccount, dispatch])
 }
 
-export const useSwitchAccount = () => {
-	const dispatch = useAppDispatch()
-	return useCallback((account: string) => switchAccount(account, dispatch), [dispatch])
-}
-
 export const useCreateNewAccount = () => {
 	const dispatch = useAppDispatch()
 	return useCallback(
-		(newConfig?: beapi.account.INetworkConfig) => createNewAccount(dispatch, newConfig),
+		(newConfig?: beapi.account.INetworkConfig) => createAccount(dispatch, newConfig),
 		[dispatch],
 	)
 }

js/packages/hooks/ui.hooks.ts

@@ -1,11 +1,12 @@
 import { useCallback } from 'react'
 
+import { useNavigation } from '@berty/navigation'
 import {
 	PersistentOptionsKeys,
 	selectPersistentOptions,
 } from '@berty/redux/reducers/persistentOptions.reducer'
 import { selectSelectedAccount } from '@berty/redux/reducers/ui.reducer'
-import { restart } from '@berty/utils/accounts/accountUtils'
+import { switchAccountAfterClosing } from '@berty/utils/accounts'
 import { SoundKey } from '@berty/utils/sound/sound.types'
 import { playSound } from '@berty/utils/sound/sounds'
 
@@ -25,7 +26,16 @@ export const usePlaySound = () => {
 }
 
 export const useRestart = () => {
+	const { navigate } = useNavigation()
 	const dispatch = useAppDispatch()
 	const selectedAccount = useAppSelector(selectSelectedAccount)
-	return useCallback(() => restart(selectedAccount, dispatch), [selectedAccount, dispatch])
+	return useCallback(
+		() =>
+			navigate('Account.Closing', {
+				callback: () => {
+					switchAccountAfterClosing(dispatch, selectedAccount)
+				},
+			}),
+		[navigate, selectedAccount, dispatch],
+	)
 }

js/packages/i18n/locale/en-US/messages.json

@@ -589,7 +589,6 @@
 			"title": "Inspector",
 			"accounts": {
 				"title": "Accounts",
-				"unsupported-remote-mode": "Accounts inspector not supported in remote mode",
 				"data-not-found": "Account not in list",
 				"action-delete": {
 					"file-exists": "Account {{accountId}} does not exists, a file has this name though.",

js/packages/messenger-app/App.tsx

@@ -103,7 +103,6 @@ const App: React.FC = () => {
 			<AppDimensionsProvider>
 				<StyleProvider>
 					<ReduxProvider store={reduxStore}>
-						<MessengerEffects />
 						<IconRegistry icons={[EvaIconsPack, FeatherIconsPack, CustomIconsPack]} />
 						<UIKittenProvider>
 							<Background>
@@ -116,6 +115,7 @@ const App: React.FC = () => {
 									>
 										<PermissionsProvider>
 											<NotificationProvider>
+												<MessengerEffects />
 												{Platform.OS !== 'web' ? <BootSplashInhibitor /> : null}
 												<LoaderGate>
 													<MusicPlayerProvider>

js/packages/navigation/stacks.tsx

@@ -14,7 +14,7 @@ import { useAppDimensions } from '@berty/contexts/app-dimensions.context'
 import { useStyles } from '@berty/contexts/styles'
 import { useAppDispatch } from '@berty/hooks'
 import {
-	MESSENGER_APP_STATE,
+	MessengerAppState,
 	selectAppState,
 	selectHandledLink,
 	setHandledLink,
@@ -160,51 +160,31 @@ export const Navigation: React.FC = React.memo(() => {
 	useEffect(() => {
 		console.log('context app State', appState)
 		switch (appState) {
-			case MESSENGER_APP_STATE.ONBOARDING_READY:
+			case MessengerAppState.ONBOARDING:
 				dispatch(
 					CommonActions.reset({
 						routes: [{ name: 'Onboarding.GetStarted' }],
 					}),
 				)
 				return
-			case MESSENGER_APP_STATE.READY:
+			case MessengerAppState.OPENING:
 				dispatch(
 					CommonActions.reset({
-						routes: [{ name: 'Chat.Home' }],
-					}),
-				)
-				return
-			case MESSENGER_APP_STATE.SETUP_FINISHED:
-				dispatch(
-					CommonActions.reset({
-						routes: [{ name: 'Onboarding.SetupFinished' }],
-					}),
-				)
-				return
-			case MESSENGER_APP_STATE.STREAM:
-				dispatch(
-					CommonActions.reset({
-						routes: [{ name: 'Gates.Stream' }],
+						routes: [{ name: 'Account.Opening' }],
 					}),
 				)
 				return
 		}
 	}, [appState, dispatch])
 
-	const initialRoute = React.useCallback(() => {
+	const initialRoute = () => {
 		switch (appState) {
-			case MESSENGER_APP_STATE.READY:
-				return 'Chat.Home'
-			case MESSENGER_APP_STATE.ONBOARDING_READY:
+			case MessengerAppState.ONBOARDING:
 				return 'Onboarding.GetStarted'
-			case MESSENGER_APP_STATE.SETUP_FINISHED:
-				return 'Onboarding.SetupFinished'
-			case MESSENGER_APP_STATE.STREAM:
-				return 'Gates.Stream'
 			default:
 				return 'Chat.Home'
 		}
-	}, [appState])
+	}
 
 	return (
 		<NavigationStack.Navigator
@@ -223,9 +203,30 @@ export const Navigation: React.FC = React.memo(() => {
 						: undefined,
 			}}
 		>
+			{/* Account */}
+			<NavigationStack.Screen
+				name={'Account.Creating'}
+				component={Components.Account.CreatingAccount}
+				options={{ headerShown: false }}
+			/>
+			<NavigationStack.Screen
+				name={'Account.Opening'}
+				component={Components.Account.OpeningAccount}
+				options={{ headerShown: false }}
+			/>
+			<NavigationStack.Screen
+				name={'Account.Closing'}
+				component={Components.Account.ClosingAccount}
+				options={{ headerShown: false }}
+			/>
+			<NavigationStack.Screen
+				name={'Account.Importing'}
+				component={Components.Account.ImportingAccount}
+				options={{ headerShown: false }}
+			/>
 			<NavigationStack.Screen
-				name={'Gates.Stream'}
-				component={Components.Gates.Stream}
+				name={'Account.Deleting'}
+				component={Components.Account.DeletingAccount}
 				options={{ headerShown: false }}
 			/>
 			{/* OnBoarding */}

js/packages/navigation/types.ts

@@ -92,9 +92,14 @@ export type ScreensParams = {
 		previewOnly?: boolean
 	}
 
-	// Gates
-
-	'Gates.Stream': undefined
+	// Account
+
+	'Account.Opening': undefined
+	'Account.Creating': undefined
+	// https://reactnavigation.org/docs/troubleshooting#i-get-the-warning-non-serializable-values-were-found-in-the-navigation-state
+	'Account.Closing': { callback: () => void }
+	'Account.Importing': { filePath: string }
+	'Account.Deleting': undefined
 }
 
 type ScreenProps<T extends keyof ScreensParams> = StackScreenProps<ScreensParams, T>

js/packages/redux/reducers/messenger.reducer.ts

@@ -83,13 +83,14 @@ const getEntitiesInitialState = () => ({
 
 export type MessengerState = ReturnType<typeof getEntitiesInitialState> & {
 	account: beapi.messenger.IAccount
-	initialEventsStreamCompleted: boolean
+	// value that will set to true when messenger EventsStream finished to list events
+	initialEventsListCompleted: boolean
 }
 
 const initialState: MessengerState = {
 	...getEntitiesInitialState(),
 	account: {},
-	initialEventsStreamCompleted: false,
+	initialEventsListCompleted: false,
 }
 
 /**
@@ -193,7 +194,7 @@ const slice = createSlice({
 			},
 		)
 		builder.addCase(messengerActions[beapi.messenger.StreamEvent.Type.TypeListEnded], state => {
-			state.initialEventsStreamCompleted = true
+			state.initialEventsListCompleted = true
 		})
 		builder.addCase(
 			messengerActions[beapi.messenger.StreamEvent.Type.TypeMemberUpdated],
@@ -456,4 +457,7 @@ export const selectInteractionAuthor = (state: LocalRootState, convPk: string, c
 	}
 }
 
+export const selectInitialEventsListCompleted = (state: LocalRootState) =>
+	selectSlice(state).initialEventsListCompleted
+
 export default makeRoot(slice.reducer)

js/packages/redux/reducers/persistentOptions.reducer.ts

@@ -99,7 +99,7 @@ type PersistentOptionsUpdate =
 			payload: PersistentOptionsProfileNotification
 	  }
 
-export type PersistentOptions = {
+type PersistentOptions = {
 	[PersistentOptionsKeys.Notifications]: PersistentOptionsNotifications
 	[PersistentOptionsKeys.Suggestions]: PersistentOptionsSuggestions
 	[PersistentOptionsKeys.Debug]: PersistentOptionsDebug