[QBD] Handle the initial connection for QBD by hoangzinh · Pull Request #50216 · Expensify/App

hoangzinh · 2024-10-04T09:47:11Z

Details

Fixed Issues

$ #49697
PROPOSAL:

Tests

Prerequisites: Turn on Beta quickbooksDesktopOnNewDot on your account

In Web/Desktop

Sign in on an account that enabled beta quickbooksDesktopOnNewDot
Go to any Workspace
Enable Accounting if it hasn't enabled
Go to Workspace's Accounting
Verify that the QuickBooks Desktop connection is available
Click on "Connect" button
Verify that it shows "QuickBooks Desktop setup" page
Verify that the setup link is shown

In mWeb/Native apps

Sign in on an account that enabled beta quickbooksDesktopOnNewDot
Go to any Workspace
Enable Accounting if it hasn't enabled
Go to Workspace's Accounting
Verify that the QuickBooks Desktop connection is available
Click on "Connect" button
Verify that it shows "Can't connect from this device" page

Verify that no errors appear in the JS console

Offline tests

Unable to test in offline

QA Steps

Same as above

Verify that no errors appear in the JS console

PR Author Checklist

Screenshots/Videos

Android: Native

Screen.Recording.2024-10-05.at.22.26.52.mov

Android: mWeb Chrome

Screen.Recording.2024-10-05.at.22.01.32.android.chrome.mov

iOS: Native

Screen.Recording.2024-10-05.at.21.57.34.ios.mov

iOS: mWeb Safari

Screen.Recording.2024-10-05.at.21.58.30.ios.safari.mov

MacOS: Chrome / Safari

Screen.Recording.2024-10-05.at.20.58.02.web.mov

MacOS: Desktop

Screen.Recording.2024-10-05.at.21.02.33.desktop.mov

hoangzinh · 2024-10-04T10:21:20Z

@Expensify/design hey team, I'm implementing this screen and I realize that this screen is not included in the Figma link

Can someone help to add it to the Figma link so I can export the computer icon and copy text colors. Thank you.

hoangzinh · 2024-10-04T11:42:10Z

Hi @ZhenjaHorbach @lakchote This PR is still waiting for some minor UI changes here and translation confirmation here. But given this project is urgent, I would like to have early feedback on this PR, please help me review it when you have time. Thank you.

ZhenjaHorbach · 2024-10-04T13:09:30Z

Changes look good !
Only I'm not sure about these designs and current impementation
I suppose we need to set a max width for the text
https://www.figma.com/design/E2lt5o4nXHjlDcepaOjg2D/%23control---QuickBooks-Desktop?node-id=9214-13104&node-type=frame&t=OpVkX9IXy0Z0Ak8j-0

ZhenjaHorbach · 2024-10-04T13:10:48Z

+            },
+            setupPage: {
+                title: 'Open this link to connect',
+                body: 'To complete setup, open the following link on the computer where QuickBooks Desktop is running',


#50216 (comment)
As I can see we have dot here

Oh yeah, the mockup is too small. Let's wait response here then I will update later

hoangzinh · 2024-10-04T14:19:58Z

Changes look good ! Only I'm not sure about these designs and current impementation I suppose we need to set a max width for the text https://www.figma.com/design/E2lt5o4nXHjlDcepaOjg2D/%23control---QuickBooks-Desktop?node-id=9214-13104&node-type=frame&t=OpVkX9IXy0Z0Ak8j-0

Oh, nice catch. I think we should follow Figma design. I will update it soon.

dannymcclain · 2024-10-04T14:45:22Z

@hoangzinh Added that screen here in Figma

Here are the illustrations:

I suppose we need to set a max width for the text

I don't know why the screen looked like that in Figma, but I've updated it and it should look like this. Basically just following the normal padding conventions we have for screens like this. No special custom max-width.

hoangzinh · 2024-10-04T14:56:49Z

Great! Thank you @dannymcclain

lakchote · 2024-10-04T19:52:23Z

@hoangzinh this is going in the right direction. Once the PR will be ready, I'll trigger an ad hoc build so Design team can review it.

Co-authored-by: Lucien Akchoté <lucien@expensify.com>

lakchote · 2024-10-07T11:54:32Z

@Expensify/design feel free to test if everything looks good!

dubielzyk-expensify · 2024-10-08T00:45:13Z

Happy to test. I can't find quickbooksDesktopOnNewDot on Betaify. Maybe I'm looking in the wrong place?

lakchote · 2024-10-08T06:37:14Z

Happy to test. I can't find quickbooksDesktopOnNewDot on Betaify. Maybe I'm looking in the wrong place?

@dubielzyk-expensify you can log in with an @expensifail.com account, you'll already have all the permissions.

The beta's code hasn't been deployed to prod yet, so it might explain why you didn't find the beta.

hoangzinh · 2024-10-08T22:07:08Z

This project has a tight deadline. So it would be great if we could merge this PR soon. It would also unblock some other issues. Let us know if you need any other help to verify this PR @dubielzyk-expensify

dubielzyk-expensify · 2024-10-08T22:35:34Z

This illustration looks a bit tight to the headline and a tad big:

Can we align it a tad more closely with the mock?

Otherwise this looks good

hoangzinh · 2024-10-08T23:18:11Z

Sure @dubielzyk-expensify these are quick screenshots after updated

dubielzyk-expensify

Great stuff! Looks good to me from a visual end. I'll let the code people take the rest 😄

hoangzinh · 2024-10-08T23:21:33Z

Thank you so much for your help @dubielzyk-expensify

hoangzinh · 2024-10-09T09:06:49Z

all yours @lakchote @ZhenjaHorbach

ZhenjaHorbach · 2024-10-09T09:37:27Z

Looks good !

lakchote

LGTM

OSBotify · 2024-10-09T12:55:57Z

✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release.

github-actions · 2024-10-09T20:47:44Z

🚀 Deployed to staging by https://github.com/lakchote in version: 9.0.47-1 🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

github-actions · 2024-10-10T23:02:55Z

🚀 Deployed to production by https://github.com/thienlnam in version: 9.0.47-4 🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

s77rt · 2025-08-10T04:54:31Z

+                ),
+                onImportPagePress: () => {},
+                onExportPagePress: () => {},
+                onCardReconciliationPagePress: () => {},


We should have better tracked todo items. The onCardReconciliationPagePress callback was never updated which caused #65148

hoangzinh · 2025-09-13T07:36:58Z

+                    <Button
+                        success
+                        text={translate('common.buttonConfirm')}
+                        onPress={() => Navigation.navigate(ROUTES.WORKSPACE_ACCOUNTING.getRoute(policyID))}


To keep consistency with navigation back button, we should use Navigation.dismissModal here. More details is here #68801 (comment)

hoangzinh added 5 commits October 3, 2024 23:33

Show QBD option in accounting page

ccd51ed

Required setup QBD page

7eb1301

Setup QBD page

fc7a7e3

Go to setup flow sync page when user click on "done" button

426a2fc

Update icon and centralize view

50a17fe

hoangzinh added 3 commits October 4, 2024 17:52

Fix linter & typecheck

431e80c

Add beta feature for QBD on newdot

d94d6fa

Correct beta constant name and remove redundant code

2ddf2a3

ZhenjaHorbach reviewed Oct 4, 2024

View reviewed changes

hoangzinh added 2 commits October 4, 2024 23:16

Update style according to Figma

95f0699

Use loading page instead of loading indicator

b714b9a

lakchote reviewed Oct 4, 2024

View reviewed changes

Comment thread src/components/ConnectToQuickbooksDesktopFlow/index.tsx Outdated

hoangzinh and others added 6 commits October 5, 2024 20:56

Fix button is not full width

aaf196d

Update translation es

8f2aa90

Merge branch 'main' into ft/49697-init-QBD-connection

f79efbd

Update comment text

cb0bcc2

Co-authored-by: Lucien Akchoté <lucien@expensify.com>

Merge branch 'main' into ft/49697-init-QBD-connection

040533b

Centralize QBD route & translation with another PR

16e4bbc

hoangzinh commented Oct 7, 2024

View reviewed changes

Comment thread src/languages/es.ts

hoangzinh marked this pull request as ready for review October 7, 2024 10:29

hoangzinh requested review from a team as code owners October 7, 2024 10:29

melvin-bot Bot requested a review from c3024 October 7, 2024 10:29

lakchote previously approved these changes Oct 7, 2024

View reviewed changes

Merge branch 'main' into ft/49697-init-QBD-connection

f0a5c50

Update styling

b736632

hoangzinh dismissed lakchote’s stale review via b736632 October 8, 2024 23:18

dubielzyk-expensify approved these changes Oct 8, 2024

View reviewed changes

ZhenjaHorbach approved these changes Oct 9, 2024

View reviewed changes

melvin-bot Bot requested a review from lakchote October 9, 2024 09:37

lakchote approved these changes Oct 9, 2024

View reviewed changes

lakchote merged commit 1c0d2fa into Expensify:main Oct 9, 2024

github-actions Bot mentioned this pull request Oct 9, 2024

Deploy Checklist: New Expensify 2024-10-09 #50518

Closed

58 tasks

IuliiaHerets mentioned this pull request Oct 10, 2024

[HOLD for payment 2024-10-30] QBD - Empty link in RHP when network is disconnected while QBD setup is loading #50548

Closed

6 tasks

melvin-bot Bot mentioned this pull request Oct 10, 2024

[$250] [HOLD for payment 2024-10-17] [Wave Control] [QBD] Handle the initial connection for QBD #49697

Closed

lakchote mentioned this pull request Oct 15, 2024

[Wave Control] [QBD] Disconnect the QuickBooks Desktop integration #49701

Closed

lakchote mentioned this pull request Oct 29, 2024

[HOLD for payment 2024-11-18] [QBD] Handle errors gracefully if the setup link cannot be obtained #51640

Closed

FitseTLT mentioned this pull request Aug 8, 2025

[Due for payment 2025-09-02] [$250] Accounting - Resizing the window on the QBD setup page should not trigger any error #68226

Closed

8 tasks

s77rt reviewed Aug 10, 2025

View reviewed changes

s77rt mentioned this pull request Aug 10, 2025

[$250] QBD-Card reconciliation is unresponsive #65148

Closed

8 tasks

hoangzinh commented Sep 13, 2025

View reviewed changes

Uh oh!

Conversation

hoangzinh commented Oct 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Details

Fixed Issues

Tests

Offline tests

QA Steps

PR Author Checklist

Screenshots/Videos

Uh oh!

hoangzinh commented Oct 4, 2024

Uh oh!

hoangzinh commented Oct 4, 2024

Uh oh!

ZhenjaHorbach commented Oct 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ZhenjaHorbach Oct 4, 2024

Choose a reason for hiding this comment

Uh oh!

hoangzinh Oct 4, 2024

Choose a reason for hiding this comment

Uh oh!

ZhenjaHorbach Oct 4, 2024

Choose a reason for hiding this comment

Uh oh!

hoangzinh commented Oct 4, 2024

Uh oh!

dannymcclain commented Oct 4, 2024

Uh oh!

hoangzinh commented Oct 4, 2024

Uh oh!

Uh oh!

lakchote commented Oct 4, 2024

Uh oh!

Uh oh!

lakchote commented Oct 7, 2024

Uh oh!

dubielzyk-expensify commented Oct 8, 2024

Uh oh!

lakchote commented Oct 8, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

hoangzinh commented Oct 8, 2024

Uh oh!

dubielzyk-expensify commented Oct 8, 2024

Uh oh!

hoangzinh commented Oct 8, 2024

Uh oh!

dubielzyk-expensify left a comment

Choose a reason for hiding this comment

Uh oh!

hoangzinh commented Oct 8, 2024

Uh oh!

hoangzinh commented Oct 9, 2024

Uh oh!

ZhenjaHorbach commented Oct 9, 2024

Uh oh!

lakchote left a comment

Choose a reason for hiding this comment

Uh oh!

OSBotify commented Oct 9, 2024

Uh oh!

github-actions Bot commented Oct 9, 2024

Uh oh!

github-actions Bot commented Oct 10, 2024

Uh oh!

s77rt Aug 10, 2025

Choose a reason for hiding this comment

Uh oh!

hoangzinh Sep 13, 2025

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

hoangzinh commented Oct 4, 2024 •

edited

Loading

ZhenjaHorbach commented Oct 4, 2024 •

edited

Loading

lakchote commented Oct 8, 2024 •

edited

Loading