[No QA] Card flow screens #44376
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -2377,6 +2377,34 @@ export default { | |
| benefit4: 'Customizable limits', | ||
| addWorkEmail: 'Add work email address', | ||
| checkingDomain: 'Hang tight! We are still working on enabling your Expensify Cards. Check back here in a few minutes.', | ||
| issueCard: 'Issue card', | ||
|
There was a problem hiding this comment. @koko57 Did we confirm the translation with design team? There was a problem hiding this comment. @DylanDylann translations are in the design doc |
||
| issueNewCard: { | ||
| whoNeedsCard: 'Who needs a card?', | ||
| findMember: 'Find member', | ||
| chooseCardType: 'Choose a card type', | ||
| physicalCard: 'Physical card', | ||
| physicalCardDescription: 'Great for the frequent spender', | ||
| virtualCard: 'Virtual card', | ||
| virtualCardDescription: 'Instant and flexible', | ||
| chooseLimitType: 'Choose a limit type', | ||
| smartLimit: 'Smart Limit', | ||
| smartLimitDescription: 'Spend up to a certain amount before requiring approval', | ||
| monthly: 'Monthly', | ||
| monthlyDescription: 'Spend up to a certain amount per month', | ||
| fixedAmount: 'Fixed amount', | ||
| fixedAmountDescription: 'Spend up to a certain amount once', | ||
| setLimit: 'Set a limit', | ||
| giveItName: 'Give it a name', | ||
| giveItNameInstruction: 'Make it unique enough to tell apart from the other. Specific use cases are even better!', | ||
| cardName: 'Card name', | ||
| letsDoubleCheck: 'Let’s double check that everything looks right.', | ||
| willBeReady: 'This card will be ready to use immediately.', | ||
| cardholder: 'Cardholder', | ||
| cardType: 'Card type', | ||
| limit: 'Limit', | ||
| limitType: 'Limit type', | ||
| name: 'Name', | ||
| }, | ||
| }, | ||
| reimburse: { | ||
| captureReceipts: 'Capture receipts', | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,61 @@ | ||
| import React from 'react'; | ||
| import {View} from 'react-native'; | ||
| import FormProvider from '@components/Form/FormProvider'; | ||
| import HeaderWithBackButton from '@components/HeaderWithBackButton'; | ||
| import InteractiveStepSubHeader from '@components/InteractiveStepSubHeader'; | ||
| import ScreenWrapper from '@components/ScreenWrapper'; | ||
| import Text from '@components/Text'; | ||
| import useLocalize from '@hooks/useLocalize'; | ||
| import useThemeStyles from '@hooks/useThemeStyles'; | ||
| import Navigation from '@navigation/Navigation'; | ||
| import * as Card from '@userActions/Card'; | ||
| import CONST from '@src/CONST'; | ||
| import ONYXKEYS from '@src/ONYXKEYS'; | ||
|
|
||
| function AssigneeStep() { | ||
| const {translate} = useLocalize(); | ||
| const styles = useThemeStyles(); | ||
|
|
||
| const submit = () => { | ||
| // TODO: the logic will be created in https://github.com/Expensify/App/issues/44309 | ||
| Card.setIssueNewCardStep(CONST.EXPENSIFY_CARD.STEP.CARD_TYPE); | ||
| }; | ||
|
|
||
| const handleBackButtonPress = () => { | ||
| Navigation.goBack(); | ||
| }; | ||
|
|
||
| return ( | ||
| <ScreenWrapper | ||
| testID={AssigneeStep.displayName} | ||
| includeSafeAreaPaddingBottom={false} | ||
| shouldEnablePickerAvoiding={false} | ||
| shouldEnableMaxHeight | ||
| > | ||
| <HeaderWithBackButton | ||
| title={translate('workspace.card.issueCard')} | ||
| onBackButtonPress={handleBackButtonPress} | ||
| /> | ||
| <View style={[styles.ph5, styles.mb5, styles.mt3, {height: CONST.BANK_ACCOUNT.STEPS_HEADER_HEIGHT}]}> | ||
| <InteractiveStepSubHeader | ||
| startStepIndex={0} | ||
| stepNames={CONST.EXPENSIFY_CARD.STEP_NAMES} | ||
| /> | ||
| </View> | ||
| <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mv3]}>{translate('workspace.card.issueNewCard.whoNeedsCard')}</Text> | ||
| <FormProvider | ||
| formID={ONYXKEYS.FORMS.ISSUE_NEW_EXPENSIFY_CARD_FORM} | ||
| submitButtonText={translate('common.next')} | ||
| onSubmit={submit} | ||
| style={[styles.mh5, styles.flexGrow1]} | ||
| > | ||
| {/* TODO: the content will be created in https://github.com/Expensify/App/issues/44309 */} | ||
| <View /> | ||
| </FormProvider> | ||
| </ScreenWrapper> | ||
| ); | ||
| } | ||
|
|
||
| AssigneeStep.displayName = 'AssigneeStep'; | ||
|
|
||
| export default AssigneeStep; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,60 @@ | ||
| import React from 'react'; | ||
| import {View} from 'react-native'; | ||
| import FormProvider from '@components/Form/FormProvider'; | ||
| import HeaderWithBackButton from '@components/HeaderWithBackButton'; | ||
| import InteractiveStepSubHeader from '@components/InteractiveStepSubHeader'; | ||
| import ScreenWrapper from '@components/ScreenWrapper'; | ||
| import Text from '@components/Text'; | ||
| import useLocalize from '@hooks/useLocalize'; | ||
| import useThemeStyles from '@hooks/useThemeStyles'; | ||
| import * as Card from '@userActions/Card'; | ||
| import CONST from '@src/CONST'; | ||
| import ONYXKEYS from '@src/ONYXKEYS'; | ||
|
|
||
| function CardNameStep() { | ||
| const {translate} = useLocalize(); | ||
| const styles = useThemeStyles(); | ||
|
|
||
| const submit = () => { | ||
| // TODO: the logic will be created in https://github.com/Expensify/App/issues/44309 | ||
| Card.setIssueNewCardStep(CONST.EXPENSIFY_CARD.STEP.CONFIRMATION); | ||
| }; | ||
|
|
||
| const handleBackButtonPress = () => { | ||
| Card.setIssueNewCardStep(CONST.EXPENSIFY_CARD.STEP.LIMIT); | ||
| }; | ||
|
|
||
| return ( | ||
| <ScreenWrapper | ||
| testID={CardNameStep.displayName} | ||
| includeSafeAreaPaddingBottom={false} | ||
| shouldEnablePickerAvoiding={false} | ||
| shouldEnableMaxHeight | ||
| > | ||
| <HeaderWithBackButton | ||
| title={translate('workspace.card.issueCard')} | ||
| onBackButtonPress={handleBackButtonPress} | ||
| /> | ||
| <View style={[styles.ph5, styles.mb5, styles.mt3, {height: CONST.BANK_ACCOUNT.STEPS_HEADER_HEIGHT}]}> | ||
| <InteractiveStepSubHeader | ||
| startStepIndex={4} | ||
| stepNames={CONST.EXPENSIFY_CARD.STEP_NAMES} | ||
| /> | ||
| </View> | ||
| <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mv3]}>{translate('workspace.card.issueNewCard.giveItName')}</Text> | ||
| <FormProvider | ||
| formID={ONYXKEYS.FORMS.ISSUE_NEW_EXPENSIFY_CARD_FORM} | ||
| submitButtonText={translate('common.next')} | ||
| onSubmit={submit} | ||
| style={[styles.mh5, styles.flexGrow1]} | ||
| > | ||
| {/* TODO: the content will be created in https://github.com/Expensify/App/issues/44309 */} | ||
| <View /> | ||
| </FormProvider> | ||
| </ScreenWrapper> | ||
| ); | ||
| } | ||
|
|
||
| CardNameStep.displayName = 'CardNameStep'; | ||
|
|
||
| export default CardNameStep; |
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
are these changes necessary?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
for sure not, reverting!