feat: [89310] add agents flow#89547
Open
NicolasBonet wants to merge 14 commits intomainfrom
Open
Conversation
Contributor
|
I have read the CLA Document and I hereby sign the CLA You can retrigger this bot by commenting recheck in this Pull Request. Posted by the CLA Assistant Lite bot. |
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.
NicolasBonet
force-pushed
the
feat/89310-add-agents-flow
branch
from
5247084 to
90149a3
Compare
NicolasBonet
commented
May 4, 2026
| const defaultPrompt = translate('addAgentPage.defaultPrompt'); | ||
| const illustrations = useMemoizedLazyIllustrations(['AiBot']); | ||
| const expensifyIcons = useMemoizedLazyExpensifyIcons(['Sync']); | ||
| const avatarStyle = [styles.avatarXLarge, styles.alignSelfCenter]; |
Contributor
Author
There was a problem hiding this comment.
This follows the format of ProfilePage.tsx
melvin-bot
Bot
requested review from
bernhardoj and
flaviadefaria
and removed request for
a team and
flaviadefaria
|
@bernhardoj 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] |
NicolasBonet
commented
May 4, 2026
Comment on lines
+1
to
+10
| import BotAvatarBlue from '@assets/images/avatars/bots/bot-avatar--blue.svg'; | ||
| import BotAvatarGreen from '@assets/images/avatars/bots/bot-avatar--green.svg'; | ||
| import BotAvatarIce from '@assets/images/avatars/bots/bot-avatar--ice.svg'; | ||
| import BotAvatarPink from '@assets/images/avatars/bots/bot-avatar--pink.svg'; | ||
| import BotAvatarTangerine from '@assets/images/avatars/bots/bot-avatar--tangerine.svg'; | ||
| import BotAvatarYellow from '@assets/images/avatars/bots/bot-avatar--yellow.svg'; | ||
|
|
||
| const botAvatars = [BotAvatarBlue, BotAvatarGreen, BotAvatarIce, BotAvatarPink, BotAvatarTangerine, BotAvatarYellow] as const; | ||
|
|
||
| export {BotAvatarBlue, BotAvatarGreen, BotAvatarIce, BotAvatarPink, BotAvatarTangerine, BotAvatarYellow, botAvatars}; |
Contributor
Author
There was a problem hiding this comment.
This file follows the same format of DefaultAvatars.ts
Contributor
|
🚧 @NicolasBonet has triggered a test Expensify/App build. You can view the workflow run here. |
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 7e519a52..f976d31f 100644
--- a/src/languages/de.ts
+++ b/src/languages/de.ts
@@ -2736,13 +2736,13 @@ ${amount} für ${merchant} – ${date}`,
},
addAgentPage: {
title: 'Neue Kontaktperson',
- agentName: 'Name des Agenten',
+ agentName: 'Name der Ansprechperson',
instructions: 'Eigene Anweisungen schreiben',
createAgent: 'Agent erstellen',
- switchAvatar: 'Avatar wechseln',
- defaultAgentName: (displayName: string) => `Agent von ${displayName}`,
+ switchAvatar: 'Profilbild wechseln',
+ defaultAgentName: (displayName: string) => `Agent*in von ${displayName}`,
defaultPrompt:
- 'Ausgaben für Glücksspiele, Kinobesuche oder andere offensichtlich nicht geschäftliche Zwecke ablehnen.\n\nDen Benutzer immer daran erinnern, ein Belegbild beizufügen, das das Trinkgeld deutlich zeigt.\n\nDen Bericht genehmigen, wenn er früheren Berichten desselben Benutzers sehr ähnelt.\n\nBerichte mit mehr als 500 $ an Reiseausgaben ablehnen.',
+ 'Lehne Ausgaben ab, die für Glücksspiele, Kinobesuche oder andere offensichtlich nicht geschäftliche Zwecke sind.\n\nErinnere den:die Nutzer:in daran, immer ein Belegfoto beizufügen, auf dem das Trinkgeld klar erkennbar ist.\n\nGenehmige den Bericht, wenn er früheren Berichten derselben Person sehr ähnlich ist.\n\nLehne Berichte mit mehr als 500 $ an Reisekosten ab.',
},
expenseRulesPage: {
title: 'Ausgabenregeln',
diff --git a/src/languages/fr.ts b/src/languages/fr.ts
index 54eebfe6..8e4b0aca 100644
--- a/src/languages/fr.ts
+++ b/src/languages/fr.ts
@@ -2743,12 +2743,12 @@ ${amount} pour ${merchant} - ${date}`,
addAgentPage: {
title: 'Nouvel agent',
agentName: 'Nom de l’agent',
- instructions: 'Écrire des instructions personnalisées',
+ instructions: 'Rédiger des instructions personnalisées',
createAgent: 'Créer un agent',
switchAvatar: 'Changer d’avatar',
defaultAgentName: (displayName: string) => `Agent de ${displayName}`,
defaultPrompt:
- 'Rejeter les dépenses liées aux jeux d’argent, aux films ou à d’autres raisons manifestement non professionnelles.\n\nRappeler à l’utilisateur d’inclure toujours une image de reçu montrant clairement le pourboire.\n\nApprouver le rapport s’il est très similaire aux rapports précédents du même utilisateur.\n\nRejeter les rapports contenant plus de 500 $ en frais de déplacement.',
+ 'Rejeter les dépenses liées aux jeux d’argent, aux films ou à d’autres motifs manifestement non professionnels.\n\nRappeler à l’utilisateur d’inclure systématiquement une image du reçu où le pourboire est clairement visible.\n\nApprouver le rapport s’il est très similaire aux rapports précédents du même utilisateur.\n\nRejeter les rapports contenant plus de 500 $ de frais de déplacement.',
},
expenseRulesPage: {
title: 'Règles de dépenses',
diff --git a/src/languages/it.ts b/src/languages/it.ts
index cd477def..3e6cd4fe 100644
--- a/src/languages/it.ts
+++ b/src/languages/it.ts
@@ -2737,7 +2737,7 @@ ${amount} per ${merchant} - ${date}`,
switchAvatar: 'Cambia avatar',
defaultAgentName: (displayName: string) => `Agente di ${displayName}`,
defaultPrompt:
- "Rifiutare le spese per giochi d'azzardo, cinema o altri motivi evidentemente non aziendali.\n\nRicordare all'utente di includere sempre un'immagine della ricevuta che mostri chiaramente la mancia.\n\nApprovare il rapporto se è molto simile ai rapporti precedenti dello stesso utente.\n\nRifiutare i rapporti con più di 500 $ di spese di viaggio.",
+ 'Rifiuta le spese relative a gioco d’azzardo, cinema o altri motivi chiaramente non legati all’attività.\n\nRicorda all’utente di includere sempre un’immagine della ricevuta in cui la mancia sia ben visibile.\n\nApprova il report se è molto simile ai report precedenti dello stesso utente.\n\nRifiuta i report con più di 500 $ di spese di viaggio.',
},
expenseRulesPage: {
title: 'Regole spese',
diff --git a/src/languages/ja.ts b/src/languages/ja.ts
index 52b0e8b4..9eef33fb 100644
--- a/src/languages/ja.ts
+++ b/src/languages/ja.ts
@@ -2703,14 +2703,14 @@ ${date} の ${merchant} への ${amount}`,
emptyAgents: {title: 'エージェントは作成されていません', subtitle: '手作業はやめて、代わりにエージェントに指示を出して、時間を大幅に節約しましょう。'},
},
addAgentPage: {
- title: '新しい担当者',
- agentName: '担当者名',
- instructions: 'カスタム手順を作成',
+ title: '新しいエージェント',
+ agentName: 'エージェント名',
+ instructions: 'カスタム指示を作成',
createAgent: 'エージェントを作成',
switchAvatar: 'アバターを切り替え',
- defaultAgentName: (displayName: string) => `${displayName}のエージェント`,
+ defaultAgentName: (displayName: string) => `${displayName} さんの代理人`,
defaultPrompt:
- 'ギャンブル、映画、その他の明らかに業務外の理由による経費を却下してください。\n\nチップがわかる領収書の画像を必ず添付するようユーザーに通知してください。\n\n同じユーザーの以前のレポートと非常に類似している場合はレポートを承認してください。\n\n交通費が500ドルを超えるレポートを却下してください。',
+ 'ギャンブル、映画、またはその他明らかにビジネス目的ではない理由による経費は却下します。\n\nチップの金額が明確にわかるレシート画像を必ず添付するよう、ユーザーにリマインドします。\n\n同じユーザーの過去のレポートと非常によく似ている場合は、そのレポートを承認します。\n\n出張費が500ドルを超えるレポートは却下します。',
},
expenseRulesPage: {
title: '経費ルール',
diff --git a/src/languages/nl.ts b/src/languages/nl.ts
index 06e30c85..28ff4e2f 100644
--- a/src/languages/nl.ts
+++ b/src/languages/nl.ts
@@ -2728,14 +2728,14 @@ ${amount} voor ${merchant} - ${date}`,
emptyAgents: {title: 'Geen agents aangemaakt', subtitle: 'Stop met dingen handmatig doen. Geef in plaats daarvan een opdracht aan een agent en bespaar jezelf veel tijd.'},
},
addAgentPage: {
- title: 'Nieuwe medewerker',
- agentName: 'Naam agent',
- instructions: 'Aangepaste instructies schrijven',
- createAgent: 'Agent maken',
- switchAvatar: 'Wissel avatar',
+ title: 'Nieuwe agent',
+ agentName: 'Naam medewerker',
+ instructions: 'Schrijf aangepaste instructies',
+ createAgent: 'Agent aanmaken',
+ switchAvatar: 'Profielavatar wisselen',
defaultAgentName: (displayName: string) => `Agent van ${displayName}`,
defaultPrompt:
- 'Uitgaven voor gokken, films of andere duidelijk niet-zakelijke redenen afwijzen.\n\nDe gebruiker altijd herinneren een bonafoto toe te voegen waarop de fooi duidelijk te zien is.\n\nHet rapport goedkeuren als het sterk lijkt op eerdere rapporten van dezelfde gebruiker.\n\nRapporten met meer dan $500 aan reiskosten afwijzen.',
+ 'Wijs declaraties af die zijn voor gokken, films of andere duidelijk niet-zakelijke redenen.\n\nHerinner de gebruiker eraan altijd een bonafbeelding toe te voegen waarop de fooi duidelijk is.\n\nKeur het verslag goed als het sterk lijkt op eerdere verslagen van dezelfde gebruiker.\n\nWijs verslagen af met meer dan $500 aan reiskosten.',
},
expenseRulesPage: {
title: 'Declaratieregels',
diff --git a/src/languages/pl.ts b/src/languages/pl.ts
index b5881191..1a633f9f 100644
--- a/src/languages/pl.ts
+++ b/src/languages/pl.ts
@@ -2726,9 +2726,9 @@ ${amount} dla ${merchant} - ${date}`,
instructions: 'Napisz własne instrukcje',
createAgent: 'Utwórz agenta',
switchAvatar: 'Zmień awatar',
- defaultAgentName: (displayName: string) => `Agent użytkownika ${displayName}`,
+ defaultAgentName: (displayName: string) => `Agent ${displayName}`,
defaultPrompt:
- 'Odrzucaj wydatki na hazard, filmy lub inne oczywiste powody niezwiązane z działalnością.\n\nPrzypominaj użytkownikowi o dołączeniu zdjęcia paragonu, na którym wyraźnie widać napiwek.\n\nZatwierdź raport, jeśli jest bardzo podobny do poprzednich raportów tego samego użytkownika.\n\nOdrzucaj raporty z wydatkami na podróże przekraczającymi 500 $.',
+ 'Odrzucaj wydatki związane z hazardem, filmami lub innymi oczywistymi celami niezwiązanymi z działalnością biznesową.\n\nPrzypominaj użytkownikowi, aby zawsze dołączał zdjęcie paragonu, na którym wysokość napiwku jest wyraźnie widoczna.\n\nZatwierdź raport, jeśli jest bardzo podobny do wcześniejszych raportów tego samego użytkownika.\n\nOdrzucaj raporty zawierające więcej niż 500 USD wydatków na podróże.',
},
expenseRulesPage: {
title: 'Reguły wydatków',
diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts
index 8eaf2423..68efa428 100644
--- a/src/languages/pt-BR.ts
+++ b/src/languages/pt-BR.ts
@@ -2728,7 +2728,7 @@ ${amount} para ${merchant} - ${date}`,
switchAvatar: 'Trocar avatar',
defaultAgentName: (displayName: string) => `Agente de ${displayName}`,
defaultPrompt:
- 'Rejeitar despesas com jogos de azar, filmes ou outros motivos claramente não comerciais.\n\nLembrar o usuário de sempre incluir uma imagem do recibo que mostre claramente a gorjeta.\n\nAprovar o relatório se for muito semelhante a relatórios anteriores do mesmo usuário.\n\nRejeitar relatórios com mais de US$ 500 em despesas de viagem.',
+ 'Rejeite despesas relacionadas a jogos de azar, cinema ou outros motivos claramente não relacionados ao negócio.\n\nLembre o usuário de sempre incluir uma imagem do recibo em que a gorjeta fique clara.\n\nAprove o relatório se ele for muito semelhante a relatórios anteriores do mesmo usuário.\n\nRejeite relatórios com mais de US$ 500 em despesas de viagem.',
},
expenseRulesPage: {
title: 'Regras de despesas',
diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts
index 141e416d..29afd758 100644
--- a/src/languages/zh-hans.ts
+++ b/src/languages/zh-hans.ts
@@ -2653,14 +2653,14 @@ ${amount}，商户：${merchant} - 日期：${date}`,
emptyAgents: {title: '尚未创建代理', subtitle: '别再手动处理这些事情了。交给智能代理去执行，为自己节省大量时间。'},
},
addAgentPage: {
- title: '新代理人',
- agentName: '代理姓名',
+ title: '新代理',
+ agentName: '代理名称',
instructions: '编写自定义说明',
createAgent: '创建代理',
switchAvatar: '切换头像',
- defaultAgentName: (displayName: string) => `${displayName}的代理`,
+ defaultAgentName: (displayName: string) => `${displayName} 的代理人`,
defaultPrompt:
- '拒绝用于赌博、电影或其他明显非商业原因的费用。\n\n提醒用户始终附上清楚显示小费的收据图片。\n\n如果报告与同一用户之前的报告非常相似，则批准该报告。\n\n拒绝出行费用超过500美元的报告。',
+ '拒绝与赌博、电影或其他明显非商务原因相关的报销。\n\n提醒用户务必附上一张能清楚显示小费金额的收据图片。\n\n如果报销报告与同一用户之前的报告非常相似，则批准该报告。\n\n拒绝包含超过 500 美元差旅费用的报销报告。',
},
expenseRulesPage: {
title: '报销规则',
Note You can apply these changes to your branch by copying the patch to your clipboard, then running |
![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: a63929f285
ℹ️ About Codex in GitHub
Your team has set up Codex to 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 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
…ter and refactor AddAgentPage submission logic
…d update translations for agent creation
…rove default agent name handling
Co-authored-by: Copilot <copilot@github.com>
- Added new SVG files for bot avatars: Ice, Pink, Tangerine, and Yellow. - Updated DefaultBotAvatars.ts to include the new avatars. - Modified AddAgentPage.tsx to randomly select an avatar from the updated list for display.
NicolasBonet
force-pushed
the
feat/89310-add-agents-flow
branch
from
44ffcac to
1bb79fa
Compare
Contributor
|
🚧 @NicolasBonet has triggered a test Expensify/App build. You can view the workflow run here. |
Contributor
|
🚧 @NicolasBonet has triggered a test Expensify/App build. You can view the workflow run here. |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 1bb79fa9fd
ℹ️ About Codex in GitHub
Your team has set up Codex to 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 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Contributor
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
Contributor
|
Is it possible to only show one form error message in the form if there is just one message? I feel like we've done this elsewhere - basically the message directly above the button is kinda pointless given that it's easy to see the existing form error. That pattern was originally introduced for super long forms, to let you know you need to scroll up the screen. |
Contributor
|
For this component: It should match this component: Where we have outline around the secondary remix button. Can we standardize please? Ideally we don't need to recreate a new component and we can use existing ones: 
|
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
3 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
Implements the add agent form based on the design doc specification.
Fixed Issues
$ #89310
PROPOSAL: https://expensify.enterprise.slack.com/docs/T03SC9DTT/F0AKV1FPD41
Tests
Offline tests
No special steps needed.
QA Steps
Same as tests
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./** 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
Screen.Recording.2026-05-04.at.4.31.14.PM.mov
iOS: mWeb Safari
MacOS: Chrome / Safari
Screen.Recording.2026-05-04.at.5.12.52.PM.mov