From a6f0dcb74a8da34060bea7b5745e51947be64348 Mon Sep 17 00:00:00 2001 From: Nicolay Arefyeu Date: Wed, 6 Aug 2025 15:16:06 +0300 Subject: [PATCH 01/13] uber initial page and button --- assets/images/integrationicons/uber.svg | 10 + .../simple-illustration__receipt.svg | 16 ++ src/CONST/index.ts | 9 + src/ROUTES.ts | 9 + src/SCREENS.ts | 1 + .../FocusTrap/WIDE_LAYOUT_INACTIVE_SCREENS.ts | 1 + src/components/Icon/Expensicons.ts | 2 + src/components/Icon/Illustrations.ts | 2 + src/languages/de.ts | 5 + src/languages/en.ts | 5 + src/languages/es.ts | 5 + src/languages/fr.ts | 5 + src/languages/it.ts | 5 + src/languages/ja.ts | 5 + src/languages/nl.ts | 5 + src/languages/pl.ts | 5 + src/languages/pt-BR.ts | 5 + src/languages/zh-hans.ts | 5 + .../OpenPolicyReceiptPartnersPageParams.ts | 5 + src/libs/API/parameters/index.ts | 1 + src/libs/API/types.ts | 1 + src/libs/HttpUtils.ts | 3 +- .../Navigators/WorkspaceSplitNavigator.tsx | 1 + .../RELATIONS/WORKSPACE_TO_RHP.ts | 1 + src/libs/Navigation/linkingConfig/config.ts | 3 + src/libs/Navigation/types.ts | 3 + src/libs/actions/Policy/Policy.ts | 43 +++++ src/libs/prepareRequestPayload/index.ts | 4 + .../WorkspaceReceiptPartnersPage.tsx | 177 ++++++++++++++++++ src/pages/workspace/receiptPartners/types.ts | 16 ++ src/pages/workspace/receiptPartners/utils.tsx | 32 ++++ src/types/onyx/Policy.ts | 53 ++++++ tests/utils/TestNavigationContainer.tsx | 4 + 33 files changed, 446 insertions(+), 1 deletion(-) create mode 100644 assets/images/integrationicons/uber.svg create mode 100644 assets/images/simple-illustrations/simple-illustration__receipt.svg create mode 100644 src/libs/API/parameters/OpenPolicyReceiptPartnersPageParams.ts create mode 100644 src/pages/workspace/receiptPartners/WorkspaceReceiptPartnersPage.tsx create mode 100644 src/pages/workspace/receiptPartners/types.ts create mode 100644 src/pages/workspace/receiptPartners/utils.tsx diff --git a/assets/images/integrationicons/uber.svg b/assets/images/integrationicons/uber.svg new file mode 100644 index 000000000000..79a7c417f694 --- /dev/null +++ b/assets/images/integrationicons/uber.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/assets/images/simple-illustrations/simple-illustration__receipt.svg b/assets/images/simple-illustrations/simple-illustration__receipt.svg new file mode 100644 index 000000000000..9920d0d1c770 --- /dev/null +++ b/assets/images/simple-illustrations/simple-illustration__receipt.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/src/CONST/index.ts b/src/CONST/index.ts index a16fca06f879..9b8a3512fa9d 100755 --- a/src/CONST/index.ts +++ b/src/CONST/index.ts @@ -29,6 +29,7 @@ const ACTIVE_EXPENSIFY_URL = addTrailingForwardSlash(Config?.NEW_EXPENSIFY_URL ? const USE_EXPENSIFY_URL = 'https://use.expensify.com'; const EXPENSIFY_MOBILE_URL = 'https://expensify.com/mobile'; const EXPENSIFY_URL = 'https://www.expensify.com'; +const UBER_CONNECT_URL = 'https://business-integrations.uber.com/connect'; const PLATFORM_OS_MACOS = 'Mac OS'; const PLATFORM_IOS = 'iOS'; const ANDROID_PACKAGE_NAME = 'org.me.mobiexpensifyg'; @@ -416,6 +417,7 @@ const CONST = { }, NEW_EXPENSIFY_URL: ACTIVE_EXPENSIFY_URL, + UBER_CONNECT_URL, APP_DOWNLOAD_LINKS: { ANDROID: `https://play.google.com/store/apps/details?id=${ANDROID_PACKAGE_NAME}`, IOS: 'https://apps.apple.com/us/app/expensify-travel-expense/id471713959', @@ -2906,6 +2908,7 @@ const CONST = { ARE_TAXES_ENABLED: 'tax', ARE_RULES_ENABLED: 'areRulesEnabled', ARE_PER_DIEM_RATES_ENABLED: 'arePerDiemRatesEnabled', + ARE_RECEIPT_PARTNERS_ENABLED: 'areReceiptPartnersEnabled', }, DEFAULT_CATEGORIES: { ADVERTISING: 'Advertising', @@ -2958,6 +2961,12 @@ const CONST = { TOBACCO: 'tobacco', ADULT_ENTERTAINMENT: 'adultEntertainment', }, + RECEIPT_PARTNERS: { + NAME: {UBER: 'uber'}, + NAME_USER_FRIENDLY: { + uber: 'Uber for Business', + }, + }, CONNECTIONS: { NAME: { // Here we will add other connections names when we add support for them diff --git a/src/ROUTES.ts b/src/ROUTES.ts index 10659fe33791..ec8951f40bcd 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -1852,6 +1852,15 @@ const ROUTES = { return getUrlWithBackToParam(`workspaces/${policyID}/per-diem`, backTo); }, }, + WORKSPACE_RECEIPT_PARTNERS: { + route: 'workspaces/:policyID/receipt–partners', + getRoute: (policyID: string | undefined, backTo?: string) => { + if (!policyID) { + Log.warn('Invalid policyID is used to build the WORKSPACE_RECEIPT_PARTNERS route'); + } + return getUrlWithBackToParam(`workspaces/${policyID}/receipt–partners`, backTo); + }, + }, WORKSPACE_PER_DIEM_IMPORT: { route: 'workspaces/:policyID/per-diem/import', getRoute: (policyID: string) => `workspaces/${policyID}/per-diem/import` as const, diff --git a/src/SCREENS.ts b/src/SCREENS.ts index cdfc0971c331..f604a50afe07 100644 --- a/src/SCREENS.ts +++ b/src/SCREENS.ts @@ -623,6 +623,7 @@ const SCREENS = { UPGRADE: 'Workspace_Upgrade', DOWNGRADE: 'Workspace_Downgrade', PAY_AND_DOWNGRADE: 'Workspace_Pay_And_Downgrade', + RECEIPT_PARTNERS: 'Workspace_Receipt_Partners', RULES: 'Policy_Rules', RULES_CUSTOM_NAME: 'Rules_Custom_Name', RULES_AUTO_APPROVE_REPORTS_UNDER: 'Rules_Auto_Approve_Reports_Under', diff --git a/src/components/FocusTrap/WIDE_LAYOUT_INACTIVE_SCREENS.ts b/src/components/FocusTrap/WIDE_LAYOUT_INACTIVE_SCREENS.ts index b44f2008804c..a8c953eab485 100644 --- a/src/components/FocusTrap/WIDE_LAYOUT_INACTIVE_SCREENS.ts +++ b/src/components/FocusTrap/WIDE_LAYOUT_INACTIVE_SCREENS.ts @@ -34,6 +34,7 @@ const WIDE_LAYOUT_INACTIVE_SCREENS: string[] = [ SCREENS.SETTINGS.SAVE_THE_WORLD, SCREENS.WORKSPACE.RULES, SCREENS.WORKSPACE.PER_DIEM, + SCREENS.WORKSPACE.RECEIPT_PARTNERS, ]; export default WIDE_LAYOUT_INACTIVE_SCREENS; diff --git a/src/components/Icon/Expensicons.ts b/src/components/Icon/Expensicons.ts index f162aba0b042..2bd2389eb14f 100644 --- a/src/components/Icon/Expensicons.ts +++ b/src/components/Icon/Expensicons.ts @@ -138,6 +138,7 @@ import QBOCircle from '@assets/images/integrationicons/qbo-icon-circle.svg'; import QBOSquare from '@assets/images/integrationicons/qbo-icon-square.svg'; import SageIntacctSquare from '@assets/images/integrationicons/sage-intacct-icon-square.svg'; import SapSquare from '@assets/images/integrationicons/sap-icon-square.svg'; +import Uber from '@assets/images/integrationicons/uber.svg'; import XeroCircle from '@assets/images/integrationicons/xero-icon-circle.svg'; import XeroSquare from '@assets/images/integrationicons/xero-icon-square.svg'; import InvoiceGeneric from '@assets/images/invoice-generic.svg'; @@ -417,6 +418,7 @@ export { ThreeDots, Transfer, Trashcan, + Uber, Unlock, UpArrow, Upload, diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts index 81b511cce86f..f0c90fd93864 100644 --- a/src/components/Icon/Illustrations.ts +++ b/src/components/Icon/Illustrations.ts @@ -99,6 +99,7 @@ import EmailAddress from '@assets/images/simple-illustrations/simple-illustratio import EmptyState from '@assets/images/simple-illustrations/simple-illustration__empty-state.svg'; import Encryption from '@assets/images/simple-illustrations/simple-illustration__encryption.svg'; import EnvelopeReceipt from '@assets/images/simple-illustrations/simple-illustration__envelopereceipt.svg'; +import ReceiptPartners from '@assets/images/simple-illustrations/simple-illustration__receipt.svg'; import Filters from '@assets/images/simple-illustrations/simple-illustration__filters.svg'; import Flash from '@assets/images/simple-illustrations/simple-illustration__flash.svg'; import FolderOpen from '@assets/images/simple-illustrations/simple-illustration__folder-open.svg'; @@ -313,6 +314,7 @@ export { ChaseCompanyCardDetailLarge, CitibankCompanyCardDetailLarge, MasterCardCompanyCardDetailLarge, + ReceiptPartners, StripeCompanyCardDetailLarge, VisaCompanyCardDetailLarge, WellsFargoCompanyCardDetailLarge, diff --git a/src/languages/de.ts b/src/languages/de.ts index 7ae2952b68f4..9d6711de5cea 100644 --- a/src/languages/de.ts +++ b/src/languages/de.ts @@ -3482,6 +3482,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `Ausgaben von ${displayName}`, deepDiveExpensifyCard: `Expensify Card-Transaktionen werden automatisch in ein mit unserer Integration erstelltes „Expensify Card Liability Account“ exportiert.`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: 'Setzen Sie Tagespauschalen, um die täglichen Ausgaben der Mitarbeiter zu kontrollieren.', amount: 'Betrag', diff --git a/src/languages/en.ts b/src/languages/en.ts index 5f2840d55892..b6775c09680a 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -3475,6 +3475,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `${displayName}'s expenses`, deepDiveExpensifyCard: `Expensify Card transactions will automatically export to an "Expensify Card Liability Account" created with our integration.`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: 'Set per diem rates to control daily employee spend. ', amount: 'Amount', diff --git a/src/languages/es.ts b/src/languages/es.ts index 997d40ed2088..8cb9207863de 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -3467,6 +3467,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `${displayName}'s gastos`, deepDiveExpensifyCard: `Las transacciones de la Tarjeta Expensify se exportan automáticamente a una "Cuenta de Responsabilidad de la Tarjeta Expensify" creada con nuestra integración.`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: 'Establece las tasas per diem para controlar los gastos diarios de los empleados. ', amount: 'Cantidad', diff --git a/src/languages/fr.ts b/src/languages/fr.ts index 50bbffdfce57..9a2056345d87 100644 --- a/src/languages/fr.ts +++ b/src/languages/fr.ts @@ -3490,6 +3490,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `Les dépenses de ${displayName}`, deepDiveExpensifyCard: `Les transactions Expensify Card seront automatiquement exportées vers un « Expensify Card Liability Account » créé avec notre intégration.`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: 'Définissez des taux de per diem pour contrôler les dépenses quotidiennes des employés.', amount: 'Montant', diff --git a/src/languages/it.ts b/src/languages/it.ts index d6ee69ae446f..512ff539224e 100644 --- a/src/languages/it.ts +++ b/src/languages/it.ts @@ -3495,6 +3495,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `Spese di ${displayName}`, deepDiveExpensifyCard: `Le transazioni della carta Expensify verranno esportate automaticamente in un “Conto di responsabilità della carta Expensify” creato con la nostra integrazione.`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: 'Imposta le tariffe di diaria per controllare la spesa giornaliera dei dipendenti.', amount: 'Importo', diff --git a/src/languages/ja.ts b/src/languages/ja.ts index 01f2117b4c55..1fb83243b6e7 100644 --- a/src/languages/ja.ts +++ b/src/languages/ja.ts @@ -3495,6 +3495,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `${displayName}の経費`, deepDiveExpensifyCard: `Expensify Cardの取引は、弊社の統合で作成された 「Expensify Card Liability Account 」に自動的にエクスポートされます。`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: '日当料金を設定して、従業員の1日の支出を管理します。', amount: '金額', diff --git a/src/languages/nl.ts b/src/languages/nl.ts index ff7b9ce910a2..2e29b3f017e7 100644 --- a/src/languages/nl.ts +++ b/src/languages/nl.ts @@ -3502,6 +3502,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `Uitgaven van ${displayName}`, deepDiveExpensifyCard: `Expensify Card transacties worden automatisch geëxporteerd naar een “Expensify Card Liability Account” die is aangemaakt met onze integratie.`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: 'Stel dagvergoedingen in om de dagelijkse uitgaven van werknemers te beheersen.', amount: 'Bedrag', diff --git a/src/languages/pl.ts b/src/languages/pl.ts index 9f37e60dc9b4..46ffc1171dc3 100644 --- a/src/languages/pl.ts +++ b/src/languages/pl.ts @@ -3495,6 +3495,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `Wydatki ${displayName}`, deepDiveExpensifyCard: `Transakcje kartą Expensify będą automatycznie eksportowane na „Konto odpowiedzialności karty Expensify” utworzone za pomocą naszej integracji.`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: 'Ustaw stawki diety, aby kontrolować dzienne wydatki pracowników.', amount: 'Kwota', diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts index 3a2e701ad050..ce9fe143a524 100644 --- a/src/languages/pt-BR.ts +++ b/src/languages/pt-BR.ts @@ -3500,6 +3500,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `Despesas de ${displayName}`, deepDiveExpensifyCard: `As transações do cartão Expensify serão exportadas automaticamente para uma “Conta de responsabilidade do cartão Expensify” criada com nossa integração.`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: 'Defina taxas de diárias para controlar os gastos diários dos funcionários.', amount: 'Quantia', diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts index 94b992065eee..56a75d4b3861 100644 --- a/src/languages/zh-hans.ts +++ b/src/languages/zh-hans.ts @@ -3454,6 +3454,11 @@ const translations = { policyExpenseChatName: ({displayName}: PolicyExpenseChatNameParams) => `${displayName}的费用`, deepDiveExpensifyCard: `Expensify 卡交易将自动导出到与我们集成创建的 “Expensify 卡责任账户”。`, }, + receiptPartners: { + uber: { + subtitle: 'Automate travel and meal delivery expenses across your organization.', + }, + }, perDiem: { subtitle: '设置每日津贴标准以控制员工的日常支出。', amount: '金额', diff --git a/src/libs/API/parameters/OpenPolicyReceiptPartnersPageParams.ts b/src/libs/API/parameters/OpenPolicyReceiptPartnersPageParams.ts new file mode 100644 index 000000000000..43d9e0121a99 --- /dev/null +++ b/src/libs/API/parameters/OpenPolicyReceiptPartnersPageParams.ts @@ -0,0 +1,5 @@ +type OpenPolicyReceiptPartnersPageParams = { + policyID: string; +}; + +export default OpenPolicyReceiptPartnersPageParams; diff --git a/src/libs/API/parameters/index.ts b/src/libs/API/parameters/index.ts index ed1fc2571a33..8abbadff2bb7 100644 --- a/src/libs/API/parameters/index.ts +++ b/src/libs/API/parameters/index.ts @@ -52,6 +52,7 @@ export type {default as OpenReportParams} from './OpenReportParams'; export type {default as OpenRoomMembersPageParams} from './OpenRoomMembersPageParams'; export type {default as OpenPlaidCompanyCardLoginParams} from './OpenPlaidCompanyCardLoginParams'; export type {default as OpenSidePanelParams} from './OpenSidePanelParams'; +export type {default as OpenPolicyReceiptPartnersPageParams} from './OpenPolicyReceiptPartnersPageParams'; export type {default as PaymentCardParams} from './PaymentCardParams'; export type {default as PusherPingParams} from './PusherPingParams'; export type {default as ReconnectAppParams} from './ReconnectAppParams'; diff --git a/src/libs/API/types.ts b/src/libs/API/types.ts index dd2da2d2d754..472c99a3eaeb 100644 --- a/src/libs/API/types.ts +++ b/src/libs/API/types.ts @@ -1061,6 +1061,7 @@ const READ_COMMANDS = { OPEN_WORKSPACE_INVITE_PAGE: 'OpenWorkspaceInvitePage', OPEN_DRAFT_WORKSPACE_REQUEST: 'OpenDraftWorkspaceRequest', OPEN_POLICY_WORKFLOWS_PAGE: 'OpenPolicyWorkflowsPage', + OPEN_POLICY_RECEIPT_PARTNERS_PAGE: 'OpenPolicyReceiptPartnersPage', OPEN_POLICY_DISTANCE_RATES_PAGE: 'OpenPolicyDistanceRatesPage', OPEN_POLICY_PER_DIEM_RATES_PAGE: 'OpenPolicyPerDiemRatesPage', OPEN_POLICY_MORE_FEATURES_PAGE: 'OpenPolicyMoreFeaturesPage', diff --git a/src/libs/HttpUtils.ts b/src/libs/HttpUtils.ts index 13e6542736a4..e6459ebaacbc 100644 --- a/src/libs/HttpUtils.ts +++ b/src/libs/HttpUtils.ts @@ -63,7 +63,7 @@ function processHTTPRequest(url: string, method: RequestType = 'get', body: Form // so to avoid sending cookies with the request we set it to 'omit' explicitly // this avoids us sending specially the expensifyWeb cookie, which makes a CSRF token required // more on that here: https://stackoverflowteams.com/c/expensify/questions/93 - credentials: 'omit', + // credentials: 'omit', }) .then((response) => { // We are calculating the skew to minimize the delay when posting the messages @@ -180,4 +180,5 @@ function cancelPendingRequests(command: AbortCommand = ABORT_COMMANDS.All) { export default { xhr, cancelPendingRequests, + processHTTPRequest, }; diff --git a/src/libs/Navigation/AppNavigator/Navigators/WorkspaceSplitNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/WorkspaceSplitNavigator.tsx index 92bac7c4d428..712a385b931e 100644 --- a/src/libs/Navigation/AppNavigator/Navigators/WorkspaceSplitNavigator.tsx +++ b/src/libs/Navigation/AppNavigator/Navigators/WorkspaceSplitNavigator.tsx @@ -29,6 +29,7 @@ const CENTRAL_PANE_WORKSPACE_SCREENS = { [SCREENS.WORKSPACE.EXPENSIFY_CARD]: () => require('../../../../pages/workspace/expensifyCard/WorkspaceExpensifyCardPage').default, [SCREENS.WORKSPACE.COMPANY_CARDS]: () => require('../../../../pages/workspace/companyCards/WorkspaceCompanyCardsPage').default, [SCREENS.WORKSPACE.PER_DIEM]: () => require('../../../../pages/workspace/perDiem/WorkspacePerDiemPage').default, + [SCREENS.WORKSPACE.RECEIPT_PARTNERS]: () => require('../../../../pages/workspace/receiptPartners/WorkspaceReceiptPartnersPage').default, [SCREENS.WORKSPACE.DISTANCE_RATES]: () => require('../../../../pages/workspace/distanceRates/PolicyDistanceRatesPage').default, [SCREENS.WORKSPACE.RULES]: () => require('../../../../pages/workspace/rules/PolicyRulesPage').default, } satisfies Screens; diff --git a/src/libs/Navigation/linkingConfig/RELATIONS/WORKSPACE_TO_RHP.ts b/src/libs/Navigation/linkingConfig/RELATIONS/WORKSPACE_TO_RHP.ts index f34978ca50a7..10e6082ee4cd 100755 --- a/src/libs/Navigation/linkingConfig/RELATIONS/WORKSPACE_TO_RHP.ts +++ b/src/libs/Navigation/linkingConfig/RELATIONS/WORKSPACE_TO_RHP.ts @@ -259,6 +259,7 @@ const WORKSPACE_TO_RHP: Partial['config'] = { [SCREENS.WORKSPACE.PER_DIEM]: { path: ROUTES.WORKSPACE_PER_DIEM.route, }, + [SCREENS.WORKSPACE.RECEIPT_PARTNERS]: { + path: ROUTES.WORKSPACE_RECEIPT_PARTNERS.route, + }, [SCREENS.WORKSPACE.WORKFLOWS]: { path: ROUTES.WORKSPACE_WORKFLOWS.route, }, diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts index 8d9a648d5bb3..d36c8db1561a 100644 --- a/src/libs/Navigation/types.ts +++ b/src/libs/Navigation/types.ts @@ -1841,6 +1841,9 @@ type WorkspaceSplitNavigatorParamList = { [SCREENS.WORKSPACE.COMPANY_CARDS]: { policyID: string; }; + [SCREENS.WORKSPACE.RECEIPT_PARTNERS]: { + policyID: string; + }; [SCREENS.WORKSPACE.COMPANY_CARDS_ADD_NEW]: { policyID: string; backTo?: Routes; diff --git a/src/libs/actions/Policy/Policy.ts b/src/libs/actions/Policy/Policy.ts index 675c83428706..e6adcd44e55f 100644 --- a/src/libs/actions/Policy/Policy.ts +++ b/src/libs/actions/Policy/Policy.ts @@ -31,6 +31,7 @@ import type { OpenPolicyInitialPageParams, OpenPolicyMoreFeaturesPageParams, OpenPolicyProfilePageParams, + OpenPolicyReceiptPartnersPageParams, OpenPolicyTaxesPageParams, OpenPolicyWorkflowsPageParams, OpenWorkspaceInvitePageParams, @@ -2497,6 +2498,47 @@ function openPolicyWorkflowsPage(policyID: string) { API.read(READ_COMMANDS.OPEN_POLICY_WORKFLOWS_PAGE, params, onyxData); } +function openPolicyReceiptPartnersPage(policyID?: string) { + if (!policyID) { + Log.warn('openPolicyReceiptPartnersPage invalid params', {policyID}); + return; + } + + const onyxData: OnyxData = { + optimisticData: [ + { + onyxMethod: Onyx.METHOD.MERGE, + key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`, + value: { + isLoading: true, + }, + }, + ], + successData: [ + { + onyxMethod: Onyx.METHOD.MERGE, + key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`, + value: { + isLoading: false, + }, + }, + ], + failureData: [ + { + onyxMethod: Onyx.METHOD.MERGE, + key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`, + value: { + isLoading: false, + }, + }, + ], + }; + + const params: OpenPolicyReceiptPartnersPageParams = {policyID}; + + API.read(READ_COMMANDS.OPEN_POLICY_RECEIPT_PARTNERS_PAGE, params, onyxData); +} + /** * Returns the accountIDs of the members of the policy whose data is passed in the parameters */ @@ -5686,6 +5728,7 @@ export { clearBillingReceiptDetailsErrors, clearQuickbooksOnlineAutoSyncErrorField, setIsForcedToChangeCurrency, + openPolicyReceiptPartnersPage, setIsComingFromGlobalReimbursementsFlow, setPolicyAttendeeTrackingEnabled, updateInterestedFeatures, diff --git a/src/libs/prepareRequestPayload/index.ts b/src/libs/prepareRequestPayload/index.ts index bd044640c53f..85f5bbc693d9 100644 --- a/src/libs/prepareRequestPayload/index.ts +++ b/src/libs/prepareRequestPayload/index.ts @@ -14,10 +14,14 @@ const prepareRequestPayload: PrepareRequestPayload = (command, data) => { return; } + console.log(value); + validateFormDataParameter(command, key, value); formData.append(key, value as string | Blob); }); + console.log(formData.entries()); + return Promise.resolve(formData); }; diff --git a/src/pages/workspace/receiptPartners/WorkspaceReceiptPartnersPage.tsx b/src/pages/workspace/receiptPartners/WorkspaceReceiptPartnersPage.tsx new file mode 100644 index 000000000000..37e3ba32ae24 --- /dev/null +++ b/src/pages/workspace/receiptPartners/WorkspaceReceiptPartnersPage.tsx @@ -0,0 +1,177 @@ +import React, {useCallback, useEffect, useMemo} from 'react'; +import {ActivityIndicator, View} from 'react-native'; +import Button from '@components/Button'; +import HeaderWithBackButton from '@components/HeaderWithBackButton'; +import * as Illustrations from '@components/Icon/Illustrations'; +import MenuItem from '@components/MenuItem'; +import OfflineWithFeedback from '@components/OfflineWithFeedback'; +import ScreenWrapper from '@components/ScreenWrapper'; +import ScrollView from '@components/ScrollView'; +import Section from '@components/Section'; +import useLocalize from '@hooks/useLocalize'; +import useNetwork from '@hooks/useNetwork'; +import usePolicy from '@hooks/usePolicy'; +import useResponsiveLayout from '@hooks/useResponsiveLayout'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; +import useThreeDotsAnchorPosition from '@hooks/useThreeDotsAnchorPosition'; +import Navigation from '@navigation/Navigation'; +import type {PlatformStackScreenProps} from '@navigation/PlatformStackNavigation/types'; +import type {WorkspaceSplitNavigatorParamList} from '@navigation/types'; +import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; +import type {MenuItemData} from '@pages/workspace/accounting/types'; +import {openExternalLink} from '@userActions/Link'; +import {openPolicyReceiptPartnersPage} from '@userActions/Policy/Policy'; +import CONST from '@src/CONST'; +import type SCREENS from '@src/SCREENS'; +import {getReceiptPartnersIntegrationData} from './utils'; + +type WorkspaceReceiptPartnersPageProps = PlatformStackScreenProps; + +function WorkspaceReceiptPartnersPage({route}: WorkspaceReceiptPartnersPageProps) { + const policyID = route.params.policyID; + const {translate} = useLocalize(); + const styles = useThemeStyles(); + const threeDotsAnchorPosition = useThreeDotsAnchorPosition(styles.threeDotsPopoverOffsetNoCloseButton); + const {shouldUseNarrowLayout} = useResponsiveLayout(); + const receiptPartnerNames = CONST.POLICY.RECEIPT_PARTNERS.NAME; + const receiptPartnerIntegrations = Object.values(receiptPartnerNames); + const {isOffline} = useNetwork(); + const policy = usePolicy(policyID); + const theme = useTheme(); + const isLoading = policy?.isLoading; + const integrations = policy?.receiptPartners; + + const startIntegrationFlow = useCallback( + ({name}: {name: string}) => { + switch (name) { + case CONST.POLICY.RECEIPT_PARTNERS.NAME.UBER: { + const {connectFormData} = integrations?.uber ?? {}; + const hash = connectFormData?.hash; + const query = connectFormData?.query; + const userName = connectFormData?.name; + const id = connectFormData?.id; + openExternalLink(`${CONST.UBER_CONNECT_URL}?query=${query}&hash=${hash}&name=${userName}&id=${id}`); + break; + } + default: { + break; + } + } + }, + [integrations], + ); + + const fetchReceiptPartners = useCallback(() => { + openPolicyReceiptPartnersPage(policyID); + }, [policyID]); + + useEffect(() => { + fetchReceiptPartners(); + // eslint-disable-next-line react-compiler/react-compiler + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + + const connectionsMenuItems: MenuItemData[] = useMemo(() => { + if (policyID) { + return receiptPartnerIntegrations + .map((integration) => { + const integrationData = getReceiptPartnersIntegrationData(integration, translate); + if (!integrationData) { + return undefined; + } + + const iconProps = integrationData?.icon + ? { + icon: integrationData.icon, + iconType: CONST.ICON_TYPE_AVATAR, + } + : {}; + + return { + ...iconProps, + interactive: false, + wrapperStyle: [styles.sectionMenuItemTopDescription], + shouldShowRightComponent: true, + title: integrationData?.title, + description: integrationData?.description, + rightComponent: ( +