[HOLD for payment 2024-07-22] [HOLD for payment 2024-07-17] [#Wave-Control - Add Sage Intacct] Add the Connection option and Connection button in NewDot

[yuwenmemon]

Tracking GH: https://github.com/Expensify/Expensify/issues/388780

Design doc section: https://docs.google.com/document/d/1k3ZFw8KB55yPUSCG6KYZlwpwEtmRt3eUshwxs7bZq5I/edit#heading=h.w7qju91gpvcq

---

Before diving into it, let’s add it to the list of the available connections options.

// src/CONST.ts       
 
const CONNECTIONS = {
    NAME: {
        // Here we will add other connections names when we add support for them
        QBO: 'quickbooksOnline',
        XERO: 'xero',
        // …
        SAGE_INTACCT: 'intacct',
    },
};

Next, we’re going to show it in the Accounting page. To do this, modify PolicyAccountingPage.tsx:

// src/pages/workspace/accounting/PolicyAccountingPage.tsx


switch (connectionName) {
// ...
case CONST.POLICY.CONNECTIONS.NAME.SAGE_INTACCT:
                return {
                    title: translate('workspace.accounting.sageIntacct'),
                    icon: Expensicons.SageIntacctSquare,
                    setupConnectionButton: (
                        <ConnectToSageIntacctButton
                            policyID={policyID}
                            shouldDisconnectIntegrationBeforeConnecting={isConnectedToIntegration}
                            integrationToDisconnect={integrationToDisconnect}
                        />
                    ),
                    onImportPagePress: () => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_SAGE_INTACCT_IMPORT.getRoute(policyID)),
                    onExportPagePress: () => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_SAGE_INTACCT_EXPORT.getRoute(policyID)),
                    onAdvancedPagePress: () => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_SAGE_INTACCT_ADVANCED.getRoute(policyID)),
                };     

Creating the connection button

The code for the ConnectToSageIntacctButton.tsx component would look like something like this:

// src/components/ConnectToSageIntacctButton/index.tsx

function ConnectToSageIntacctButton({policyID, shouldDisconnectIntegrationBeforeConnecting, integrationToDisconnect}: ConnectToSageIntacctButtonProps) {
    return (
        <>
            <Button
                onPress={() => {
                    if (shouldDisconnectIntegrationBeforeConnecting && integrationToDisconnect) {
                        setIsDisconnectModalOpen(true);
                        return;
                    }
			// 3 conditions need to be done here (screenshots in the "Connection Process" section)
			// These are:
                    // 1. show prerequisites modal if necessary i.e credentials not present in policy's intacct connection data
			// 2. if secondary workspace with Intacct sync, show a menu with options "Create new connection" and "Reuse existing connection" 
			// 3. otherwise sync by calling the SyncPolicyToSageIntacct command
                }}
                text={translate('workspace.accounting.setup')}
                style={styles.justifyContentCenter}
                small
                isDisabled={isOffline}
            />
            {shouldDisconnectIntegrationBeforeConnecting && isDisconnectModalOpen && integrationToDisconnect && (
                <ConfirmModal
                    title={translate('workspace.accounting.disconnectTitle', CONST.POLICY.CONNECTIONS.NAME.SAGE_INTACCT)}
                    isVisible
                    onConfirm={() => {
                        removePolicyConnection(policyID, integrationToDisconnect);
                        Link.openLink(getSageIntacctSetupLink(policyID), environmentURL);
                        setIsDisconnectModalOpen(false);
                    }}
                    onCancel={() => setIsDisconnectModalOpen(false)}
                    prompt={translate('workspace.accounting.disconnectPrompt', CONST.POLICY.CONNECTIONS.NAME.SAGE_INTACCT)}
                    confirmText={translate('workspace.accounting.disconnect')}
                    cancelText={translate('common.cancel')}
                    danger
                />
            )}
        </>
    );
}

export default React.memo(ConnectToSageIntacctButton);

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~017a8c2faf283b52e8
• Upwork Job ID: 1800756578326323366
• Last Price Increase: 2024-06-12
• Automatic offers:
• ishpaul777 | Reviewer | 102709182
• hungvu193 | Contributor | 102767547

Issue Owner

Current Issue Owner: @alexpensify

[melvin-bot]

Triggered auto assignment to @alexpensify (NewFeature), see https://stackoverflowteams.com/c/expensify/questions/14418#:~:text=BugZero%20process%20steps%20for%20feature%20requests for more details. Please add this Feature request to a GH project, as outlined in the SO.

[melvin-bot]

⚠️ It looks like this issue is labelled as a New Feature but not tied to any GitHub Project. Keep in mind that all new features should be tied to GitHub Projects in order to properly track external CAP software time ⚠️

[melvin-bot]

Triggered auto assignment to Design team member for new feature review - @shawnborton (NewFeature)

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~017a8c2faf283b52e8

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @ishpaul777 (External)