* Remove the keyboardavoidingview in account creation (close #2333) * Smaller pad on desktop/tabletzio/stable
parent
7634b581dd
commit
b9fc152749
|
@ -1,7 +1,6 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import {
|
import {
|
||||||
ActivityIndicator,
|
ActivityIndicator,
|
||||||
KeyboardAvoidingView,
|
|
||||||
ScrollView,
|
ScrollView,
|
||||||
StyleSheet,
|
StyleSheet,
|
||||||
TouchableOpacity,
|
TouchableOpacity,
|
||||||
|
@ -28,6 +27,7 @@ import {IS_PROD} from '#/lib/constants'
|
||||||
import {Step1} from './Step1'
|
import {Step1} from './Step1'
|
||||||
import {Step2} from './Step2'
|
import {Step2} from './Step2'
|
||||||
import {Step3} from './Step3'
|
import {Step3} from './Step3'
|
||||||
|
import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
|
||||||
|
|
||||||
export function CreateAccount({onPressBack}: {onPressBack: () => void}) {
|
export function CreateAccount({onPressBack}: {onPressBack: () => void}) {
|
||||||
const {screen} = useAnalytics()
|
const {screen} = useAnalytics()
|
||||||
|
@ -38,6 +38,7 @@ export function CreateAccount({onPressBack}: {onPressBack: () => void}) {
|
||||||
const {createAccount} = useSessionApi()
|
const {createAccount} = useSessionApi()
|
||||||
const {mutate: setBirthDate} = usePreferencesSetBirthDateMutation()
|
const {mutate: setBirthDate} = usePreferencesSetBirthDateMutation()
|
||||||
const {mutate: setSavedFeeds} = useSetSaveFeedsMutation()
|
const {mutate: setSavedFeeds} = useSetSaveFeedsMutation()
|
||||||
|
const {isTabletOrDesktop} = useWebMediaQueries()
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
screen('CreateAccount')
|
screen('CreateAccount')
|
||||||
|
@ -120,64 +121,62 @@ export function CreateAccount({onPressBack}: {onPressBack: () => void}) {
|
||||||
title={_(msg`Create Account`)}
|
title={_(msg`Create Account`)}
|
||||||
description={_(msg`We're so excited to have you join us!`)}>
|
description={_(msg`We're so excited to have you join us!`)}>
|
||||||
<ScrollView testID="createAccount" style={pal.view}>
|
<ScrollView testID="createAccount" style={pal.view}>
|
||||||
<KeyboardAvoidingView behavior="padding">
|
<View style={styles.stepContainer}>
|
||||||
<View style={styles.stepContainer}>
|
{uiState.step === 1 && (
|
||||||
{uiState.step === 1 && (
|
<Step1 uiState={uiState} uiDispatch={uiDispatch} />
|
||||||
<Step1 uiState={uiState} uiDispatch={uiDispatch} />
|
)}
|
||||||
)}
|
{uiState.step === 2 && (
|
||||||
{uiState.step === 2 && (
|
<Step2 uiState={uiState} uiDispatch={uiDispatch} />
|
||||||
<Step2 uiState={uiState} uiDispatch={uiDispatch} />
|
)}
|
||||||
)}
|
{uiState.step === 3 && (
|
||||||
{uiState.step === 3 && (
|
<Step3 uiState={uiState} uiDispatch={uiDispatch} />
|
||||||
<Step3 uiState={uiState} uiDispatch={uiDispatch} />
|
)}
|
||||||
)}
|
</View>
|
||||||
</View>
|
<View style={[s.flexRow, s.pl20, s.pr20]}>
|
||||||
<View style={[s.flexRow, s.pl20, s.pr20]}>
|
<TouchableOpacity
|
||||||
|
onPress={onPressBackInner}
|
||||||
|
testID="backBtn"
|
||||||
|
accessibilityRole="button">
|
||||||
|
<Text type="xl" style={pal.link}>
|
||||||
|
<Trans>Back</Trans>
|
||||||
|
</Text>
|
||||||
|
</TouchableOpacity>
|
||||||
|
<View style={s.flex1} />
|
||||||
|
{uiState.canNext ? (
|
||||||
<TouchableOpacity
|
<TouchableOpacity
|
||||||
onPress={onPressBackInner}
|
testID="nextBtn"
|
||||||
testID="backBtn"
|
onPress={onPressNext}
|
||||||
accessibilityRole="button">
|
accessibilityRole="button">
|
||||||
<Text type="xl" style={pal.link}>
|
{uiState.isProcessing ? (
|
||||||
<Trans>Back</Trans>
|
<ActivityIndicator />
|
||||||
|
) : (
|
||||||
|
<Text type="xl-bold" style={[pal.link, s.pr5]}>
|
||||||
|
<Trans>Next</Trans>
|
||||||
|
</Text>
|
||||||
|
)}
|
||||||
|
</TouchableOpacity>
|
||||||
|
) : serviceInfoError ? (
|
||||||
|
<TouchableOpacity
|
||||||
|
testID="retryConnectBtn"
|
||||||
|
onPress={() => refetchServiceInfo()}
|
||||||
|
accessibilityRole="button"
|
||||||
|
accessibilityLabel={_(msg`Retry`)}
|
||||||
|
accessibilityHint=""
|
||||||
|
accessibilityLiveRegion="polite">
|
||||||
|
<Text type="xl-bold" style={[pal.link, s.pr5]}>
|
||||||
|
<Trans>Retry</Trans>
|
||||||
</Text>
|
</Text>
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<View style={s.flex1} />
|
) : serviceInfoIsFetching ? (
|
||||||
{uiState.canNext ? (
|
<>
|
||||||
<TouchableOpacity
|
<ActivityIndicator color="#fff" />
|
||||||
testID="nextBtn"
|
<Text type="xl" style={[pal.text, s.pr5]}>
|
||||||
onPress={onPressNext}
|
<Trans>Connecting...</Trans>
|
||||||
accessibilityRole="button">
|
</Text>
|
||||||
{uiState.isProcessing ? (
|
</>
|
||||||
<ActivityIndicator />
|
) : undefined}
|
||||||
) : (
|
</View>
|
||||||
<Text type="xl-bold" style={[pal.link, s.pr5]}>
|
<View style={{height: isTabletOrDesktop ? 50 : 400}} />
|
||||||
<Trans>Next</Trans>
|
|
||||||
</Text>
|
|
||||||
)}
|
|
||||||
</TouchableOpacity>
|
|
||||||
) : serviceInfoError ? (
|
|
||||||
<TouchableOpacity
|
|
||||||
testID="retryConnectBtn"
|
|
||||||
onPress={() => refetchServiceInfo()}
|
|
||||||
accessibilityRole="button"
|
|
||||||
accessibilityLabel={_(msg`Retry`)}
|
|
||||||
accessibilityHint=""
|
|
||||||
accessibilityLiveRegion="polite">
|
|
||||||
<Text type="xl-bold" style={[pal.link, s.pr5]}>
|
|
||||||
<Trans>Retry</Trans>
|
|
||||||
</Text>
|
|
||||||
</TouchableOpacity>
|
|
||||||
) : serviceInfoIsFetching ? (
|
|
||||||
<>
|
|
||||||
<ActivityIndicator color="#fff" />
|
|
||||||
<Text type="xl" style={[pal.text, s.pr5]}>
|
|
||||||
<Trans>Connecting...</Trans>
|
|
||||||
</Text>
|
|
||||||
</>
|
|
||||||
) : undefined}
|
|
||||||
</View>
|
|
||||||
<View style={s.footerSpacer} />
|
|
||||||
</KeyboardAvoidingView>
|
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
</LoggedOutLayout>
|
</LoggedOutLayout>
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in New Issue