[Home page] [Release 4] Adding time sensitive actions for broken connections #80974
+287
−6
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
Codecov Report✅ Changes either increased or maintained existing code coverage, great job!
|
This comment has been minimized.
This comment has been minimized.
Contributor
|
🚧 @mountiny has triggered a test Expensify/App build. You can view the workflow run here. |
|
|
||
| function FixAccountingConnection({connectionName, policyID}: FixAccountingConnectionProps) { | ||
| const {translate} = useLocalize(); | ||
| const icons = useMemoizedLazyExpensifyIcons(['Exclamation'] as const); |
Contributor
There was a problem hiding this comment.
I suppose it should work without as const
|
|
||
| function FixCompanyCardConnection({card, policyID}: FixCompanyCardConnectionProps) { | ||
| const {translate} = useLocalize(); | ||
| const icons = useMemoizedLazyExpensifyIcons(['Connect'] as const); |
Contributor
There was a problem hiding this comment.
It should work without as const
This comment has been minimized.
This comment has been minimized.
| if (!shouldShowDiscount || !discountInfo) { | ||
| return null; | ||
| // Determine which offer to show based on discount type (they are mutually exclusive) | ||
| const shouldShow50off = shouldShowDiscount && discountInfo?.discountType === 50; |
Contributor
There was a problem hiding this comment.
It's better to wait until we merge this PR
And then use useTimeSensitiveOffers here
This comment has been minimized.
This comment has been minimized.
src/pages/home/TimeSensitiveSection/items/FixAccountingConnection.tsx
Outdated
Show resolved
Hide resolved
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: e4b4426a41
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
Comment on lines
80
to
82
| // Check if there's a sync in progress for this policy | ||
| const syncProgress = connectionSyncProgress?.[`${ONYXKEYS.COLLECTION.POLICY_CONNECTION_SYNC_PROGRESS}${policy.id}`]; | ||
| const isSyncInProgress = !!syncProgress?.stageInProgress; |
There was a problem hiding this comment.
Using !!syncProgress?.stageInProgress treats any stored sync-progress record as “in progress,” but hasSynchronizationErrorMessage returns false when a sync is in progress. policyConnectionSyncProgress entries can linger with stageInProgress = JOB_DONE or an old timestamp; isConnectionInProgress explicitly filters those cases. With the current check, a failed sync can be permanently suppressed and the broken accounting widget never appears after a stale/finished sync. This should mirror the isConnectionInProgress logic used elsewhere to respect the timeout and JOB_DONE handling.
Useful? React with 👍 / 👎.
Contributor
🦜 Polyglot Parrot! 🦜Squawk! Looks like you added some shiny new English strings. Allow me to parrot them back to you in other tongues: View the translation diffdiff --git a/src/languages/de.ts b/src/languages/de.ts
index ece661c4..74f8e043 100644
--- a/src/languages/de.ts
+++ b/src/languages/de.ts
@@ -8307,10 +8307,10 @@ Hier ist ein *Testbeleg*, um dir zu zeigen, wie es funktioniert:`,
offer25off: {title: 'Erhalten Sie 25 % Rabatt auf Ihr erstes Jahr!', subtitle: ({days}: {days: number}) => `${days} ${days === 1 ? 'Tag' : 'Tage'} verbleiben`},
ctaFix: 'Beheben',
fixCompanyCardConnection: {
- title: ({feedName}: {feedName: string}) => (feedName ? `${feedName}-Firmenkartenverbindung reparieren` : 'Firmenkartenverbindung reparieren'),
- subtitle: 'Workspace > Firmenkarten',
+ title: ({feedName}: {feedName: string}) => (feedName ? `${feedName}-Firmenkartenverbindung reparieren` : 'Verbindung der Firmenkarte reparieren'),
+ subtitle: 'Arbeitsbereich > Firmenkarten',
},
- fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `${integrationName}-Verbindung reparieren`, subtitle: 'Workspace > Buchhaltung'},
+ fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `${integrationName}-Verbindung reparieren`, subtitle: 'Arbeitsbereich > Buchhaltung'},
addShippingAddress: {title: 'Wir benötigen Ihre Versandadresse', subtitle: 'Gib eine Adresse an, um deine Expensify Card zu erhalten.', cta: 'Adresse hinzufügen'},
activateCard: {title: 'Aktiviere deine Expensify Card', subtitle: 'Bestätige deine Karte und beginne mit dem Ausgeben.', cta: 'Aktivieren'},
},
diff --git a/src/languages/fr.ts b/src/languages/fr.ts
index adf3be15..bec022e4 100644
--- a/src/languages/fr.ts
+++ b/src/languages/fr.ts
@@ -8313,7 +8313,7 @@ Voici un *reçu test* pour vous montrer comment cela fonctionne :`,
offer25off: {title: 'Obtenez 25 % de réduction sur votre première année !', subtitle: ({days}: {days: number}) => `${days} ${days === 1 ? 'jour' : 'jours'} restants`},
ctaFix: 'Corriger',
fixCompanyCardConnection: {
- title: ({feedName}: {feedName: string}) => (feedName ? `Corriger la connexion de la carte professionnelle ${feedName}` : 'Corriger la connexion de la carte professionnelle'),
+ title: ({feedName}: {feedName: string}) => (feedName ? `Réparer la connexion de carte d’entreprise ${feedName}` : 'Corriger la connexion de la carte d’entreprise'),
subtitle: 'Espace de travail > Cartes d’entreprise',
},
fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `Réparer la connexion ${integrationName}`, subtitle: 'Espace de travail > Comptabilité'},
diff --git a/src/languages/it.ts b/src/languages/it.ts
index a40ea2a4..49086c48 100644
--- a/src/languages/it.ts
+++ b/src/languages/it.ts
@@ -8293,10 +8293,10 @@ Ecco una *ricevuta di prova* per mostrarti come funziona:`,
offer25off: {title: 'Ottieni il 25% di sconto sul tuo primo anno!', subtitle: ({days}: {days: number}) => `${days} ${days === 1 ? 'giorno' : 'giorni'} rimanenti`},
ctaFix: 'Correggi',
fixCompanyCardConnection: {
- title: ({feedName}: {feedName: string}) => (feedName ? `Correggi la connessione della carta aziendale ${feedName}` : 'Correggi la connessione della carta aziendale'),
+ title: ({feedName}: {feedName: string}) => (feedName ? `Correggi la connessione della carta aziendale ${feedName}` : 'Correggi connessione carta aziendale'),
subtitle: 'Spazio di lavoro > Carte aziendali',
},
- fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `Correggi la connessione ${integrationName}`, subtitle: 'Workspace > Contabilità'},
+ fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `Correggi la connessione ${integrationName}`, subtitle: 'Area di lavoro > Contabilità'},
addShippingAddress: {title: 'Abbiamo bisogno del tuo indirizzo di spedizione', subtitle: 'Fornisci un indirizzo per ricevere la tua Expensify Card.', cta: 'Aggiungi indirizzo'},
activateCard: {title: 'Attiva la tua Expensify Card', subtitle: 'Convalida la tua carta e inizia a spendere.', cta: 'Attiva'},
},
diff --git a/src/languages/nl.ts b/src/languages/nl.ts
index 13afbc28..843de5b5 100644
--- a/src/languages/nl.ts
+++ b/src/languages/nl.ts
@@ -8269,10 +8269,10 @@ Hier is een *testbon* om je te laten zien hoe het werkt:`,
offer25off: {title: 'Krijg 25% korting op je eerste jaar!', subtitle: ({days}: {days: number}) => `Nog ${days} ${days === 1 ? 'dag' : 'dagen'} resterend`},
ctaFix: 'Oplossen',
fixCompanyCardConnection: {
- title: ({feedName}: {feedName: string}) => (feedName ? `Verbinding voor ${feedName}-bedrijfskaart herstellen` : 'Verbinding voor bedrijfskaart herstellen'),
- subtitle: 'Werkruimte > Bedrijfskaarten',
+ title: ({feedName}: {feedName: string}) => (feedName ? `Verbinding voor bedrijfskaart ${feedName} herstellen` : 'Verbinding bedrijfskaart repareren'),
+ subtitle: 'Workspace > Bedrijfskaarten',
},
- fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `${integrationName}-verbinding herstellen`, subtitle: 'Werkruimte > Boekhouding'},
+ fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `${integrationName}-verbinding repareren`, subtitle: 'Werkruimte > Boekhouding'},
addShippingAddress: {title: 'We hebben je verzendadres nodig', subtitle: 'Voer een adres in om je Expensify Card te ontvangen.', cta: 'Adres toevoegen'},
activateCard: {title: 'Activeer je Expensify Card', subtitle: 'Valideer je kaart en begin met uitgeven.', cta: 'Activeren'},
},
diff --git a/src/languages/pl.ts b/src/languages/pl.ts
index e2b2256f..63b2fbd3 100644
--- a/src/languages/pl.ts
+++ b/src/languages/pl.ts
@@ -8253,10 +8253,10 @@ Oto *paragon testowy*, który pokazuje, jak to działa:`,
offer25off: {title: 'Uzyskaj 25% zniżki na pierwszy rok!', subtitle: ({days}: {days: number}) => `Pozostało ${days} ${days === 1 ? 'dzień' : 'dni'}`},
ctaFix: 'Napraw',
fixCompanyCardConnection: {
- title: ({feedName}: {feedName: string}) => (feedName ? `Napraw połączenie firmowej karty ${feedName}` : 'Napraw połączenie firmowej karty'),
+ title: ({feedName}: {feedName: string}) => (feedName ? `Napraw połączenie firmowej karty ${feedName}` : 'Napraw połączenie karty firmowej'),
subtitle: 'Workspace > Karty firmowe',
},
- fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `Napraw połączenie ${integrationName}`, subtitle: 'Obszar roboczy > Księgowość'},
+ fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `Napraw połączenie z ${integrationName}`, subtitle: 'Workspace > Księgowość'},
addShippingAddress: {title: 'Potrzebujemy Twojego adresu do wysyłki', subtitle: 'Podaj adres, na który mamy wysłać Twoją kartę Expensify.', cta: 'Dodaj adres'},
activateCard: {title: 'Aktywuj swoją kartę Expensify', subtitle: 'Zweryfikuj swoją kartę i zacznij wydawać.', cta: 'Aktywuj'},
},
diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts
index 02f2cba0..c49e8805 100644
--- a/src/languages/pt-BR.ts
+++ b/src/languages/pt-BR.ts
@@ -8264,9 +8264,9 @@ Aqui está um *recibo de teste* para mostrar como funciona:`,
ctaFix: 'Corrigir',
fixCompanyCardConnection: {
title: ({feedName}: {feedName: string}) => (feedName ? `Corrigir conexão do cartão corporativo ${feedName}` : 'Corrigir conexão do cartão corporativo'),
- subtitle: 'Workspace > Cartões corporativos',
+ subtitle: 'Espaço de trabalho > Cartões corporativos',
},
- fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `Corrigir conexão com ${integrationName}`, subtitle: 'Workspace > Contabilidade'},
+ fixAccountingConnection: {title: ({integrationName}: {integrationName: string}) => `Corrigir conexão do ${integrationName}`, subtitle: 'Workspace > Contabilidade'},
addShippingAddress: {title: 'Precisamos do seu endereço de entrega', subtitle: 'Forneça um endereço para receber seu Expensify Card.', cta: 'Adicionar endereço'},
activateCard: {title: 'Ative seu Cartão Expensify', subtitle: 'Valide seu cartão e comece a gastar.', cta: 'Ativar'},
},
Note You can apply these changes to your branch by copying the patch to your clipboard, then running |
Contributor
|
Strange 2026-01-30.21.48.53.mov |
Contributor
Author
|
@ZhenjaHorbach can you share the policy data for that policy and connection? I am using standardized approach from what I know so I agree that is weird |
Contributor
|
Sure 
|
Contributor
|
Looks like the problem with Which return true for this policy As result, we ignore errors in this policy here Actually, do we really need |
Contributor
Author
|
Do you still get that after the latest push? |
Contributor
|
Now is good! 
|
Contributor
|
Maybe we should update designs and add workspace names for section items? 
|
Contributor
|
And should we improve navigation on the mobile apps to navigate to the previous screen after opening 2026-01-30.22.30.56.mov |
Contributor
Reviewer Checklist
Screenshots/VideosAndroid: HybridApp2026-01-30.22.29.26.movAndroid: mWeb Chrome2026-01-30.22.31.09.moviOS: HybridApp2026-01-30.22.29.26.moviOS: mWeb Safari2026-01-30.22.31.09.movMacOS: Chrome / Safari2026-01-30.22.21.03.mov |
Contributor
|
But overall changes look good! |
Contributor
Author
Good feedback, I think that is out of scope here, but we could consider @JmillsExpensify @Expensify/design |
Contributor
|
Yeah I kinda like that idea. Maybe instead of |
Contributor
Author
I think that is expected navigation using the UP button using the browser history back will take you back as you mentioned |
ZhenjaHorbach
approved these changes
Jan 30, 2026
|
@chuckdries Please copy/paste the Reviewer Checklist from here into a new comment on this PR and complete it. If you have the K2 extension, you can simply click: [this button] |
Contributor
|
🚧 @mountiny has triggered a test Expensify/App build. You can view the workflow run here. |
Contributor
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
nkuoch
approved these changes
Jan 31, 2026
Contributor
Definitely agree with that! |
Contributor
|
Although cc @JmillsExpensify because I thought we decided to ditch the second line and just use one liners for all of these? |
Contributor
Author
|
I do like adding the workspace name there for clarity when admin has multiple workspaces. We can add it in follow up cc @adamgrzybowski @WojtekBoman for visibility |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Explanation of Change
This PR implements Release 4 of the NewDot Home page Time Sensitive section, adding two new widgets:
Key changes:
Priority order (from design doc):
Fixed Issues
$ #79970
PROPOSAL:
Tests
Prerequisite: Have a workspace with accounting integration set up
Offline tests
N/A
QA Steps
// TODO: These must be filled out, or the issue title must include "[No QA]."
PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectioncanBeMissingparam foruseOnyxtoggleReportand notonIconClick)src/languages/*files and using the translation methodSTYLE.md) were followedAvatar, I verified the components usingAvatarare working as expected)StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))npm run compress-svg)Avataris modified, I verified thatAvataris working as expected in all cases)Designlabel and/or tagged@Expensify/designso the design team can review the changes.ScrollViewcomponent to make it scrollable when more elements are added to the page.mainbranch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTeststeps./** comment above it */thisproperly so there are no scoping issues (i.e. foronClick={this.submit}the methodthis.submitshould be bound tothisin the constructor)thisare necessary to be bound (i.e. avoidthis.submit = this.submit.bind(this);ifthis.submitis never passed to a component event handler likeonClick)Screenshots/Videos
Android: Native
Android: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari