[NoQA] [HR Import] Rename and parameterize the sync results modal#91285
Conversation
|
Hey, I noticed you changed If you want to automatically generate translations for other locales, an Expensify employee will have to:
Alternatively, if you are an external contributor, you can run the translation script locally with your own OpenAI API key. To learn more, try running: npx ts-node ./scripts/generateTranslations.ts --helpTypically, you'd want to translate only what you changed by running |
Codecov Report✅ Changes either increased or maintained existing code coverage, great job!
|
🦜 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/es.ts b/src/languages/es.ts
index d4d60fb0..e5180089 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -6308,7 +6308,7 @@ ${amount} para ${merchant} - ${date}`,
},
syncResults: {
title: (provider: string) => `Sincronización de ${provider} completada`,
- successTitle: (provider: string) => `¡Se sincronizó correctamente tu conexión con ${provider}!`,
+ successTitle: (provider: string) => `¡Se sincronizó correctamente tu conexión de ${provider}!`,
},
gusto: {
title: 'Gusto',
diff --git a/src/languages/fr.ts b/src/languages/fr.ts
index 18ba4f27..2cf94717 100644
--- a/src/languages/fr.ts
+++ b/src/languages/fr.ts
@@ -7218,10 +7218,7 @@ Ajoutez davantage de règles de dépenses pour protéger la trésorerie de l’e
}
}
},
- syncResults: {
- title: (provider: string) => `Synchronisation ${provider} terminée`,
- successTitle: (provider: string) => `Votre connexion ${provider} a été synchronisée avec succès !`,
- },
+ syncResults: {title: (provider: string) => `Synchronisation ${provider} terminée`, successTitle: (provider: string) => `Connexion ${provider} synchronisée avec succès !`},
gusto: {
title: 'Gusto',
syncResults: {
diff --git a/src/languages/it.ts b/src/languages/it.ts
index fc07a72f..b9eec925 100644
--- a/src/languages/it.ts
+++ b/src/languages/it.ts
@@ -7176,10 +7176,7 @@ Aggiungi altre regole di spesa per proteggere il flusso di cassa aziendale.`,
}
}
},
- syncResults: {
- title: (provider: string) => `Sincronizzazione ${provider} completata`,
- successTitle: (provider: string) => `Connessione a ${provider} sincronizzata con successo!`,
- },
+ syncResults: {title: (provider: string) => `Sincronizzazione ${provider} completata`, successTitle: (provider: string) => `Connessione ${provider} sincronizzata correttamente!`},
gusto: {
title: 'Gusto',
syncResults: {
diff --git a/src/languages/ja.ts b/src/languages/ja.ts
index 9a90e5a7..514c85d6 100644
--- a/src/languages/ja.ts
+++ b/src/languages/ja.ts
@@ -7095,10 +7095,7 @@ ${reportName}
}
}
},
- syncResults: {
- title: (provider: string) => `${provider}の同期が完了しました`,
- successTitle: (provider: string) => `${provider}との連携が正常に同期されました!`,
- },
+ syncResults: {title: (provider: string) => `${provider} の同期が完了しました`, successTitle: (provider: string) => `${provider} との接続が正常に同期されました!`},
gusto: {
title: 'Gusto',
syncResults: {
diff --git a/src/languages/nl.ts b/src/languages/nl.ts
index 1b830605..fb21489c 100644
--- a/src/languages/nl.ts
+++ b/src/languages/nl.ts
@@ -7152,7 +7152,7 @@ er bestedingsregels toe om de kasstroom van het bedrijf te beschermen.`,
}
},
syncResults: {
- title: (provider: string) => `${provider}-synchronisatie voltooid`,
+ title: (provider: string) => `Synchronisatie met ${provider} voltooid`,
successTitle: (provider: string) => `Je ${provider}-verbinding is succesvol gesynchroniseerd!`,
},
gusto: {
diff --git a/src/languages/pl.ts b/src/languages/pl.ts
index 9b496d8e..91ae4944 100644
--- a/src/languages/pl.ts
+++ b/src/languages/pl.ts
@@ -7147,8 +7147,8 @@ Dodaj więcej zasad wydatków, żeby chronić płynność finansową firmy.`,
}
},
syncResults: {
- title: (provider: string) => `Synchronizacja ${provider} zakończona`,
- successTitle: (provider: string) => `Pomyślnie zsynchronizowano Twoje połączenie z ${provider}!`,
+ title: (provider: string) => `Synchronizacja z ${provider} zakończona`,
+ successTitle: (provider: string) => `Pomyślnie zsynchronizowano twoje połączenie z ${provider}!`,
},
gusto: {
title: 'Gusto',
diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts
index 88e70270..05eaac1f 100644
--- a/src/languages/pt-BR.ts
+++ b/src/languages/pt-BR.ts
@@ -7151,10 +7151,7 @@ Adicione mais regras de gasto para proteger o fluxo de caixa da empresa.`,
}
}
},
- syncResults: {
- title: (provider: string) => `Sincronização com ${provider} concluída`,
- successTitle: (provider: string) => `Sua conexão com o ${provider} foi sincronizada com sucesso!`,
- },
+ syncResults: {title: (provider: string) => `Sincronização com ${provider} concluída`, successTitle: (provider: string) => `Conexão com ${provider} sincronizada com sucesso!`},
gusto: {
title: 'Gusto',
syncResults: {
diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts
index 0b6c0f4f..cd844e18 100644
--- a/src/languages/zh-hans.ts
+++ b/src/languages/zh-hans.ts
@@ -6968,10 +6968,7 @@ ${reportName}
}
}
},
- syncResults: {
- title: (provider: string) => `${provider} 同步完成`,
- successTitle: (provider: string) => `已成功同步你的 ${provider} 连接!`,
- },
+ syncResults: {title: (provider: string) => `${provider} 同步完成`, successTitle: (provider: string) => `已成功同步您的 ${provider} 连接!`},
gusto: {
title: 'Gusto',
syncResults: {
Note You can apply these changes to your branch by copying the patch to your clipboard, then running |
| function useHRSyncResultsModal(policyID: string, connectionSyncProgress: OnyxEntry<PolicyConnectionSyncProgress>, isFocused: boolean) { | ||
| const modal = useModal(); | ||
| const previousSyncProgress = usePrevious(connectionSyncProgress); | ||
| const [policyConnections] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {selector: policyConnectionsSelector}); |
There was a problem hiding this comment.
❌ PERF-11 (docs)
The policyConnectionsSelector extracts the entire Connections object (which contains data for QBO, Xero, NetSuite, Sage Intacct, QBD, Certinia, Gusto, Zenefits, and Merge HR) without narrowing. Because the hook uses a selector, Onyx will run deepEqual on this large object on every policy update, which is expensive and yields no re-render savings since most of the data is unused.
The hook only needs to determine which HR provider is connected and its display name. Replace the broad selector with one that computes and returns just the providerDisplayName string (a primitive), so deepEqual is trivially cheap:
const [providerDisplayName] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {
selector: (policy) => {
const hrProvider = getConnectedHRProvider(policy);
return hrProvider?.displayName
?? CONST.POLICY.CONNECTIONS.NAME_USER_FRIENDLY[connectionName as keyof typeof CONST.POLICY.CONNECTIONS.NAME_USER_FRIENDLY]
?? connectionName;
},
});Reviewed at: ce001bb | Please rate this suggestion with 👍 or 👎 to help us improve! Reactions are used to monitor reviewer efficiency.
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: ce001bb308
ℹ️ 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".
| getConnectedHRProvider({connections: policyConnections})?.displayName ?? | ||
| CONST.POLICY.CONNECTIONS.NAME_USER_FRIENDLY[connectionName as keyof typeof CONST.POLICY.CONNECTIONS.NAME_USER_FRIENDLY] ?? |
There was a problem hiding this comment.
Derive provider name from sync event, not connected policy
Use of getConnectedHRProvider({connections: policyConnections}) can label the modal with the wrong provider when connectionSyncProgress.connectionName and current policyConnections diverge (for example during reconnect/disconnect transitions or stale Onyx updates). In that case a Zenefits/Merge sync completion can render a Gusto title because getConnectedHRProvider picks the first connected provider, ignoring the sync event's connectionName; the modal title should be derived from the sync event connection being completed.
Useful? React with 👍 / 👎.
There was a problem hiding this comment.
yes, it would be better to have the merge hr integration slug in policyConnections, so that we ensure there is no mismatch, but I'm not sure if the backend will send it, and we can get that information from policy data, so that is what we do. and I don't think the mismatch is plausible in this scenario and having consistent Onyx data between policy and policyConnections is enough to make the modal render correct data
| const providerDisplayName = | ||
| getConnectedHRProvider({connections: policyConnections})?.displayName ?? |
There was a problem hiding this comment.
should this be in a useeffect?
There was a problem hiding this comment.
it could. but actually I moved it to the useOnyx selector per AI reviewer's suggestion
grgia
left a comment
There was a problem hiding this comment.
Nothing blocking, minor comments
Reviewer Checklist
Screenshots/VideosAndroid: HybridAppAndroid: mWeb Chromeandroid.mweb.mp4iOS: HybridAppiOS: mWeb SafariMacOS: Chrome / Safariweb.mp4 |
bernhardoj
left a comment
There was a problem hiding this comment.
Left a small comment, but gonna approve this now since I'm going offline soon.
|
🚧 @grgia has triggered a test Expensify/App build. You can view the workflow run here. |
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
|
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
|
🚀 Deployed to staging by https://github.com/grgia in version: 9.3.79-1 🚀
Bundle Size Analysis (Sentry): |
|
🚀 Deployed to production by https://github.com/roryabraham in version: 9.3.79-4 🚀
|
Explanation of Change
Generalizes the Gusto's sync results modal to work with any HR connection.
Fixed Issues
$ #90601
PROPOSAL: N/A
Tests
mergeHRConnectionsbeta.policyConnectionSyncProgress_<policyID>Onyx data. (stageInProgress needs to transition from some different value to "jobDone").gustoNewDotbeta)Offline tests
QA Steps
gustoNewDotbeta.policyConnectionSyncProgress_<policyID>Onyx data. (stageInProgress needs to transition from some different value to "jobDone").PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectiontoggleReportand 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.Screenshots/Videos
Android: Native
Nagranie.z.ekranu.2026-05-21.o.13.29.36.mov
Android: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari
Nagranie.z.ekranu.2026-05-21.o.12.51.10.mov