Skip to content

Commit

Permalink
Merge pull request #48957 from shubham1206agra/test-onboard
Browse files Browse the repository at this point in the history
  • Loading branch information
@francoisl
francoisl committed Sep 17, 2024
2 parents ee772a9 + e829487 commit d5f604e
Show file tree
Hide file tree
Showing 2 changed files with 87 additions and 98 deletions.
107 changes: 51 additions & 56 deletions src/pages/OnboardingPersonalDetails/BaseOnboardingPersonalDetails.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import FormProvider from '@components/Form/FormProvider';
import InputWrapper from '@components/Form/InputWrapper';
import type {FormOnyxValues} from '@components/Form/types';
import HeaderWithBackButton from '@components/HeaderWithBackButton';
import OfflineIndicator from '@components/OfflineIndicator';
import ScreenWrapper from '@components/ScreenWrapper';
import Text from '@components/Text';
import TextInput from '@components/TextInput';
Expand Down Expand Up @@ -113,67 +112,63 @@ function BaseOnboardingPersonalDetails({
return errors;
};

const PersonalDetailsFooterInstance = <OfflineIndicator />;

return (
<ScreenWrapper
includeSafeAreaPaddingBottom={false}
shouldEnableMaxHeight
testID="BaseOnboardingPersonalDetails"
style={[styles.defaultModalContainer, shouldUseNativeStyles && styles.pt8]}
>
<View style={[styles.h100, styles.defaultModalContainer, shouldUseNativeStyles && styles.pt8]}>
<HeaderWithBackButton
shouldShowBackButton
progressBarPercentage={75}
onBackButtonPress={OnboardingFlow.goBack}
/>
<FormProvider
style={[styles.flexGrow1, onboardingIsMediumOrLargerScreenWidth && styles.mt5, onboardingIsMediumOrLargerScreenWidth ? styles.mh8 : styles.mh5]}
formID={ONYXKEYS.FORMS.ONBOARDING_PERSONAL_DETAILS_FORM}
footerContent={shouldUseNarrowLayout && PersonalDetailsFooterInstance}
validate={validate}
onSubmit={completeEngagement}
submitButtonText={translate('common.continue')}
enabledWhenOffline
submitFlexEnabled
shouldValidateOnBlur={false}
shouldValidateOnChange={shouldValidateOnChange}
shouldTrimValues={false}
>
<View style={[onboardingIsMediumOrLargerScreenWidth ? styles.flexRow : styles.flexColumn, styles.mb5]}>
<Text style={styles.textHeadlineH1}>{translate('onboarding.whatsYourName')}</Text>
</View>
<View style={styles.mb4}>
<InputWrapper
InputComponent={TextInput}
ref={inputCallbackRef}
inputID={INPUT_IDS.FIRST_NAME}
name="fname"
label={translate('common.firstName')}
aria-label={translate('common.firstName')}
role={CONST.ROLE.PRESENTATION}
defaultValue={currentUserPersonalDetails?.firstName}
shouldSaveDraft
maxLength={CONST.DISPLAY_NAME.MAX_LENGTH}
spellCheck={false}
/>
</View>
<View>
<InputWrapper
InputComponent={TextInput}
inputID={INPUT_IDS.LAST_NAME}
name="lname"
label={translate('common.lastName')}
aria-label={translate('common.lastName')}
role={CONST.ROLE.PRESENTATION}
defaultValue={currentUserPersonalDetails?.lastName}
shouldSaveDraft
maxLength={CONST.DISPLAY_NAME.MAX_LENGTH}
spellCheck={false}
/>
</View>
</FormProvider>
</View>
<HeaderWithBackButton
shouldShowBackButton
progressBarPercentage={75}
onBackButtonPress={OnboardingFlow.goBack}
/>
<FormProvider
style={[styles.flexGrow1, onboardingIsMediumOrLargerScreenWidth && styles.mt5, onboardingIsMediumOrLargerScreenWidth ? styles.mh8 : styles.mh5]}
formID={ONYXKEYS.FORMS.ONBOARDING_PERSONAL_DETAILS_FORM}
validate={validate}
onSubmit={completeEngagement}
submitButtonText={translate('common.continue')}
enabledWhenOffline
submitFlexEnabled
shouldValidateOnBlur={false}
shouldValidateOnChange={shouldValidateOnChange}
shouldTrimValues={false}
>
<View style={[onboardingIsMediumOrLargerScreenWidth ? styles.flexRow : styles.flexColumn, styles.mb5]}>
<Text style={styles.textHeadlineH1}>{translate('onboarding.whatsYourName')}</Text>
</View>
<View style={styles.mb4}>
<InputWrapper
InputComponent={TextInput}
ref={inputCallbackRef}
inputID={INPUT_IDS.FIRST_NAME}
name="fname"
label={translate('common.firstName')}
aria-label={translate('common.firstName')}
role={CONST.ROLE.PRESENTATION}
defaultValue={currentUserPersonalDetails?.firstName}
shouldSaveDraft
maxLength={CONST.DISPLAY_NAME.MAX_LENGTH}
spellCheck={false}
/>
</View>
<View>
<InputWrapper
InputComponent={TextInput}
inputID={INPUT_IDS.LAST_NAME}
name="lname"
label={translate('common.lastName')}
aria-label={translate('common.lastName')}
role={CONST.ROLE.PRESENTATION}
defaultValue={currentUserPersonalDetails?.lastName}
shouldSaveDraft
maxLength={CONST.DISPLAY_NAME.MAX_LENGTH}
spellCheck={false}
/>
</View>
</FormProvider>
</ScreenWrapper>
);
}
Expand Down
78 changes: 36 additions & 42 deletions src/pages/OnboardingWork/BaseOnboardingWork.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import FormProvider from '@components/Form/FormProvider';
import InputWrapper from '@components/Form/InputWrapper';
import type {FormInputErrors, FormOnyxValues} from '@components/Form/types';
import HeaderWithBackButton from '@components/HeaderWithBackButton';
import OfflineIndicator from '@components/OfflineIndicator';
import ScreenWrapper from '@components/ScreenWrapper';
import Text from '@components/Text';
import TextInput from '@components/TextInput';
Expand All @@ -28,7 +27,6 @@ import type {BaseOnboardingWorkOnyxProps, BaseOnboardingWorkProps} from './types
function BaseOnboardingWork({shouldUseNativeStyles, onboardingPurposeSelected, onboardingPolicyID, route}: BaseOnboardingWorkProps) {
const styles = useThemeStyles();
const {translate} = useLocalize();
const {shouldUseNarrowLayout} = useResponsiveLayout();
const {onboardingIsMediumOrLargerScreenWidth} = useResponsiveLayout();
const {inputCallbackRef} = useAutoFocusInput();

Expand Down Expand Up @@ -66,53 +64,49 @@ function BaseOnboardingWork({shouldUseNativeStyles, onboardingPurposeSelected, o
return errors;
};

const WorkFooterInstance = <OfflineIndicator />;

return (
<ScreenWrapper
includeSafeAreaPaddingBottom={false}
shouldEnableMaxHeight
shouldEnableKeyboardAvoidingView
testID="BaseOnboardingWork"
style={[styles.defaultModalContainer, shouldUseNativeStyles && styles.pt8]}
>
<View style={[styles.h100, styles.defaultModalContainer, shouldUseNativeStyles && styles.pt8]}>
<HeaderWithBackButton
shouldShowBackButton
progressBarPercentage={onboardingPurposeSelected === CONST.ONBOARDING_CHOICES.MANAGE_TEAM ? 50 : 75}
onBackButtonPress={OnboardingFlow.goBack}
/>
<FormProvider
style={[styles.flexGrow1, onboardingIsMediumOrLargerScreenWidth && styles.mt5, onboardingIsMediumOrLargerScreenWidth ? styles.mh8 : styles.mh5]}
formID={ONYXKEYS.FORMS.ONBOARDING_PERSONAL_WORK}
footerContent={shouldUseNarrowLayout && WorkFooterInstance}
validate={validate}
onSubmit={completeEngagement}
submitButtonText={translate('common.continue')}
enabledWhenOffline
submitFlexEnabled
shouldValidateOnBlur
shouldValidateOnChange
shouldTrimValues={false}
>
<View style={[onboardingIsMediumOrLargerScreenWidth ? styles.flexRow : styles.flexColumn, styles.mb5]}>
<Text style={[styles.textHeadlineH1, styles.textXXLarge]}>{translate('onboarding.whereYouWork')}</Text>
</View>
<View style={styles.mb4}>
<InputWrapper
InputComponent={TextInput}
ref={inputCallbackRef}
inputID={INPUT_IDS.WORK}
name="fwork"
label={translate('common.businessName')}
aria-label={translate('common.businessName')}
role={CONST.ROLE.PRESENTATION}
shouldSaveDraft
maxLength={CONST.TITLE_CHARACTER_LIMIT}
spellCheck={false}
/>
</View>
</FormProvider>
</View>
<HeaderWithBackButton
shouldShowBackButton
progressBarPercentage={onboardingPurposeSelected === CONST.ONBOARDING_CHOICES.MANAGE_TEAM ? 50 : 75}
onBackButtonPress={OnboardingFlow.goBack}
/>
<FormProvider
style={[styles.flexGrow1, onboardingIsMediumOrLargerScreenWidth && styles.mt5, onboardingIsMediumOrLargerScreenWidth ? styles.mh8 : styles.mh5]}
formID={ONYXKEYS.FORMS.ONBOARDING_PERSONAL_WORK}
validate={validate}
onSubmit={completeEngagement}
submitButtonText={translate('common.continue')}
enabledWhenOffline
submitFlexEnabled
shouldValidateOnBlur
shouldValidateOnChange
shouldTrimValues={false}
>
<View style={[onboardingIsMediumOrLargerScreenWidth ? styles.flexRow : styles.flexColumn, styles.mb5]}>
<Text style={[styles.textHeadlineH1, styles.textXXLarge]}>{translate('onboarding.whereYouWork')}</Text>
</View>
<View style={styles.mb4}>
<InputWrapper
InputComponent={TextInput}
ref={inputCallbackRef}
inputID={INPUT_IDS.WORK}
name="fwork"
label={translate('common.businessName')}
aria-label={translate('common.businessName')}
role={CONST.ROLE.PRESENTATION}
shouldSaveDraft
maxLength={CONST.TITLE_CHARACTER_LIMIT}
spellCheck={false}
/>
</View>
</FormProvider>
</ScreenWrapper>
);
}
Expand Down

0 comments on commit d5f604e

Please sign in to comment.