[Home Page] Create ForYouSection Component (1/2) - Preparing the Home Page layout - #80555
Closed
adamgrzybowski wants to merge 4 commits into
Closed
adamgrzybowski wants to merge 4 commits into
adamgrzybowski wants to merge 4 commits into
Conversation
adamgrzybowski
force-pushed
the
home-page/initial-layout
branch
from
January 27, 2026 01:54
6c5173f to
ae666fd
Compare
|
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 |
adamgrzybowski
changed the title
adamgrzybowski
force-pushed
the
home-page/initial-layout
branch
from
January 27, 2026 01:57
ae666fd to
af184a9
Compare
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 336bf871..3f8387ea 100644
--- a/src/languages/de.ts
+++ b/src/languages/de.ts
@@ -8038,7 +8038,7 @@ Hier ist ein *Testbeleg*, um dir zu zeigen, wie es funktioniert:`,
domainAdmins: 'Domain-Admins',
},
gps: {
- tooltip: 'GPS-Verfolgung läuft! Wenn du fertig bist, stoppe die Verfolgung unten.',
+ tooltip: 'GPS-Tracking läuft! Wenn du fertig bist, beende das Tracking unten.',
disclaimer: 'Benutze GPS, um eine Ausgabe von deiner Reise zu erstellen. Tippe unten auf „Start“, um mit der Aufzeichnung zu beginnen.',
error: {failedToStart: 'Standortverfolgung konnte nicht gestartet werden.', failedToGetPermissions: 'Die erforderlichen Standortberechtigungen konnten nicht abgerufen werden.'},
trackingDistance: 'Strecke wird verfolgt...',
@@ -8085,6 +8085,7 @@ Hier ist ein *Testbeleg*, um dir zu zeigen, wie es funktioniert:`,
},
fabGpsTripExplained: 'Zur GPS-Ansicht wechseln (Schnellaktion)',
},
+ homePage: {atAGlance: 'Auf einen Blick', reportsToReview: 'Berichte zur Überprüfung', announcements: 'Ankündigungen', discover: 'Entdecken'},
};
// IMPORTANT: This line is manually replaced in generate translation files by scripts/generateTranslations.ts,
// so if you change it here, please update it there as well.
diff --git a/src/languages/fr.ts b/src/languages/fr.ts
index c80f7a1d..300f74e9 100644
--- a/src/languages/fr.ts
+++ b/src/languages/fr.ts
@@ -8044,7 +8044,7 @@ Voici un *reçu test* pour vous montrer comment cela fonctionne :`,
domainAdmins: 'Administrateurs de domaine',
},
gps: {
- tooltip: 'Suivi GPS en cours ! Quand vous avez terminé, arrêtez le suivi ci-dessous.',
+ tooltip: 'Suivi GPS en cours ! Lorsque vous avez terminé, arrêtez le suivi ci-dessous.',
disclaimer: 'Utilisez le GPS pour créer une dépense à partir de votre trajet. Touchez Démarrer ci-dessous pour commencer le suivi.',
error: {failedToStart: 'Impossible de démarrer le suivi de la localisation.', failedToGetPermissions: 'Échec de l’obtention des autorisations de localisation requises.'},
trackingDistance: 'Suivi de la distance...',
@@ -8091,6 +8091,7 @@ Voici un *reçu test* pour vous montrer comment cela fonctionne :`,
},
fabGpsTripExplained: 'Aller à l’écran GPS (action flottante)',
},
+ homePage: {atAGlance: 'En un coup d’œil', reportsToReview: 'Rapports à examiner', announcements: 'Annonces', discover: 'Découvrir'},
};
// IMPORTANT: This line is manually replaced in generate translation files by scripts/generateTranslations.ts,
// so if you change it here, please update it there as well.
diff --git a/src/languages/it.ts b/src/languages/it.ts
index c4668644..4fe03d92 100644
--- a/src/languages/it.ts
+++ b/src/languages/it.ts
@@ -6878,7 +6878,7 @@ Richiedi dettagli di spesa come ricevute e descrizioni, imposta limiti e valori
groupBy: {
[CONST.SEARCH.GROUP_BY.FROM]: 'Da',
[CONST.SEARCH.GROUP_BY.CARD]: 'Carta',
- [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: 'ID prelievo',
+ [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: 'ID prelievo', //_/\__/_/ \_,_/\__/\__/\_,_/
},
feed: 'Feed',
withdrawalType: {
@@ -8073,6 +8073,7 @@ Ecco una *ricevuta di prova* per mostrarti come funziona:`,
},
fabGpsTripExplained: 'Vai alla schermata GPS (azione flottante)',
},
+ homePage: {atAGlance: 'A colpo d’occhio', reportsToReview: 'Report da esaminare', announcements: 'Annunci', discover: 'Scopri'},
};
// IMPORTANT: This line is manually replaced in generate translation files by scripts/generateTranslations.ts,
// so if you change it here, please update it there as well.
diff --git a/src/languages/ja.ts b/src/languages/ja.ts
index cbe74fca..e5d6f818 100644
--- a/src/languages/ja.ts
+++ b/src/languages/ja.ts
@@ -6819,7 +6819,7 @@ ${reportName}
groupBy: {
[CONST.SEARCH.GROUP_BY.FROM]: '差出人',
[CONST.SEARCH.GROUP_BY.CARD]: 'カード',
- [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: '出金ID',
+ [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: '出金 ID',
},
feed: 'フィード',
withdrawalType: {
@@ -7960,7 +7960,7 @@ Expensify の使い方をお見せするための*テストレシート*がこ
domainAdmins: 'ドメイン管理者',
},
gps: {
- tooltip: 'GPS 追跡を進行中です！完了したら、下で追跡を停止してください。',
+ tooltip: 'GPS追跡を実行中です！完了したら、下で追跡を停止してください。',
disclaimer: '移動中の経路から、GPS を使って経費を作成しましょう。下の「開始」をタップして追跡を始めてください。',
error: {failedToStart: '位置情報の追跡を開始できませんでした。', failedToGetPermissions: '必要な位置情報の権限を取得できませんでした。'},
trackingDistance: '距離を追跡中...',
@@ -7987,6 +7987,7 @@ Expensify の使い方をお見せするための*テストレシート*がこ
},
fabGpsTripExplained: 'GPS画面へ移動（フローティングアクション）',
},
+ homePage: {atAGlance: '一目で分かる', reportsToReview: 'レビュー対象のレポート', announcements: 'お知らせ', discover: '発見'},
};
// IMPORTANT: This line is manually replaced in generate translation files by scripts/generateTranslations.ts,
// so if you change it here, please update it there as well.
diff --git a/src/languages/nl.ts b/src/languages/nl.ts
index d07a6f98..395e6fbc 100644
--- a/src/languages/nl.ts
+++ b/src/languages/nl.ts
@@ -8047,6 +8047,7 @@ Hier is een *testbon* om je te laten zien hoe het werkt:`,
},
fabGpsTripExplained: 'Ga naar GPS-scherm (Zwevende actie)',
},
+ homePage: {atAGlance: 'In één oogopslag', reportsToReview: 'Rapporten om te beoordelen', announcements: 'Aankondigingen', discover: 'Ontdekken'},
};
// IMPORTANT: This line is manually replaced in generate translation files by scripts/generateTranslations.ts,
// so if you change it here, please update it there as well.
diff --git a/src/languages/pl.ts b/src/languages/pl.ts
index 08e2d8bb..0162fa0f 100644
--- a/src/languages/pl.ts
+++ b/src/languages/pl.ts
@@ -6849,7 +6849,7 @@ Wymagaj szczegółów wydatków, takich jak paragony i opisy, ustawiaj limity i
groupBy: {
[CONST.SEARCH.GROUP_BY.FROM]: 'Od',
[CONST.SEARCH.GROUP_BY.CARD]: 'Karta',
- [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: 'ID wypłaty',
+ [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: 'Identyfikator wypłaty',
},
feed: 'Kanał',
withdrawalType: {
@@ -8034,6 +8034,7 @@ Oto *paragon testowy*, który pokazuje, jak to działa:`,
},
fabGpsTripExplained: 'Przejdź do ekranu GPS (przycisk akcji)',
},
+ homePage: {atAGlance: 'W skrócie', reportsToReview: 'Raporty do sprawdzenia', announcements: 'Ogłoszenia', discover: 'Odkryj'},
};
// IMPORTANT: This line is manually replaced in generate translation files by scripts/generateTranslations.ts,
// so if you change it here, please update it there as well.
diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts
index cfcc64eb..099221a0 100644
--- a/src/languages/pt-BR.ts
+++ b/src/languages/pt-BR.ts
@@ -6851,7 +6851,7 @@ Exija detalhes de despesas como recibos e descrições, defina limites e padrõe
groupBy: {
[CONST.SEARCH.GROUP_BY.FROM]: 'De',
[CONST.SEARCH.GROUP_BY.CARD]: 'Cartão',
- [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: 'ID de saque',
+ [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: 'ID de retirada',
},
feed: 'Feed',
withdrawalType: {
@@ -7997,7 +7997,7 @@ Aqui está um *recibo de teste* para mostrar como funciona:`,
domainAdmins: 'Administradores de domínio',
},
gps: {
- tooltip: 'Rastreamento por GPS em andamento! Quando terminar, pare o rastreamento abaixo.',
+ tooltip: 'Rastreamento de GPS em andamento! Quando terminar, pare o rastreamento abaixo.',
disclaimer: 'Use o GPS para criar uma despesa a partir da sua viagem. Toque em Iniciar abaixo para começar o rastreamento.',
error: {failedToStart: 'Falha ao iniciar o rastreamento de localização.', failedToGetPermissions: 'Falha ao obter as permissões de localização necessárias.'},
trackingDistance: 'Acompanhando a distância...',
@@ -8044,6 +8044,7 @@ Aqui está um *recibo de teste* para mostrar como funciona:`,
},
fabGpsTripExplained: 'Ir para a tela de GPS (Ação flutuante)',
},
+ homePage: {atAGlance: 'De relance', reportsToReview: 'Relatórios para revisar', announcements: 'Comunicados', discover: 'Descobrir'},
};
// IMPORTANT: This line is manually replaced in generate translation files by scripts/generateTranslations.ts,
// so if you change it here, please update it there as well.
diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts
index c3824768..de6ea6bf 100644
--- a/src/languages/zh-hans.ts
+++ b/src/languages/zh-hans.ts
@@ -6698,9 +6698,9 @@ ${reportName}
reimbursable: '可报销',
purchaseCurrency: '购买货币',
groupBy: {
- [CONST.SEARCH.GROUP_BY.FROM]: '从',
- [CONST.SEARCH.GROUP_BY.CARD]: '卡片',
- [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: '提款 ID',
+ [CONST.SEARCH.GROUP_BY.FROM]: '来自',
+ [CONST.SEARCH.GROUP_BY.CARD]: '卡',
+ [CONST.SEARCH.GROUP_BY.WITHDRAWAL_ID]: '提现 ID',
},
feed: '动态',
withdrawalType: {
@@ -7822,6 +7822,7 @@ ${reportName}
locationServicesRequiredModal: {title: '需要访问位置信息', confirm: '打开设置', prompt: '请在设备设置中允许位置访问，以开始 GPS 距离跟踪。'},
fabGpsTripExplained: '前往 GPS 屏幕（悬浮操作）',
},
+ homePage: {atAGlance: '一览', reportsToReview: '待审核报表', announcements: '公告', discover: '发现'},
};
// IMPORTANT: This line is manually replaced in generate translation files by scripts/generateTranslations.ts,
// so if you change it here, please update it there as well.
Note You can apply these changes to your branch by copying the patch to your clipboard, then running |
grgia
reviewed
Jan 27, 2026
| @@ -552,7 +559,7 @@ function AuthScreens() { | |||
| /> | |||
| <RootStack.Screen | |||
| name={SCREENS.WORKSPACES_LIST} | |||
| options={rootNavigatorScreenOptions.workspacesListPage} | |||
Contributor
There was a problem hiding this comment.
Could you explain this change?
Contributor
|
🚧 @grgia 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! 🧪🧪
|
grgia
changed the title
Contributor
|
Removed hold, awaiting merge main @adamgrzybowski |
grgia
reviewed
Jan 28, 2026
grgia
left a comment
grgia
left a comment
Contributor
There was a problem hiding this comment.
Let's rename ForYouSection
Contributor
|
@adamgrzybowski |
adamgrzybowski
force-pushed
the
home-page/initial-layout
branch
from
January 28, 2026 18:30
32cdab6 to
8e838cd
Compare
| @@ -16,6 +16,7 @@ function canUseLinkPreviews(): boolean { | |||
| } | |||
|
|
|||
| function isBetaEnabled(beta: Beta, betas: OnyxEntry<Beta[]>, betaConfiguration?: OnyxEntry<BetaConfiguration>): boolean { | |||
| return true; | |||
Contributor
There was a problem hiding this comment.
I think we don't need these changes😅
| // Select a random empty state message on mount (will change on refresh/remount) | ||
| const emptyStateMessage = useMemo( | ||
| // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, react-hooks/purity | ||
| () => EMPTY_STATE_MESSAGES.at(Math.floor(Math.random() * EMPTY_STATE_MESSAGES.length))!, |
Contributor
There was a problem hiding this comment.
I suppose it's a temporary message
Let's add TODO to not forget about it
| const payCount = reportCounts[CONST.SEARCH.SEARCH_KEYS.PAY]; | ||
| const exportCount = reportCounts[CONST.SEARCH.SEARCH_KEYS.EXPORT]; | ||
|
|
||
| const hasAnyTodos = submitCount > 0 || approveCount > 0 || payCount > 0 || exportCount > 0; |
Contributor
There was a problem hiding this comment.
Maybe just const hasAnyTodos = submitCount || approveCount || payCount || exportCount; ?
adamgrzybowski
force-pushed
the
home-page/initial-layout
branch
from
January 28, 2026 19:25
8e838cd to
bdcfe5e
Compare
Codecov Report❌ Looks like you've decreased code coverage for some files. Please write tests to increase, or at least maintain, the existing level of code coverage. See our documentation here for how to interpret this table.
|
Comment on lines
+12
to
+21
| /** The icon to display along with the title */ | ||
| icon?: IconAsset; | ||
|
|
||
| /** The text to display in the title of the widget */ | ||
| title?: string; | ||
|
|
||
| /** Custom color for the title text */ | ||
| titleColor?: string; | ||
|
|
||
| /** The width of the icon. */ |
Contributor
There was a problem hiding this comment.
Just thinking
Maybe we should just pass the icon as a parameter?
Instead of three parameters
mountiny
changed the title
Contributor
|
@codex review |
Contributor
Author
|
We don't need this one. These changes will go with the first widget, because it's ready for review. |
![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: 3e250e8b19
ℹ️ 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
+991
to
+995
| homePage: { | ||
| forYou: 'For you', | ||
| announcements: 'Announcements', | ||
| discover: 'Discover', | ||
| }, |
There was a problem hiding this comment.
Only en and es define the new homePage.* keys, but translate() (see src/libs/Localize/index.ts) throws in dev and returns the raw path / missing translation sentinel in staging/production when a key is missing for the active locale. That means users on any other locale (e.g. fr/de/pt-BR) will see homePage.forYou/homePage.discover instead of readable titles on the Home page. Please add the new keys to all language files (or a proper fallback) to avoid missing-translation behavior.
Useful? React with 👍 / 👎.
Comment on lines
+77
to
+79
| <Button | ||
| text="Go to submitted expense reports" | ||
| onPress={handleGoToSearch} |
There was a problem hiding this comment.
These button labels are hard-coded English strings, so users in non-English locales will always see English text even when the app is localized. This is user-facing and inconsistent with the rest of the Home page, which uses translate(). Please add translation keys and use translate() for these labels.
Useful? React with 👍 / 👎.
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
5 participants
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
Note
Wait for the #80571 to be merged
This PR adds the common parts for all HomePage sections:
Splitting the common parts from the AtGlanceSection-specific implementation allows parallel work on individual sections while the common parts are being reviewed.
The placeholder content will be replaced with actual implementations in follow-up PRs.
Fixed Issues
$ #79979
PROPOSAL:
Tests
Offline tests
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.Screenshots/Videos
Android: Native
Android: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari
Screen.Recording.2026-01-26.at.15.46.57.mp4