[QBO] Chart of accounts page does not fit in RHP properly

[lanitochka17]

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: 1.4.71-0
Reproducible in staging?: Y
Reproducible in production?: N
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Issue reported by: Applause - Internal Team

Action Performed:

1. Go to staging.new.expensify.com
2. Go to workspace chat
3. Go to Accounting
4. Connect to QBO
5. Click Import
6. Click Chart of accounts

Expected Result:

Chart of accounts page will fit in RHP properly

Actual Result:

Chart of accounts page does not fit in RHP properly

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

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

Screenshots/Videos

Add any screenshot/video evidence

Bug6473650_1715080171257.QBO.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01442744b26c0bc6bf
• Upwork Job ID: 1791012116292186112
• Last Price Increase: 2024-05-16

[melvin-bot]

Triggered auto assignment to @arosiclair (DeployBlockerCash), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

[github-actions]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open `StagingDeployCash` deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[lanitochka17]

@arosiclair 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

[lanitochka17]

We think that this bug might be related to #wave-collect - Release 1

[neonbhai]

Proposal

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

QBO - Chart of accounts page does not fit in RHP properly

What is the root cause of that problem?

This happens as we are missing contentContainerStyles in ConnectionLayout here:

App/src/pages/workspace/accounting/qbo/import/QuickbooksChartOfAccountsPage.tsx

Lines 23 to 30 in 222419b

	<ConnectionLayout
	displayName={QuickbooksChartOfAccountsPage.displayName}
	headerTitle="workspace.accounting.accounts"
	title="workspace.qbo.accountsDescription"
	accessVariants={[CONST.POLICY.ACCESS_VARIANTS.ADMIN]}
	policyID={policyID}
	featureName={CONST.POLICY.MORE_FEATURES.ARE_CONNECTIONS_ENABLED}
	>

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

We will add

contentContainerStyle={[styles.pb2, styles.ph5]}

here:

App/src/pages/workspace/accounting/qbo/import/QuickbooksChartOfAccountsPage.tsx

Lines 23 to 30 in 222419b

	<ConnectionLayout
	displayName={QuickbooksChartOfAccountsPage.displayName}
	headerTitle="workspace.accounting.accounts"
	title="workspace.qbo.accountsDescription"
	accessVariants={[CONST.POLICY.ACCESS_VARIANTS.ADMIN]}
	policyID={policyID}
	featureName={CONST.POLICY.MORE_FEATURES.ARE_CONNECTIONS_ENABLED}
	>

Result

This works perfectly:

Before

After

[arosiclair]

Seems to be from #41547.

@neonbhai's proposal seems fine, but I wonder why its necessary to add those styles now. It looked fine on the PR. @aldo-expensify any idea?

[marcaaron]

Maybe a bad merge? @neonbhai how fast can you get a fix up for this?

[neonbhai]

@marcaaron hi, can raise the PR in a few minutes

[marcaaron]

Yeah let's do it.

[neonbhai]

working on the PR!

[neonbhai]

PR is ready for review!

cc: @marcaaron @arosiclair

[rayane-djouah]

@marcaaron @arosiclair - Should I go ahead with the PR review or will @mananjadhav review it?
I don't have access to accounting beta.

[arosiclair]

I can add you to the beta just need your account email. Though I'm not sure how you can setup a QBO connection.

[mananjadhav]

I don't think we need this PR. I put up a fix for this one in my PR itself. Just waiting on approval

#41690 (comment)

[mananjadhav]

Also when I reviewed the PR #41547, the padding issue for ConnectionLayout (PR) wasn't merged.

By the time we got to merge the PR, ConnectionLayout was updated.

[marcaaron]

@mananjadhav Can you maybe help us understand what we need to merge in order to unblock the deploy? You said this is fixed in this PR, but we're on a merge freeze at the moment so I can't CP those changes onto staging.

[mananjadhav]

@marcaaron Few options that I can think of:

1. We still merge and CP my PR (Xero is under active development and behind beta, so shouldn't impact anyone)
2. I can whip up a separate PR only to fix this screen and CP it.
3. Use @neonbhai's PR and CP it.
4. Remove deploy blocker from this one as I understand QBO is also under beta, and we merge my PR after the freeze is lifted on Friday.

[marcaaron]

Ok, I like 4 and if this is actually under a beta then no Deploy Blocker should have been added in the first place.

[melvin-bot]

Triggered auto assignment to @greg-schroeder (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.

[mananjadhav]

I've linked this issue in my PR, so we can track it when merged.

[greg-schroeder]

Merge freeze but PR looks approved

[trjExpensify]

@greg-schroeder I think you can pay out @neonbhai $250 for the PR we didn't end up needing, but was prepared nevertheless, and then close this issue. It was taken care of elsewhere.

[greg-schroeder]

Okay, got it. Will take care of that today

[melvin-bot]

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

[melvin-bot]

Current assignee @mananjadhav is eligible for the Internal assigner, not assigning anyone new.

[greg-schroeder]

Creating a job w/ the Internal label to send an offer to @neonbhai

Once you accept I'll pay you ASAP!

[neonbhai]

@greg-schroeder Thank you, accepted!

[greg-schroeder]

This was paid btw!