Skip to content

Commit

Permalink
Merge pull request #41583 from Expensify/lucien/xero-purchase-bill-date
Browse files Browse the repository at this point in the history
[Wave Collect] [Xero] [Export Flow] Create the Purchase bill date select page
  • Loading branch information
lakchote authored May 9, 2024
2 parents e8df050 + 8d81865 commit a8da9fd
Show file tree
Hide file tree
Showing 14 changed files with 159 additions and 15 deletions.
12 changes: 12 additions & 0 deletions src/CONST.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1299,8 +1299,14 @@ const CONST = {
XERO_CONFIG: {
AUTO_SYNC: 'autoSync',
SYNC: 'sync',
EXPORT: 'export',
IMPORT_CUSTOMERS: 'importCustomers',
IMPORT_TAX_RATES: 'importTaxRates',
INVOICE_STATUS: {
AWAITING_PAYMENT: 'AWT_PAYMENT',
DRAFT: 'DRAFT',
AWAITING_APPROVAL: 'AWT_APPROVAL',
},
IMPORT_TRACKING_CATEGORIES: 'importTrackingCategories',
MAPPINGS: 'mappings',
TRACKING_CATEGORY_PREFIX: 'trackingCategory_',
Expand All @@ -1320,6 +1326,12 @@ const CONST = {
JOURNAL_ENTRY: 'journal_entry',
},

XERO_EXPORT_DATE: {
LAST_EXPENSE: 'LAST_EXPENSE',
REPORT_EXPORTED: 'REPORT_EXPORTED',
REPORT_SUBMITTED: 'REPORT_SUBMITTED',
},

QUICKBOOKS_EXPORT_DATE: {
LAST_EXPENSE: 'LAST_EXPENSE',
REPORT_EXPORTED: 'REPORT_EXPORTED',
Expand Down
4 changes: 4 additions & 0 deletions src/ROUTES.ts
Original file line number Diff line number Diff line change
Expand Up @@ -804,6 +804,10 @@ const ROUTES = {
route: 'settings/workspaces/:policyID/accounting/xero/export',
getRoute: (policyID: string) => `settings/workspaces/${policyID}/accounting/xero/export` as const,
},
POLICY_ACCOUNTING_XERO_EXPORT_PURCHASE_BILL_DATE_SELECT: {
route: 'settings/workspaces/:policyID/accounting/xero/export/purchase-bill-date-select',
getRoute: (policyID: string) => `settings/workspaces/${policyID}/accounting/xero/export/purchase-bill-date-select` as const,
},
POLICY_ACCOUNTING_XERO_ADVANCED: {
route: 'settings/workspaces/:policyID/accounting/xero/advanced',
getRoute: (policyID: string) => `settings/workspaces/${policyID}/accounting/xero/advanced` as const,
Expand Down
1 change: 1 addition & 0 deletions src/SCREENS.ts
Original file line number Diff line number Diff line change
Expand Up @@ -248,6 +248,7 @@ const SCREENS = {
XERO_MAP_COST_CENTERS: 'Policy_Accounting_Xero_Map_Cost_Centers',
XERO_MAP_REGION: 'Policy_Accounting_Xero_Map_Region',
XERO_EXPORT: 'Policy_Accounting_Xero_Export',
XERO_EXPORT_PURCHASE_BILL_DATE_SELECT: 'Policy_Accounting_Xero_Export_Purchase_Bill_Date_Select',
XERO_ADVANCED: 'Policy_Accounting_Xero_Advanced',
XERO_INVOICE_ACCOUNT_SELECTOR: 'Policy_Accounting_Xero_Invoice_Account_Selector',
XERO_BILL_PAYMENT_ACCOUNT_SELECTOR: 'Policy_Accounting_Xero_Bill_Payment_Account_Selector',
Expand Down
7 changes: 5 additions & 2 deletions src/components/CollapsibleSection/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,17 @@ type CollapsibleSectionProps = ChildrenProps & {
/** Style of title of the collapsible section */
titleStyle?: StyleProp<TextStyle>;

/** Style for the text */
textStyle?: StyleProp<TextStyle>;

/** Style for the wrapper view */
wrapperStyle?: StyleProp<ViewStyle>;

/** Whether or not to show border between section title and expandable items */
shouldShowSectionBorder?: boolean;
};

function CollapsibleSection({title, children, titleStyle, wrapperStyle, shouldShowSectionBorder}: CollapsibleSectionProps) {
function CollapsibleSection({title, children, titleStyle, textStyle, wrapperStyle, shouldShowSectionBorder}: CollapsibleSectionProps) {
const theme = useTheme();
const styles = useThemeStyles();
const [isExpanded, setIsExpanded] = useState(false);
Expand All @@ -50,7 +53,7 @@ function CollapsibleSection({title, children, titleStyle, wrapperStyle, shouldSh
pressDimmingValue={0.2}
>
<Text
style={[styles.flex1, styles.textStrong, styles.userSelectNone, titleStyle]}
style={textStyle ?? [styles.flex1, styles.textStrong, styles.userSelectNone, titleStyle]}
dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
>
{title}
Expand Down
25 changes: 25 additions & 0 deletions src/languages/en.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2063,6 +2063,31 @@ export default {
xeroBillPaymentAccountDescription:
"As you've enabled sync reimbursed reports, you will need to select the bank account your reimbursements are coming out of, and we'll create the payment in Xero.",
},
exportDate: {
label: 'Export date',
description: 'Use this date when exporting reports to Xero.',
values: {
[CONST.QUICKBOOKS_EXPORT_DATE.LAST_EXPENSE]: {
label: 'Date of last expense',
description: 'The date of the most recent expense on the report',
},
[CONST.QUICKBOOKS_EXPORT_DATE.REPORT_EXPORTED]: {
label: 'Export date',
description: 'The date the report was exported to Xero',
},
[CONST.QUICKBOOKS_EXPORT_DATE.REPORT_SUBMITTED]: {
label: 'Submitted date',
description: 'The date the report was submitted for approval',
},
},
},
invoiceStatus: {
values: {
[CONST.XERO_CONFIG.INVOICE_STATUS.AWAITING_PAYMENT]: 'Authorised',
[CONST.XERO_CONFIG.INVOICE_STATUS.DRAFT]: 'Draft',
[CONST.XERO_CONFIG.INVOICE_STATUS.AWAITING_APPROVAL]: 'Submitted',
},
},
},
type: {
free: 'Free',
Expand Down
25 changes: 25 additions & 0 deletions src/languages/es.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2098,6 +2098,31 @@ export default {
xeroBillPaymentAccountDescription:
'Como has activado la sincronización de los informes reembolsados, tendrás que seleccionar la cuenta bancaria de la que se producen estos reembolsos y crearemos el pago en Xero.',
},
exportDate: {
label: 'Fecha de exportación',
description: 'Usa esta fecha al exportar informe a Xero.',
values: {
[CONST.XERO_EXPORT_DATE.LAST_EXPENSE]: {
label: 'Fecha del último gasto',
description: 'Fecha del gasto mas reciente en el informe',
},
[CONST.XERO_EXPORT_DATE.REPORT_EXPORTED]: {
label: 'Fecha de exportación',
description: 'Fecha de exportación del informe a Xero',
},
[CONST.XERO_EXPORT_DATE.REPORT_SUBMITTED]: {
label: 'Fecha de envío',
description: 'Fecha en la que el informe se envió para su aprobación',
},
},
},
invoiceStatus: {
values: {
[CONST.XERO_CONFIG.INVOICE_STATUS.AWAITING_PAYMENT]: 'Autorizado',
[CONST.XERO_CONFIG.INVOICE_STATUS.DRAFT]: 'Borrador',
[CONST.XERO_CONFIG.INVOICE_STATUS.AWAITING_APPROVAL]: 'Enviado',
},
},
},
type: {
free: 'Gratis',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -310,6 +310,8 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
[SCREENS.WORKSPACE.ACCOUNTING.XERO_MAP_COST_CENTERS]: () => require('../../../../pages/workspace/accounting/xero/XeroMapCostCentersToConfigurationPage').default as React.ComponentType,
[SCREENS.WORKSPACE.ACCOUNTING.XERO_MAP_REGION]: () => require('../../../../pages/workspace/accounting/xero/XeroMapRegionsToConfigurationPage').default as React.ComponentType,
[SCREENS.WORKSPACE.ACCOUNTING.XERO_EXPORT]: () => require('../../../../pages/workspace/accounting/xero/export/XeroExportConfigurationPage').default as React.ComponentType,
[SCREENS.WORKSPACE.ACCOUNTING.XERO_EXPORT_PURCHASE_BILL_DATE_SELECT]: () =>
require('../../../../pages/workspace/accounting/xero/export/XeroPurchaseBillDateSelectPage').default as React.ComponentType,
[SCREENS.WORKSPACE.ACCOUNTING.XERO_ADVANCED]: () => require('../../../../pages/workspace/accounting/xero/advanced/XeroAdvancedPage').default as React.ComponentType,
[SCREENS.WORKSPACE.ACCOUNTING.XERO_INVOICE_ACCOUNT_SELECTOR]: () =>
require('../../../../pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage').default as React.ComponentType,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@ const FULL_SCREEN_TO_RHP_MAPPING: Partial<Record<FullScreenName, string[]>> = {
SCREENS.WORKSPACE.ACCOUNTING.XERO_MAP_COST_CENTERS,
SCREENS.WORKSPACE.ACCOUNTING.XERO_MAP_REGION,
SCREENS.WORKSPACE.ACCOUNTING.XERO_EXPORT,
SCREENS.WORKSPACE.ACCOUNTING.XERO_EXPORT_PURCHASE_BILL_DATE_SELECT,
SCREENS.WORKSPACE.ACCOUNTING.XERO_ADVANCED,
SCREENS.WORKSPACE.ACCOUNTING.XERO_INVOICE_ACCOUNT_SELECTOR,
SCREENS.WORKSPACE.ACCOUNTING.XERO_BILL_PAYMENT_ACCOUNT_SELECTOR,
Expand Down
1 change: 1 addition & 0 deletions src/libs/Navigation/linkingConfig/config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -335,6 +335,7 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
[SCREENS.WORKSPACE.ACCOUNTING.XERO_CUSTOMER]: {path: ROUTES.POLICY_ACCOUNTING_XERO_CUSTOMER.route},
[SCREENS.WORKSPACE.ACCOUNTING.XERO_TAXES]: {path: ROUTES.POLICY_ACCOUNTING_XERO_TAXES.route},
[SCREENS.WORKSPACE.ACCOUNTING.XERO_EXPORT]: {path: ROUTES.POLICY_ACCOUNTING_XERO_EXPORT.route},
[SCREENS.WORKSPACE.ACCOUNTING.XERO_EXPORT_PURCHASE_BILL_DATE_SELECT]: {path: ROUTES.POLICY_ACCOUNTING_XERO_EXPORT_PURCHASE_BILL_DATE_SELECT.route},
[SCREENS.WORKSPACE.ACCOUNTING.XERO_ADVANCED]: {path: ROUTES.POLICY_ACCOUNTING_XERO_ADVANCED.route},
[SCREENS.WORKSPACE.ACCOUNTING.XERO_INVOICE_ACCOUNT_SELECTOR]: {path: ROUTES.POLICY_ACCOUNTING_XERO_INVOICE_SELECTOR.route},
[SCREENS.WORKSPACE.ACCOUNTING.XERO_BILL_PAYMENT_ACCOUNT_SELECTOR]: {path: ROUTES.POLICY_ACCOUNTING_XERO_BILL_PAYMENT_ACCOUNT_SELECTOR.route},
Expand Down
3 changes: 3 additions & 0 deletions src/libs/Navigation/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -336,6 +336,9 @@ type SettingsNavigatorParamList = {
[SCREENS.WORKSPACE.ACCOUNTING.XERO_EXPORT]: {
policyID: string;
};
[SCREENS.WORKSPACE.ACCOUNTING.XERO_EXPORT_PURCHASE_BILL_DATE_SELECT]: {
policyID: string;
};
[SCREENS.WORKSPACE.ACCOUNTING.XERO_ADVANCED]: {
policyID: string;
};
Expand Down
3 changes: 2 additions & 1 deletion src/pages/workspace/accounting/PolicyAccountingPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -341,8 +341,9 @@ function PolicyAccountingPage({policy, connectionSyncProgress}: PolicyAccounting
{otherIntegrationsItems && (
<CollapsibleSection
title={translate('workspace.accounting.other')}
wrapperStyle={styles.pr3}
wrapperStyle={[styles.pr3, styles.mt5, styles.pv3]}
titleStyle={[styles.textNormal, styles.colorMuted]}
textStyle={[styles.flex1, styles.userSelectNone, styles.textNormal, styles.colorMuted]}
>
<MenuItemList
menuItems={otherIntegrationsItems}
Expand Down
10 changes: 0 additions & 10 deletions src/pages/workspace/accounting/xero/advanced/XeroAdvancedPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -60,16 +60,6 @@ function XeroAdvancedPage({policy}: WithPolicyConnectionsProps) {
errors={ErrorUtils.getLatestErrorField(xeroConfig ?? {}, CONST.XERO_CONFIG.AUTO_SYNC)}
onCloseError={() => Policy.clearXeroErrorField(policyID, CONST.XERO_CONFIG.AUTO_SYNC)}
/>
<OfflineWithFeedback pendingAction={pendingFields?.export}>
<MenuItemWithTopDescription
shouldShowRightIcon
title={xeroConfig?.export?.billStatus?.purchase}
description={translate('workspace.xero.advancedConfig.purchaseBillStatusTitle')}
key={translate('workspace.xero.advancedConfig.purchaseBillStatusTitle')}
wrapperStyle={[styles.sectionMenuItemTopDescription]}
onPress={() => {}}
/>
</OfflineWithFeedback>
<ToggleSettingOptionRow
key={translate('workspace.xero.advancedConfig.reimbursedReports')}
title={translate('workspace.xero.advancedConfig.reimbursedReports')}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,11 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback';
import type {OfflineWithFeedbackProps} from '@components/OfflineWithFeedback';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
import Navigation from '@libs/Navigation/Navigation';
import type {WithPolicyConnectionsProps} from '@pages/workspace/withPolicyConnections';
import withPolicyConnections from '@pages/workspace/withPolicyConnections';
import CONST from '@src/CONST';
import ROUTES from '@src/ROUTES';

type MenuItem = MenuItemProps & {pendingAction?: OfflineWithFeedbackProps['pendingAction']};

Expand Down Expand Up @@ -37,15 +39,16 @@ function XeroExportConfigurationPage({policy}: WithPolicyConnectionsProps) {
},
{
description: translate('workspace.xero.purchaseBillDate'),
onPress: () => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_XERO_EXPORT_PURCHASE_BILL_DATE_SELECT.getRoute(policyID)),
brickRoadIndicator: errorFields?.billDate ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
title: exportConfiguration?.billDate,
title: exportConfiguration?.billDate ? translate(`workspace.xero.exportDate.values.${exportConfiguration.billDate}.label`) : undefined,
pendingAction: pendingFields?.export,
error: errorFields?.billDate ? translate('common.genericErrorMessage') : undefined,
},
{
description: translate('workspace.xero.advancedConfig.purchaseBillStatusTitle'),
onPress: () => {},
title: exportConfiguration?.billStatus?.purchase,
title: exportConfiguration?.billStatus?.purchase ? translate(`workspace.xero.invoiceStatus.values.${exportConfiguration.billStatus.purchase}`) : undefined,
pendingAction: pendingFields?.export,
error: errorFields?.purchase ? translate('common.genericErrorMessage') : undefined,
},
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
import React, {useCallback, useMemo} from 'react';
import {View} from 'react-native';
import type {ValueOf} from 'type-fest';
import RadioListItem from '@components/SelectionList/RadioListItem';
import type {ListItem} from '@components/SelectionList/types';
import SelectionScreen from '@components/SelectionScreen';
import type {SelectorType} from '@components/SelectionScreen';
import Text from '@components/Text';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
import * as Connections from '@libs/actions/connections';
import Navigation from '@navigation/Navigation';
import type {WithPolicyConnectionsProps} from '@pages/workspace/withPolicyConnections';
import withPolicyConnections from '@pages/workspace/withPolicyConnections';
import CONST from '@src/CONST';
import ROUTES from '@src/ROUTES';

type MenuListItem = ListItem & {
value: ValueOf<typeof CONST.XERO_EXPORT_DATE>;
};

function XeroPurchaseBillDateSelectPage({policy}: WithPolicyConnectionsProps) {
const {translate} = useLocalize();
const policyID = policy?.id ?? '';
const styles = useThemeStyles();
const {billDate} = policy?.connections?.xero?.config?.export ?? {};
const data: MenuListItem[] = Object.values(CONST.XERO_EXPORT_DATE).map((dateType) => ({
value: dateType,
text: translate(`workspace.xero.exportDate.values.${dateType}.label`),
alternateText: translate(`workspace.xero.exportDate.values.${dateType}.description`),
keyForList: dateType,
isSelected: billDate === dateType,
}));

const headerContent = useMemo(
() => (
<View>
<Text style={[styles.ph5, styles.pb5]}>{translate('workspace.xero.exportDate.description')}</Text>
</View>
),
[translate, styles.pb5, styles.ph5],
);

const selectExportDate = useCallback(
(row: MenuListItem) => {
if (row.value !== billDate) {
Connections.updatePolicyConnectionConfig(policyID, CONST.POLICY.CONNECTIONS.NAME.XERO, CONST.XERO_CONFIG.EXPORT, {billDate: row.value});
}
Navigation.goBack(ROUTES.POLICY_ACCOUNTING_XERO_EXPORT_PURCHASE_BILL_DATE_SELECT.getRoute(policyID));
},
[billDate, policyID],
);

return (
<SelectionScreen
displayName={XeroPurchaseBillDateSelectPage.displayName}
title="workspace.xero.exportDate.label"
headerContent={headerContent}
sections={[{data}]}
listItem={RadioListItem}
onSelectRow={(selection: SelectorType) => selectExportDate(selection as MenuListItem)}
initiallyFocusedOptionKey={data.find((mode) => mode.isSelected)?.keyForList}
policyID={policyID}
accessVariants={[CONST.POLICY.ACCESS_VARIANTS.ADMIN]}
featureName={CONST.POLICY.MORE_FEATURES.ARE_CONNECTIONS_ENABLED}
onBackButtonPress={() => Navigation.goBack(ROUTES.POLICY_ACCOUNTING_XERO_EXPORT.getRoute(policyID))}
/>
);
}

XeroPurchaseBillDateSelectPage.displayName = 'XeroPurchaseBillDateSelectPage';

export default withPolicyConnections(XeroPurchaseBillDateSelectPage);

0 comments on commit a8da9fd

Please sign in to comment.