forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 馃挮
1import {useCallback, useState} from 'react'
2import {LayoutAnimationConfig} from 'react-native-reanimated'
3import {SafeAreaView} from 'react-native-safe-area-context'
4
5import {logger} from '#/logger'
6import {FindContactsFlow} from '#/components/contacts/FindContactsFlow'
7import {type Action, type State} from '#/components/contacts/state'
8import {ScreenTransition} from '#/components/ScreenTransition'
9import {useOnboardingInternalState} from '../state'
10
11export function StepFindContacts({
12 flowState,
13 flowDispatch,
14}: {
15 flowState: State
16 flowDispatch: React.ActionDispatch<[Action]>
17}) {
18 const {dispatch} = useOnboardingInternalState()
19
20 const [transitionDirection, setTransitionDirection] = useState<
21 'Forward' | 'Backward'
22 >('Forward')
23
24 const isFinalStep = flowState.step === '4: view matches'
25 const onSkip = useCallback(() => {
26 if (!isFinalStep) {
27 logger.metric('onboarding:contacts:skipPressed', {})
28 }
29 dispatch({type: 'next'})
30 }, [dispatch, isFinalStep])
31
32 const canGoBack = flowState.step === '2: verify number'
33 const onBack = useCallback(() => {
34 if (canGoBack) {
35 setTransitionDirection('Backward')
36 flowDispatch({type: 'BACK'})
37 setTimeout(() => {
38 setTransitionDirection('Forward')
39 })
40 } else {
41 dispatch({type: 'prev'})
42 }
43 }, [dispatch, flowDispatch, canGoBack])
44
45 return (
46 <SafeAreaView edges={['left', 'top', 'right']}>
47 <LayoutAnimationConfig skipEntering skipExiting>
48 <ScreenTransition key={flowState.step} direction={transitionDirection}>
49 <FindContactsFlow
50 context="Onboarding"
51 state={flowState}
52 dispatch={flowDispatch}
53 onCancel={onSkip}
54 onBack={onBack}
55 />
56 </ScreenTransition>
57 </LayoutAnimationConfig>
58 </SafeAreaView>
59 )
60}