Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[HOLD for payment 2024-10-29] [$250] QBD - Category title link shows "undefined settings" when there is error with QBO connection #49394

Closed
6 tasks done
IuliiaHerets opened this issue Sep 18, 2024 · 49 comments
Assignees
Labels
Awaiting Payment Auto-added when associated PR is deployed to production Bug Something is broken. Auto assigns a BugZero manager. Daily KSv2 External Added to denote the issue can be worked on by a contributor

Comments

@IuliiaHerets
Copy link

IuliiaHerets commented Sep 18, 2024

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!


Version Number: 9.0.37-0
Reproducible in staging?: Y
Reproducible in production?: Y
Issue was found when executing this PR: #48759
Email or phone of affected tester (no customers): [email protected]
Issue reported by: Applause Internal Team

Action Performed:

Precondition:

  • Workspace is connected to QBD on Old Dot and the set up is not completed to trigger the error.
  1. Go to staging.new.expensify.com
  2. Go to workspace settings.
  3. Go to Categories.

Expected Result:

The link in the header will not show "undefined settings".

Actual Result:

The link in the header shows "undefined settings".
The same issue goes for Tags and Report fields.

Workaround:

Unknown

Platforms:

  • Android: Native
  • Android: mWeb Chrome
  • iOS: Native
  • iOS: mWeb Safari
  • MacOS: Chrome / Safari
  • MacOS: Desktop

Screenshots/Videos

Bug6607411_1726643329782.20240918_150524.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit
  • Upwork Job URL: https://www.upwork.com/jobs/~021837252793117015940
  • Upwork Job ID: 1837252793117015940
  • Last Price Increase: 2024-09-20
  • Automatic offers:
    • brunovjk | Contributor | 104158165
Issue OwnerCurrent Issue Owner: @alexpensify
@IuliiaHerets IuliiaHerets added Daily KSv2 Bug Something is broken. Auto assigns a BugZero manager. labels Sep 18, 2024
Copy link

melvin-bot bot commented Sep 18, 2024

Triggered auto assignment to @alexpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

@IuliiaHerets
Copy link
Author

We think that this bug might be related to #wave-control

@IuliiaHerets
Copy link
Author

@alexpensify FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

@abzokhattab
Copy link
Contributor

abzokhattab commented Sep 18, 2024

Edited by proposal-police: This proposal was edited at 2024-09-18 16:04:34 UTC.

Proposal

Please re-state the problem that we are trying to solve in this issue.

The category title link displays "undefined settings."

What is the root cause of that problem?

  • The app displays undefined for the QBO when using desktop because the quickbooksDesktop option is not added to the CONNECTIONS names list or the routes list.

    App/src/CONST.ts

    Lines 2275 to 2287 in f2a4b87

    // Here we will add other connections names when we add support for them
    QBO: 'quickbooksOnline',
    XERO: 'xero',
    NETSUITE: 'netsuite',
    SAGE_INTACCT: 'intacct',
    },
    ROUTE: {
    QBO: 'quickbooks-online',
    XERO: 'xero',
    NETSUITE: 'netsuite',
    SAGE_INTACCT: 'sage-intacct',
    },
    NAME_USER_FRIENDLY: {

What changes do you think we should make in order to solve the problem?

  • Add QuickBooks Desktop alongside other supported connections from this list:

    App/src/CONST.ts

    Lines 2287 to 2296 in f2a4b87

    NAME_USER_FRIENDLY: {
    netsuite: 'NetSuite',
    quickbooksOnline: 'Quickbooks Online',
    quickbooksDesktop: 'Quickbooks Desktop',
    xero: 'Xero',
    intacct: 'Sage Intacct',
    financialForce: 'FinancialForce',
    billCom: 'Bill.com',
    zenefits: 'Zenefits',
    },

  • Update this condition to support QuickBooks Desktop

  • updated other hardcoded connection objects across the project to include also the QuickBooks Desktop

What alternative solutions did you explore? (Optional)

Another solution would be to avoid displaying the categories below are imported from... message if the connection name is undefined. If the connection is undefined, it indicates that it's not a supported connection.This can be achieved by changing this condition:

to check for currentConnectionName instead of checking the length of policy?.connections, as this list could contain unsupported connections.
This change should also be applied here, here and here

OR

Instead of displaying undefined for unsupported connections, we can still retrieve the connection name regardless of whether it is supported, as Tom mentioned here .
To achieve this, we have two options:

  1. We can update the getCurrentConnectionName function so that it only checks CONST.POLICY.CONNECTIONS.NAME_USER_FRIENDLY, which contains both supported and unsupported connection names, and remove CONST.POLICY.CONNECTIONS.NAME:
function getCurrentConnectionName(policy?: Policy): string | undefined {
    if (!policy?.connections) {
        return undefined;
    }

    const connectionNames = CONST.POLICY.CONNECTIONS.NAME_USER_FRIENDLY;
 
    for (const key of Object.keys(connectionNames)) {
        if (policy.connections[key]) {
            return connectionNames[key];
        }
    }

    return undefined;
}
  1. Or, we can create a new function that uses the same logic as above but with a different function name. This would help avoid potential issues elsewhere in the code. In this case, we need to update the function calls here , here , and here, here to use this new function.
    but i recommend to update the current function to keep everything consistent
  2. finally in the accounting page we need to show a message in case any of the current connections are unsupported so that the user can check it, to do that we need to add the following component here
         {hasUnsupportedNDIntegration && !hasSyncError && (
                                <FormHelpMessage
                                    isError
                                    shouldShowRedDotIndicator
                                >
                                    <Text style={[{color: theme.textError}]}>
                                        {translate('workspace.accounting.unSupportedIntegration')}
                                        <TextLink
                                            onPress={() => {
                                                Link.openOldDotLink(CONST.OLDDOT_URLS.POLICY_CONNECTIONS_URL(policyID));
                                            }}
                                        >
                                            {translate('workspace.accounting.manageYourSettings')}
                                        </TextLink>
                                    </Text>
                                </FormHelpMessage>
                            )}

note: we might not need to warp it with FormHelpMessage as the user didn't make anything wrong ( the connection is not supported form our side), so it shouldn't be shown as error, we can just show the TextLink for without wrapping it.

@mkzie2
Copy link
Contributor

mkzie2 commented Sep 19, 2024

Edited by proposal-police: This proposal was edited at 2024-09-24 09:51:46 UTC.

Proposal

Please re-state the problem that we are trying to solve in this issue.

  • QBO - Category title link shows "undefined settings" when there is error with QBO connection

What is the root cause of that problem?

  • We didn't handle the case there is a connection that is not supported in ND in:
    return connectionKey ? CONST.POLICY.CONNECTIONS.NAME_USER_FRIENDLY[connectionKey] : undefined;

    hence the link is displayed as "undefined setting".

What changes do you think we should make in order to solve the problem?

1. Display The categories below are imported from QuickBooks Desktop (or the name of the connected integration, even if it's not yet supported) to make the messaging consistent.

  • First, change function:

function getCurrentConnectionName(policy: Policy | undefined): string | undefined {

function getCurrentConnectionName(policy: Policy | undefined, includeUnsupportedConnection = false): string | undefined {
    const accountingIntegrations = Object.values(CONST.POLICY.CONNECTIONS.NAME);
    if (includeUnsupportedConnection) {
        accountingIntegrations.push(...Object.values(CONST.POLICY.UNSUPPORTED_CONNECTIONS.NAME));
    }
    const connectionKey = accountingIntegrations.find((integration) => !!policy?.connections?.[integration]);
    return connectionKey ? CONST.POLICY.CONNECTIONS.NAME_USER_FRIENDLY[connectionKey] : undefined;
}

By introducing a includeUnsupportedConnection param, we can make sure our change in this PR does not break other logics.

    const currentConnectionName = PolicyUtils.getCurrentConnectionName(policy, true);
    const [connectionSyncProgress] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CONNECTION_SYNC_PROGRESS}${policy?.id}`);
    const isSyncInProgress = isConnectionInProgress(connectionSyncProgress, policy);
    const hasSyncError = PolicyUtils.hasSyncError(policy, isSyncInProgress);

The text "The categories below are imported from your Quickbooks Desktop settings" should not be displayed if the connection encountered an error. We will use hasSyncError to decide whether we should display that text or not.

  • (Optional) Next, update:

            {!hasSyncError && isConnectedToAccounting ? (
  • It will display something like:

image
If the connection is not supported and successful.

  • And it will display something like:

image
if the connection is not supported and there is an error.

2. On the policy's accounting page, show the Go to Expensify Classic to manage your settings. text.

  • We need to update the workspace accounting page to display the text "Go to Expensify Classic to manage your settings" in case "the connection is not supported and successful", since the case "the connection is not supported and there is an error" has already been implemented in another PR.

To do it, add another logic to handle that case to:

                          {hasUnsupportedNDIntegration && !hasSyncError && (
                                <FormHelpMessage shouldShowRedDotIndicator={false}>
                                    <Text>
                                        <TextLink
                                            onPress={() => {
                                                // Go to Expensify Classic.
                                                Link.openOldDotLink(CONST.OLDDOT_URLS.POLICY_CONNECTIONS_URL(policyID));
                                            }}
                                        >
                                            {"Go to Expensify Classic to manage your settings"}
                                        </TextLink>
                                    </Text>
                                </FormHelpMessage>
                            )}
  • Other minor changes can be implemented in PR stage, such as:
  1. Remove hasSyncError conditions in:

    {!(hasUnsupportedNDIntegration && hasSyncError) &&

  2. Remove !(hasUnsupportedNDIntegration && hasSyncError) in:

    if (isEmptyObject(policy?.connections) && !isSyncInProgress && !(hasUnsupportedNDIntegration && hasSyncError)) {

  3. Update hasUnsupportedNDIntegration variable to:

    const hasUnsupportedNDIntegration = !isEmptyObject(policy?.connections) && PolicyUtils.hasUnsupportedIntegration(policy, accountingIntegrations);
  • It will display something like:

image
in case "the connection is not supported and successful".

What alternative solutions did you explore? (Optional)

Details
            {!hasSyncError && hasUnsupportedIntegration ? (
                <Text>
                    <Text style={[styles.textNormal, styles.colorMuted]}>{`The categories below have been imported from the connection configured in `}</Text>
                    <TextLink
                        style={[styles.textNormal, styles.link]}
                        onPress={() => {
                            // Go to Expensify Classic.
                            Link.openOldDotLink(CONST.OLDDOT_URLS.POLICY_CONNECTIONS_URL(policyId));
                        }}
                    >
                        {`Expensify Classic`}
                    </TextLink>
                    <Text style={[styles.textNormal, styles.colorMuted]}>.</Text>
                </Text>
            ) : !hasSyncError && isConnectedToAccounting ? (

in there hasUnsupportedIntegration is

const hasUnsupportedIntegration = isConnectedToAccounting && PolicyUtils.hasUnsupportedIntegration(policy, Object.values(CONST.POLICY.CONNECTIONS.NAME));

and hasSyncError is

    const [connectionSyncProgress] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CONNECTION_SYNC_PROGRESS}${policy?.id}`);
    const isSyncInProgress = isConnectionInProgress(connectionSyncProgress, policy);
    const hasSyncError = PolicyUtils.hasSyncError(policy, isSyncInProgress);
  • It will display something like:

image

if there is a successful connection which is not supported in ND and when user clicks on "Expensify Classic", it will open OD app like we did in:

Link.openOldDotLink(CONST.OLDDOT_URLS.POLICY_CONNECTIONS_URL(policyID));

  • We should apply the same fix in tag, reportField, taxes page.

@melvin-bot melvin-bot bot added the Overdue label Sep 20, 2024
@alexpensify alexpensify added the External Added to denote the issue can be worked on by a contributor label Sep 20, 2024
@melvin-bot melvin-bot bot changed the title QBO - Category title link shows "undefined settings" when there is error with QBO connection [$250] QBO - Category title link shows "undefined settings" when there is error with QBO connection Sep 20, 2024
Copy link

melvin-bot bot commented Sep 20, 2024

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

@melvin-bot melvin-bot bot added the Help Wanted Apply this label when an issue is open to proposals by contributors label Sep 20, 2024
Copy link

melvin-bot bot commented Sep 20, 2024

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

@melvin-bot melvin-bot bot removed the Overdue label Sep 20, 2024
@alexpensify
Copy link
Contributor

@brunovjk when you get a chance, can you please review the proposals? Thanks!

@brunovjk
Copy link
Contributor

brunovjk commented Sep 20, 2024

@brunovjk when you get a chance, can you please review the proposals? Thanks!

Sure!

@shubham1206agra
Copy link
Contributor

shubham1206agra commented Sep 21, 2024

I don't think QBD is implemented at all. cc @lakchote @dylanexpensify

@brunovjk
Copy link
Contributor

Appreciate the insights @shubham1206agra! I will hold off on the proposal review until the last comment has been addressed :D

@abzokhattab
Copy link
Contributor

abzokhattab commented Sep 21, 2024

While adding QuickBooks Desktop (QBD) would resolve the issue for that connection, this "undefined settings" error may still occur with other unsupported connections. To ensure broader coverage and prevent similar issues, I recommend considering the alternative solution proposed, which addresses undefined connections more comprehensively.

@alexpensify
Copy link
Contributor

I'm confused, this GH is about QBO, not QBD. Why did we pivot to talk about QBD?

@lakchote
Copy link
Contributor

I don't understand why we're talking about QBD either here. We're talking about QBO. QBD is not yet implemented in NewDot.

@mkzie2
Copy link
Contributor

mkzie2 commented Sep 23, 2024

@lakchote The QBD is not yet implemented in NewDot. But there are a few cases where the QBD term is still displayed in ND, such as our current issue and that issue.

@brunovjk
Copy link
Contributor

brunovjk commented Sep 23, 2024

It seems the confusion stems from the fact that this issue was initially labeled as QBO, but the actual functionality being tested in the video and steps involves QBD (QuickBooks Desktop), not QBO (QuickBooks Online).

Here's a summary:

  • The issue creator referenced QBO Desktop, but the test steps, video, and setup involve QBD only.
  • The PR addresses handling non-configurable integrations in NewDot like QuickBooks Desktop (QBD).
  • The video shows a QBD flow (connecting to QBD on OldDot, followed by accessing categories in NewDot).
POC
QBD.mov

I reviewed both proposals (using the alternative solution from the first one), and they are quite similar. While the first proposal from @abzokhattab suggests "avoiding the display of the 'categories below are imported from...' message if the connection name is undefined," I believe the second one from @mkzie2 —which involves adding a message informing the user that certain features like QBD categories and tags are not yet supported—is more appropriate, provided that this issue is confirmed.

@alexpensify @lakchote @shubham1206agra @IuliiaHerets Does this make sense or am I missing something? Thank you :D

@abzokhattab
Copy link
Contributor

abzokhattab commented Sep 23, 2024

I have a question: if the connection setup fails, will the categories still be imported from the failed connection?

If not, I think it makes sense not to display that label here .

Instead, we could add another label warning the user to check the connection page for a potential failed connection, rather than informing them that the categories were imported

@lakchote
Copy link
Contributor

It does make sense @brunovjk, thanks!

The issue's title is misleading, it's indeed about QBD and not QBO cc @IuliiaHerets

QBD in NewDot will soon be supported, and is already supported in OldDot.

Regarding what to do between these 2 choices:

  1. avoiding the display of the categories below are imported from... message if the connection name is undefined
  2. adding a message informing the user that certain features like QBD categories and tags are not yet supported

I'd go with helping the user by informing him on the current status of the integration.
If it failed to connect, use a specific message. If it's not supported yet, do the same.

I'm going to tag @JmillsExpensify @trjExpensify what would you go with?

@lakchote lakchote changed the title [$250] QBO - Category title link shows "undefined settings" when there is error with QBO connection [$250] QBD - Category title link shows "undefined settings" when there is error with QBO connection Sep 23, 2024
@trjExpensify
Copy link
Contributor

QBD in NewDot will soon be supported, and is already supported in OldDot.

How far away are we from building QBD workspace settings out in NewDot? I'm a bit mindful of investing in throwaway work with QBD coming soon. That said, we could hit the "undefined" message with Certina (FinancialForce) as well I guess which is a little further out - but not a million miles away.

Can't we know from the policy object which accounting solution is connected to the workspace already, and show it's name instead of undefined on the categories and tags page here like normal?

image

Then on the accounting page replace this message with a generic _"Go to Expensify Classic to manage your settings." which we'll remove in turn for QBD and Certina as those are built:

image

@lakchote
Copy link
Contributor

How far away are we from building QBD workspace settings out in NewDot? I'm a bit mindful of investing in throwaway work with QBD coming soon. That said, we could hit the "undefined" message with Certina (FinancialForce) as well I guess which is a little further out - but not a million miles away.

That's a fair concern. QBD should start to be implemented by the end of the month/early October.
We could do this in advance yes, as it can impact other integrations down the line if they're not supported.

Can't we know from the policy object which accounting solution is connected to the workspace already, and show it's name instead of undefined on the categories and tags page here like normal?
Yes, we can.

What you suggest make sense:

  1. Display The categories below are imported from QuickBooks Desktop (or the name of the connected integration, even if it's not yet supported) to make the messaging consistent.
  2. On the policy's accounting page, show the Go to Expensify Classic to manage your settings. text.

@alexpensify
Copy link
Contributor

Update: PR is in review

@alexpensify
Copy link
Contributor

Weekly Update: PR is still in review

@alexpensify
Copy link
Contributor

Heads up, I will be offline until Tuesday, October 22, 2024, and will not actively watch over this GitHub during that period.

If this GitHub requires an urgent update, please ask for help in the #expensify-open-source Slack Room. If the inquiry can wait, I'll review it when I return online.

@flaviadefaria
Copy link
Contributor

This shouldn't be part of the #migration project as it isn't related to one of the upcoming cohorts. #retain is probably a better place for this issue.

@trjExpensify
Copy link
Contributor

I agree it shouldn't be in #migrate, but it should be in #expense where QBD is being actively built. We're just waiting out the regression period here. Hit staging on Friday.

@melvin-bot melvin-bot bot added Weekly KSv2 Awaiting Payment Auto-added when associated PR is deployed to production and removed Weekly KSv2 labels Oct 22, 2024
@melvin-bot melvin-bot bot changed the title [$250] QBD - Category title link shows "undefined settings" when there is error with QBO connection [HOLD for payment 2024-10-29] [$250] QBD - Category title link shows "undefined settings" when there is error with QBO connection Oct 22, 2024
@melvin-bot melvin-bot bot removed the Reviewing Has a PR in review label Oct 22, 2024
Copy link

melvin-bot bot commented Oct 22, 2024

Reviewing label has been removed, please complete the "BugZero Checklist".

Copy link

melvin-bot bot commented Oct 22, 2024

The solution for this issue has been 🚀 deployed to production 🚀 in version 9.0.51-4 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

If no regressions arise, payment will be issued on 2024-10-29. 🎊

For reference, here are some details about the assignees on this issue:

Copy link

melvin-bot bot commented Oct 22, 2024

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

  • [@brunovjk] The PR that introduced the bug has been identified. Link to the PR:
  • [@brunovjk] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
  • [@brunovjk] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
  • [@brunovjk] Determine if we should create a regression test for this bug.
  • [@brunovjk] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
  • [@alexpensify] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

@mkzie2
Copy link
Contributor

mkzie2 commented Oct 22, 2024

@brunovjk Please note that as of today we already support QBD integration, only this test case is valid:

  1. In OD, try to connect to Quickbooks Desktop but do not complete the set up to trigger error
  2. In ND, open workspace settings > Categories
  3. Verify Get a better overview of where money is being spent... message shows under Categories title

@brunovjk
Copy link
Contributor

BugZero Checklist:

  • [@brunovjk] The PR that introduced the bug has been identified. Link to the PR: Issue resulted from a new implementation and not a specific bug-inducing PR
  • [@brunovjk] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
  • [@brunovjk] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
  • [@brunovjk] Determine if we should create a regression test for this bug. Yes
  • [@brunovjk] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.

Regression Test Proposal

  1. Setup on OldDot (OD):

    • Go to Settings -> Workspaces in OD.
    • Select a Workspace.
    • Navigate to Connections -> QuickBooks Desktop -> Click Connect to QuickBooks Desktop.
    • When prompted with next steps, close the modal without completing the setup.
    • Refresh the page and confirm the error message: "The connection could not be completed".
  2. Verification on NewDot (ND) with Connection Error:

    • Tap on the profile photo in the navbar, and navigate to Workspaces.
    • Select the same workspace as above.
    • Under Accounting, confirm that an error message appears: "There's an error with the connection...".
    • Still on Workspace settings, verify each of these tabs: Categories, Report Fields, Taxes and Tags displays their default message (Example Categories: "Get a better overview of where money is being spent...").
  3. Reconnect and Verify Successful Integration:

    • Return to OD and fully complete the connection setup with QuickBooks Desktop.
    • In ND, go to Workspace settings
    • Confirm that each tab now shows the message: "The [Categories/Report Fields/Taxes/Tags] below are imported from QuickBooks Desktop settings."
    • Click QuickBooks Desktop settings on any tab, and verify that the message "Go to Expensify Classic to manage your settings." appears without any integration menu (Import, Export, Advanced...) or error message.
  • Do we agree 👍 or 👎

@melvin-bot melvin-bot bot added Daily KSv2 and removed Weekly KSv2 labels Oct 28, 2024
@alexpensify
Copy link
Contributor

alexpensify commented Oct 30, 2024

Payouts due: 2024-10-29

Upwork jobs are above.

@alexpensify
Copy link
Contributor

All set, the payments are complete here. @justinpersaud do you agree with this regression test? If yes, I can create the GH. Thanks!

@justinpersaud
Copy link
Contributor

yep, sounds good to me

@alexpensify
Copy link
Contributor

Ok, I'll work on the test process.

@melvin-bot melvin-bot bot added the Overdue label Nov 4, 2024
@alexpensify
Copy link
Contributor

Other GHs have been a priority; I need to circle back here and create the regression test GH.

@melvin-bot melvin-bot bot removed the Overdue label Nov 5, 2024
@github-project-automation github-project-automation bot moved this from Hold for Payment to Done in [#whatsnext] #expense Nov 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Awaiting Payment Auto-added when associated PR is deployed to production Bug Something is broken. Auto assigns a BugZero manager. Daily KSv2 External Added to denote the issue can be worked on by a contributor
Projects
Archived in project
Development

No branches or pull requests

10 participants