From 8cad10e0c22323a2e1be0d250fe5d5861cb73c81 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Mon, 9 Sep 2024 10:59:30 +0200 Subject: [PATCH 01/16] feat: create base feed selector modal --- src/languages/en.ts | 1 + src/languages/es.ts | 1 + ...orkspaceMemberDetailsFeedSelectorModal.tsx | 107 ++++++++++++++++++ .../members/WorkspaceMemberDetailsPage.tsx | 22 +++- 4 files changed, 126 insertions(+), 5 deletions(-) create mode 100644 src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx diff --git a/src/languages/en.ts b/src/languages/en.ts index 10d981701d70..c862098c629d 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -2822,6 +2822,7 @@ export default { startTransactionDate: 'Start transaction date', cardName: 'Card name', assignedYouCard: (assigner: string) => `${assigner} assigned you a company card! Imported transactions will appear in this chat.`, + chooseCardFeed: 'Choose card feed', }, expensifyCard: { issueAndManageCards: 'Issue and manage your Expensify Cards', diff --git a/src/languages/es.ts b/src/languages/es.ts index cded5fbf1724..17be04645b59 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -2867,6 +2867,7 @@ export default { startTransactionDate: 'Fecha de inicio de transacciones', cardName: 'Nombre de la tarjeta', assignedYouCard: (assigner: string) => `¡${assigner} te ha asignado una tarjeta de empresa! Las transacciones importadas aparecerán en este chat.`, + chooseCardFeed: 'Elige feed de tarjetas', }, expensifyCard: { issueAndManageCards: 'Emitir y gestionar Tarjetas Expensify', diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx new file mode 100644 index 000000000000..cedf871a8dfc --- /dev/null +++ b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx @@ -0,0 +1,107 @@ +import React, {useState} from 'react'; +import FormAlertWithSubmitButton from '@components/FormAlertWithSubmitButton'; +import HeaderWithBackButton from '@components/HeaderWithBackButton'; +import Icon from '@components/Icon'; +import Modal from '@components/Modal'; +import ScreenWrapper from '@components/ScreenWrapper'; +import SelectionList from '@components/SelectionList'; +import RadioListItem from '@components/SelectionList/RadioListItem'; +import type {ListItem} from '@components/SelectionList/types'; +import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; +import * as CardUtils from '@libs/CardUtils'; +import variables from '@styles/variables'; +import CONST from '@src/CONST'; + +type CardFeedListItem = ListItem & { + /** Card feed value */ + value: string; +}; + +const cardFeeds = { + companyCardNicknames: { + cdfbmo: 'BMO MasterCard', + }, +}; + +type WorkspaceMemberDetailsFeedSelectorModalProps = { + /** Whether the modal is visible */ + isVisible: boolean; + + /** Callback for closing modal */ + onClose: () => void; +}; + +function WorkspaceMemberDetailsFeedSelectorModal({isVisible, onClose}: WorkspaceMemberDetailsFeedSelectorModalProps) { + const styles = useThemeStyles(); + const {translate} = useLocalize(); + + const [selectedFeed, setSelectedFeed] = useState(''); + const [shouldShowError, setShouldShowError] = useState(false); + + const handleSubmit = () => { + if (!selectedFeed) { + setShouldShowError(true); + return; + } + console.log(selectedFeed); + }; + + const handleSelectFeed = (feed: CardFeedListItem) => { + setSelectedFeed(feed.value); + setShouldShowError(false); + }; + + const feeds: CardFeedListItem[] = Object.entries(cardFeeds?.companyCardNicknames ?? {}).map(([key, value]) => ({ + value: key, + text: value, + keyForList: key, + isSelected: selectedFeed === key, + leftElement: ( + + ), + })); + + return ( + + + + + + + + ); +} + +WorkspaceMemberDetailsFeedSelectorModal.displayName = 'WorkspaceMemberDetailsFeedSelectorModal'; + +export default WorkspaceMemberDetailsFeedSelectorModal; diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx index fb9e32a36ad9..d045eace3713 100644 --- a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx +++ b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx @@ -28,6 +28,7 @@ import Navigation from '@navigation/Navigation'; import type {SettingsNavigatorParamList} from '@navigation/types'; import NotFoundPage from '@pages/ErrorPage/NotFoundPage'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; +import WorkspaceMemberDetailsFeedSelectorModal from '@pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal'; import type {WithPolicyAndFullscreenLoadingProps} from '@pages/workspace/withPolicyAndFullscreenLoading'; import withPolicyAndFullscreenLoading from '@pages/workspace/withPolicyAndFullscreenLoading'; import variables from '@styles/variables'; @@ -79,6 +80,7 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM const [allCardsList] = useOnyx(`${ONYXKEYS.COLLECTION.WORKSPACE_CARDS_LIST}`); const [isRemoveMemberConfirmModalVisible, setIsRemoveMemberConfirmModalVisible] = useState(false); const [isRoleSelectionModalVisible, setIsRoleSelectionModalVisible] = useState(false); + const [isFeedSelectorModalVisible, setIsFeedSelectorModalVisible] = useState(false); const accountID = Number(route.params.accountID); const policyID = route.params.policyID; @@ -95,6 +97,8 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM const ownerDetails = personalDetails?.[policy?.ownerAccountID ?? -1] ?? ({} as PersonalDetails); const policyOwnerDisplayName = ownerDetails.displayName ?? policy?.owner ?? ''; + const hasMultipleFeeds = true; + const memberCards = useMemo(() => { if (!expensifyCardsList) { return []; @@ -185,7 +189,11 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM [policyID], ); - const navigateToIssueNewCard = useCallback(() => { + const handleIssueNewCard = useCallback(() => { + if (hasMultipleFeeds) { + setIsFeedSelectorModalVisible(true); + return; + } const activeRoute = Navigation.getActiveRoute(); Card.setIssueNewCardStepAndData({ @@ -196,7 +204,7 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM isEditing: false, }); Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_ISSUE_NEW.getRoute(policyID, activeRoute)); - }, [memberLogin, policyID]); + }, [hasMultipleFeeds, memberLogin, policyID]); const openRoleSelectionModal = useCallback(() => { setIsRoleSelectionModalVisible(true); @@ -237,7 +245,7 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM subtitle={policy?.name} /> - + - + )} + setIsFeedSelectorModalVisible(false)} + /> From b71b3145ce96c0e31d9938bbbc9cb1ed01f54ca1 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Tue, 10 Sep 2024 21:23:04 +0200 Subject: [PATCH 02/16] fix: revert changes --- .../companyCards/WorkspaceCompanyCardFeedSelectorPage.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/pages/workspace/companyCards/WorkspaceCompanyCardFeedSelectorPage.tsx b/src/pages/workspace/companyCards/WorkspaceCompanyCardFeedSelectorPage.tsx index ab60cd4f8141..b1876c17efd5 100644 --- a/src/pages/workspace/companyCards/WorkspaceCompanyCardFeedSelectorPage.tsx +++ b/src/pages/workspace/companyCards/WorkspaceCompanyCardFeedSelectorPage.tsx @@ -42,8 +42,6 @@ const mockedData: CardFeeds = { }, companyCardNicknames: { cdfbmo: 'BMO MasterCard', - vcf: 'Visa Corporate Card', - gl1025: 'Corporate Amex', }, }; From 3d1c4ea30e532a57f0853c0cea4530fee9cb4c6b Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Wed, 11 Sep 2024 09:02:02 +0200 Subject: [PATCH 03/16] feat: show expensify card feed if enabled --- ...orkspaceMemberDetailsFeedSelectorModal.tsx | 28 ++++++++++++++++++- .../members/WorkspaceMemberDetailsPage.tsx | 1 + 2 files changed, 28 insertions(+), 1 deletion(-) diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx index 91afd447e238..bd7d885ea365 100644 --- a/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx +++ b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx @@ -1,4 +1,5 @@ import React, {useState} from 'react'; +import ExpensifyCardImage from '@assets/images/expensify-card.svg'; import FormAlertWithSubmitButton from '@components/FormAlertWithSubmitButton'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import Icon from '@components/Icon'; @@ -22,6 +23,8 @@ type CardFeedListItem = ListItem & { const cardFeeds = { companyCardNicknames: { cdfbmo: 'BMO MasterCard', + vcf: 'Visa Corporate Card', + gl1025: 'Corporate Amex', }, }; @@ -31,6 +34,9 @@ type WorkspaceMemberDetailsFeedSelectorModalProps = { /** Callback for closing modal */ onClose: () => void; + + /** The policy ID */ + policyID: string; }; function WorkspaceMemberDetailsFeedSelectorModal({isVisible, onClose, policyID}: WorkspaceMemberDetailsFeedSelectorModalProps) { @@ -56,7 +62,7 @@ function WorkspaceMemberDetailsFeedSelectorModal({isVisible, onClose, policyID}: setShouldShowError(false); }; - const feeds: CardFeedListItem[] = Object.entries(cardFeeds?.companyCardNicknames ?? {}).map(([key, value]) => ({ + const companyCardFeeds: CardFeedListItem[] = Object.entries(cardFeeds?.companyCardNicknames ?? {}).map(([key, value]) => ({ value: key, text: value, keyForList: key, @@ -71,6 +77,26 @@ function WorkspaceMemberDetailsFeedSelectorModal({isVisible, onClose, policyID}: ), })); + const feeds = workspaceAccountID + ? [ + ...companyCardFeeds, + { + value: 'expensifyCard', + text: translate('workspace.common.expensifyCard'), + keyForList: 'expensifyCard', + isSelected: selectedFeed === 'expensifyCard', + leftElement: ( + + ), + }, + ] + : companyCardFeeds; + return ( setIsFeedSelectorModalVisible(false)} + policyID={policyID} /> From 23b1bb20c77f36a43eee6eda70b3e6adc4e6c557 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Wed, 11 Sep 2024 20:11:57 +0200 Subject: [PATCH 04/16] feat: navigate to a proper page --- .../members/WorkspaceMemberDetailsFeedSelectorModal.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx index bd7d885ea365..67b4c296c122 100644 --- a/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx +++ b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx @@ -12,8 +12,10 @@ import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as CardUtils from '@libs/CardUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; +import Navigation from '@navigation/Navigation'; import variables from '@styles/variables'; import CONST from '@src/CONST'; +import ROUTES from '@src/ROUTES'; type CardFeedListItem = ListItem & { /** Card feed value */ @@ -54,7 +56,11 @@ function WorkspaceMemberDetailsFeedSelectorModal({isVisible, onClose, policyID}: setShouldShowError(true); return; } - console.log(selectedFeed); + if (selectedFeed === 'expensifyCard') { + Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_ISSUE_NEW.getRoute(policyID)); + } else { + Navigation.navigate(ROUTES.WORKSPACE_COMPANY_CARDS_ASSIGN_CARD.getRoute(policyID, selectedFeed)); + } }; const handleSelectFeed = (feed: CardFeedListItem) => { From 6f43d59e52328b668df090a660cef3d2b986ab3b Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Fri, 13 Sep 2024 14:07:01 +0700 Subject: [PATCH 05/16] fix: minor improvements --- src/CONST.ts | 1 + .../WorkspaceMemberDetailsFeedSelectorModal.tsx | 10 ++++++---- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/src/CONST.ts b/src/CONST.ts index 60f668b7f15c..f9fa56b0a6f6 100755 --- a/src/CONST.ts +++ b/src/CONST.ts @@ -2419,6 +2419,7 @@ const CONST = { }, }, EXPENSIFY_CARD: { + NAME: 'expensifyCard', BANK: 'Expensify Card', FRAUD_TYPES: { DOMAIN: 'domain', diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx index 67b4c296c122..31ccf6b58293 100644 --- a/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx +++ b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx @@ -22,6 +22,7 @@ type CardFeedListItem = ListItem & { value: string; }; +// TODO: mocking now, replace with proper data from Onyx const cardFeeds = { companyCardNicknames: { cdfbmo: 'BMO MasterCard', @@ -56,11 +57,12 @@ function WorkspaceMemberDetailsFeedSelectorModal({isVisible, onClose, policyID}: setShouldShowError(true); return; } - if (selectedFeed === 'expensifyCard') { + if (selectedFeed === CONST.EXPENSIFY_CARD.NAME) { Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_ISSUE_NEW.getRoute(policyID)); } else { Navigation.navigate(ROUTES.WORKSPACE_COMPANY_CARDS_ASSIGN_CARD.getRoute(policyID, selectedFeed)); } + onClose(); }; const handleSelectFeed = (feed: CardFeedListItem) => { @@ -87,10 +89,10 @@ function WorkspaceMemberDetailsFeedSelectorModal({isVisible, onClose, policyID}: ? [ ...companyCardFeeds, { - value: 'expensifyCard', + value: CONST.EXPENSIFY_CARD.NAME, text: translate('workspace.common.expensifyCard'), - keyForList: 'expensifyCard', - isSelected: selectedFeed === 'expensifyCard', + keyForList: CONST.EXPENSIFY_CARD.NAME, + isSelected: selectedFeed === CONST.EXPENSIFY_CARD.NAME, leftElement: ( Date: Fri, 13 Sep 2024 16:38:38 +0700 Subject: [PATCH 06/16] fix: minor change --- src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx index 1861092a2806..1ac456947dd3 100644 --- a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx +++ b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx @@ -73,7 +73,6 @@ type WorkspaceMemberDetailsPageProps = Omit { if (!expensifyCardsList) { From a1c84f40170abad63a983ed7adf22acad2086670 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Mon, 16 Sep 2024 16:34:46 +0700 Subject: [PATCH 07/16] fix: minor improvement --- src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx index 4a2292162997..503322b306c4 100644 --- a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx +++ b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx @@ -82,6 +82,7 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM const policyOwnerDisplayName = ownerDetails.displayName ?? policy?.owner ?? ''; const companyCards = CardUtils.getMemberCards(policy, allCardsList, accountID); + // TODO: for now enabled for testing purposes. Change this to check for the actual multiple feeds when API is ready const hasMultipleFeeds = policy?.areCompanyCardsEnabled; const memberCards = useMemo(() => { @@ -291,7 +292,7 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM onRoleChange={changeRole} onClose={() => setIsRoleSelectionModalVisible(false)} /> - {policy?.areExpensifyCardsEnabled && ( + {(policy?.areExpensifyCardsEnabled || policy?.areCompanyCardsEnabled) && ( <> From e88721ed74163bd9b7377ac3c356573c84637de3 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Mon, 16 Sep 2024 16:44:57 +0700 Subject: [PATCH 08/16] fix: typecheck, routes order --- src/ROUTES.ts | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/src/ROUTES.ts b/src/ROUTES.ts index 7a6363ac275b..9960ff0b58ff 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -969,14 +969,6 @@ const ROUTES = { route: 'settings/workspaces/:policyID/company-cards/select-feed', getRoute: (policyID: string) => `settings/workspaces/${policyID}/company-cards/select-feed` as const, }, - WORKSPACE_EXPENSIFY_CARD: { - route: 'settings/workspaces/:policyID/expensify-card', - getRoute: (policyID: string) => `settings/workspaces/${policyID}/expensify-card` as const, - }, - WORKSPACE_COMPANY_CARDS: { - route: 'settings/workspaces/:policyID/company-cards', - getRoute: (policyID: string) => `settings/workspaces/${policyID}/company-cards` as const, - }, WORKSPACE_COMPANY_CARDS_ASSIGN_CARD: { route: 'settings/workspaces/:policyID/company-cards/:feed/assign-card', getRoute: (policyID: string, feed: string) => `settings/workspaces/${policyID}/company-cards/${feed}/assign-card` as const, @@ -993,6 +985,10 @@ const ROUTES = { route: 'settings/workspaces/:policyID/company-cards/:bank/:cardID/edit/export', getRoute: (policyID: string, cardID: string, bank: string) => `settings/workspaces/${policyID}/company-cards/${bank}/${cardID}/edit/export` as const, }, + WORKSPACE_EXPENSIFY_CARD: { + route: 'settings/workspaces/:policyID/expensify-card', + getRoute: (policyID: string) => `settings/workspaces/${policyID}/expensify-card` as const, + }, WORKSPACE_EXPENSIFY_CARD_DETAILS: { route: 'settings/workspaces/:policyID/expensify-card/:cardID', getRoute: (policyID: string, cardID: string, backTo?: string) => getUrlWithBackToParam(`settings/workspaces/${policyID}/expensify-card/${cardID}`, backTo), From 16175c511ca7ccaea47050d67552a3a43c781c38 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Mon, 16 Sep 2024 20:04:49 +0700 Subject: [PATCH 09/16] fix: lint --- src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx index 503322b306c4..2f5d81d15642 100644 --- a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx +++ b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx @@ -29,7 +29,6 @@ import Navigation from '@navigation/Navigation'; import type {SettingsNavigatorParamList} from '@navigation/types'; import NotFoundPage from '@pages/ErrorPage/NotFoundPage'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; -import WorkspaceMemberDetailsFeedSelectorModal from '@pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal'; import type {WithPolicyAndFullscreenLoadingProps} from '@pages/workspace/withPolicyAndFullscreenLoading'; import withPolicyAndFullscreenLoading from '@pages/workspace/withPolicyAndFullscreenLoading'; import variables from '@styles/variables'; @@ -40,6 +39,7 @@ import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; import type {PersonalDetails, PersonalDetailsList} from '@src/types/onyx'; +import WorkspaceMemberDetailsFeedSelectorModal from './WorkspaceMemberDetailsFeedSelectorModal'; import type {ListItemType} from './WorkspaceMemberDetailsRoleSelectionModal'; import WorkspaceMemberDetailsRoleSelectionModal from './WorkspaceMemberDetailsRoleSelectionModal'; @@ -292,7 +292,7 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM onRoleChange={changeRole} onClose={() => setIsRoleSelectionModalVisible(false)} /> - {(policy?.areExpensifyCardsEnabled || policy?.areCompanyCardsEnabled) && ( + {(policy?.areExpensifyCardsEnabled ?? policy?.areCompanyCardsEnabled) && ( <> From dadb39c2ec6e392c6de3ce69e88cd6e4a72ee058 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Wed, 18 Sep 2024 20:17:23 +0700 Subject: [PATCH 10/16] fix: fix styles for Expensify Card icon --- assets/images/expensify-card.svg | 2 +- .../members/WorkspaceMemberDetailsFeedSelectorModal.tsx | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/assets/images/expensify-card.svg b/assets/images/expensify-card.svg index 52f55778b2bd..2989f5025ae4 100644 --- a/assets/images/expensify-card.svg +++ b/assets/images/expensify-card.svg @@ -1 +1 @@ - \ No newline at end of file + diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx index 31ccf6b58293..f2bbc8d229e2 100644 --- a/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx +++ b/src/pages/workspace/members/WorkspaceMemberDetailsFeedSelectorModal.tsx @@ -96,9 +96,9 @@ function WorkspaceMemberDetailsFeedSelectorModal({isVisible, onClose, policyID}: leftElement: ( ), }, From ae185b1e30b79939f2072a572f349a33683c9209 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Thu, 19 Sep 2024 13:19:09 +0700 Subject: [PATCH 11/16] feat: setup route and types for new member card selector screen --- src/ROUTES.ts | 4 ++++ src/SCREENS.ts | 1 + .../Navigation/AppNavigator/ModalStackNavigators/index.tsx | 1 + .../Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts | 1 + src/libs/Navigation/linkingConfig/config.ts | 3 +++ src/libs/Navigation/types.ts | 4 ++++ src/pages/workspace/withPolicy.tsx | 1 + 7 files changed, 15 insertions(+) diff --git a/src/ROUTES.ts b/src/ROUTES.ts index 183716b1e39c..4546c3d7865e 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -894,6 +894,10 @@ const ROUTES = { route: 'settings/workspaces/:policyID/members/:accountID', getRoute: (policyID: string, accountID: number) => `settings/workspaces/${policyID}/members/${accountID}` as const, }, + WORKSPACE_MEMBER_NEW_CARD: { + route: 'settings/workspaces/:policyID/members/:accountID/new-card', + getRoute: (policyID: string, accountID: number) => `settings/workspaces/${policyID}/members/${accountID}/new-card` as const, + }, WORKSPACE_MEMBER_ROLE_SELECTION: { route: 'settings/workspaces/:policyID/members/:accountID/role-selection', getRoute: (policyID: string, accountID: number) => `settings/workspaces/${policyID}/members/${accountID}/role-selection` as const, diff --git a/src/SCREENS.ts b/src/SCREENS.ts index 2369e231f519..3acc464643a2 100644 --- a/src/SCREENS.ts +++ b/src/SCREENS.ts @@ -464,6 +464,7 @@ const SCREENS = { CATEGORIES_IMPORTED: 'Categories_Imported', MORE_FEATURES: 'Workspace_More_Features', MEMBER_DETAILS: 'Workspace_Member_Details', + MEMBER_NEW_CARD: 'Workspace_Member_NewCard', OWNER_CHANGE_CHECK: 'Workspace_Owner_Change_Check', OWNER_CHANGE_SUCCESS: 'Workspace_Owner_Change_Success', OWNER_CHANGE_ERROR: 'Workspace_Owner_Change_Error', diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx index b4b676bbdec5..9cf0ae067786 100644 --- a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx +++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx @@ -242,6 +242,7 @@ const SettingsModalStackNavigator = createModalStackNavigator require('../../../../pages/workspace/categories/ImportedCategoriesPage').default, [SCREENS.WORKSPACE.UPGRADE]: () => require('../../../../pages/workspace/upgrade/WorkspaceUpgradePage').default, [SCREENS.WORKSPACE.MEMBER_DETAILS]: () => require('../../../../pages/workspace/members/WorkspaceMemberDetailsPage').default, + [SCREENS.WORKSPACE.MEMBER_NEW_CARD]: () => require('../../../../pages/workspace/members/WorkspaceMemberDetailsPage').default, [SCREENS.WORKSPACE.OWNER_CHANGE_CHECK]: () => require('@pages/workspace/members/WorkspaceOwnerChangeWrapperPage').default, [SCREENS.WORKSPACE.OWNER_CHANGE_SUCCESS]: () => require('../../../../pages/workspace/members/WorkspaceOwnerChangeSuccessPage').default, [SCREENS.WORKSPACE.OWNER_CHANGE_ERROR]: () => require('../../../../pages/workspace/members/WorkspaceOwnerChangeErrorPage').default, diff --git a/src/libs/Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts b/src/libs/Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts index bc86a2d77388..c9fcd28c02a7 100755 --- a/src/libs/Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts +++ b/src/libs/Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts @@ -8,6 +8,7 @@ const FULL_SCREEN_TO_RHP_MAPPING: Partial> = { SCREENS.WORKSPACE.INVITE, SCREENS.WORKSPACE.INVITE_MESSAGE, SCREENS.WORKSPACE.MEMBER_DETAILS, + SCREENS.WORKSPACE.MEMBER_NEW_CARD, SCREENS.WORKSPACE.OWNER_CHANGE_CHECK, SCREENS.WORKSPACE.OWNER_CHANGE_SUCCESS, SCREENS.WORKSPACE.OWNER_CHANGE_ERROR, diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts index d2e6191349bd..270261a33383 100644 --- a/src/libs/Navigation/linkingConfig/config.ts +++ b/src/libs/Navigation/linkingConfig/config.ts @@ -612,6 +612,9 @@ const config: LinkingOptions['config'] = { [SCREENS.WORKSPACE.MEMBER_DETAILS]: { path: ROUTES.WORKSPACE_MEMBER_DETAILS.route, }, + [SCREENS.WORKSPACE.MEMBER_NEW_CARD]: { + path: ROUTES.WORKSPACE_MEMBER_NEW_CARD.route, + }, [SCREENS.WORKSPACE.OWNER_CHANGE_SUCCESS]: { path: ROUTES.WORKSPACE_OWNER_CHANGE_SUCCESS.route, }, diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts index 9f76814740d3..fadbbc530cac 100644 --- a/src/libs/Navigation/types.ts +++ b/src/libs/Navigation/types.ts @@ -356,6 +356,10 @@ type SettingsNavigatorParamList = { policyID: string; accountID: string; }; + [SCREENS.WORKSPACE.MEMBER_NEW_CARD]: { + policyID: string; + accountID: string; + }; [SCREENS.WORKSPACE.OWNER_CHANGE_SUCCESS]: { policyID: string; accountID: number; diff --git a/src/pages/workspace/withPolicy.tsx b/src/pages/workspace/withPolicy.tsx index c706e18c688d..13efe968c5ad 100644 --- a/src/pages/workspace/withPolicy.tsx +++ b/src/pages/workspace/withPolicy.tsx @@ -34,6 +34,7 @@ type PolicyRoute = RouteProp< | typeof SCREENS.WORKSPACE.TRAVEL | typeof SCREENS.WORKSPACE.WORKFLOWS_AUTO_REPORTING_FREQUENCY | typeof SCREENS.WORKSPACE.MEMBER_DETAILS + | typeof SCREENS.WORKSPACE.MEMBER_NEW_CARD | typeof SCREENS.WORKSPACE.INVOICES | typeof SCREENS.WORKSPACE.CARD | typeof SCREENS.WORKSPACE.OWNER_CHANGE_CHECK From 7836ac51b1c1a90bcb5a7361bc1a068fb5a5eaa9 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Thu, 19 Sep 2024 13:57:01 +0700 Subject: [PATCH 12/16] fix: style change for transactionDate step in assign card flow --- .../assignCard/TransactionStartDateStep.tsx | 36 +++++++++---------- 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/src/pages/workspace/companyCards/assignCard/TransactionStartDateStep.tsx b/src/pages/workspace/companyCards/assignCard/TransactionStartDateStep.tsx index cfdb09e3df83..9c53889d6519 100644 --- a/src/pages/workspace/companyCards/assignCard/TransactionStartDateStep.tsx +++ b/src/pages/workspace/companyCards/assignCard/TransactionStartDateStep.tsx @@ -99,25 +99,25 @@ function TransactionStartDateStep() { shouldSingleExecuteRowSelect initiallyFocusedOptionKey={dateOptionSelected} shouldUpdateFocusedIndex - containerStyle={[styles.flex0, styles.flexShrink0, styles.flexBasisAuto, styles.pb0]} - // containerStyle={[styles.flexReset, styles.pb0]} + listFooterContent={ + dateOptionSelected === CONST.COMPANY_CARD.TRANSACTION_START_DATE_OPTIONS.CUSTOM ? ( + <> + setIsModalOpened(true)} + /> + setIsModalOpened(false)} + /> + + ) : null + } /> - {dateOptionSelected === CONST.COMPANY_CARD.TRANSACTION_START_DATE_OPTIONS.CUSTOM && ( - <> - setIsModalOpened(true)} - /> - setIsModalOpened(false)} - /> - - )}