feat: Add Agents feature with corresponding UI and translations#89304
feat: Add Agents feature with corresponding UI and translations#89304puneetlath merged 4 commits intomainfrom
Conversation
|
@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] |
|
All contributors have signed the CLA ✍️ ✅ |
This comment has been minimized.
This comment has been minimized.
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: e77a34a2be
ℹ️ 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".
|
🚧 @NicolasBonet has triggered a test Expensify/App build. You can view the workflow run here. |
Codecov Report✅ Changes either increased or maintained existing code coverage, great job!
|
This comment has been minimized.
This comment has been minimized.
|
@NicolasBonet does this PR also implement this: #89284 (comment)? |
No, adding that! |
Added to the PR |
5ffd394 to
ae55c2f
Compare
|
I have read the CLA Document and I hereby sign the CLA |
595b85f to
56e0d45
Compare
This comment has been minimized.
This comment has been minimized.
56e0d45 to
0c7cc30
Compare
|
I have read the CLA Document and I hereby sign the CLA |
|
🚧 @NicolasBonet 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! 🧪🧪
|
b9351e3 to
af1d605
Compare
|
🚧 @NicolasBonet 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! 🧪🧪
|
Translate "No agents created" messages to multiple languages for improved user experience Refactor SVG files for improved structure and readability, removing unnecessary metadata and optimizing paths. Refactor AgentsPage component to use constants for layout dimensions, improving maintainability and readability. Update illustrations.chunk.ts to include TvScreenRobot SVG, enhancing the icon library. feat: Add OPEN_AGENTS_PAGE command and integrate it into AgentsPage component Refactor AgentsPage component to simplify empty state handling by removing unused constants and updating styles for better maintainability. Refactor Agent actions to use named imports for better clarity and consistency in the AgentsPage component. Update unit tests to reflect these changes.
…ancing clarity and consistency in messaging. Adjust titles and subtitles for improved user experience on agents page.
… improving consistency in messaging for the user interface.
af1d605 to
89f9abb
Compare
🦜 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 d0e224c0..4813fb6e 100644
--- a/src/languages/de.ts
+++ b/src/languages/de.ts
@@ -2723,9 +2723,9 @@ ${amount} für ${merchant} – ${date}`,
},
agentsPage: {
title: 'Agenten',
- subtitle: 'Automatisiere Aufgaben mit benutzerdefinierten Agenten.',
- newAgent: 'Neue*r Agent*in',
- emptyAgents: {title: 'Keine Agenten erstellt', subtitle: 'Hör auf, Dinge manuell zu erledigen. Weise stattdessen einen Agenten an und spare dir jede Menge Zeit.'},
+ subtitle: 'Automatisiere Aufgaben mit benutzerdefinierten Agents.',
+ newAgent: 'Neue:r Agent:in',
+ emptyAgents: {title: 'Keine Agenten erstellt', subtitle: 'Hör auf, Dinge manuell zu erledigen. Weise stattdessen eine:n Agent:in an und spare dir eine Menge Zeit.'},
},
expenseRulesPage: {
title: 'Ausgabenregeln',
diff --git a/src/languages/fr.ts b/src/languages/fr.ts
index 284b29e5..1e969276 100644
--- a/src/languages/fr.ts
+++ b/src/languages/fr.ts
@@ -2728,10 +2728,10 @@ ${amount} pour ${merchant} - ${date}`,
bankAccountLastFour: (lastFour: string) => `Compte bancaire • ${lastFour}`,
},
agentsPage: {
- title: 'Agent·e·s',
+ title: 'Agents',
subtitle: 'Automatisez les tâches avec des agents personnalisés.',
newAgent: 'Nouvel agent',
- emptyAgents: {title: 'Aucun agent créé', subtitle: 'Arrêtez de tout faire manuellement. Donnez plutôt des instructions à un agent et gagnez beaucoup de temps.'},
+ emptyAgents: {title: 'Aucun agent créé', subtitle: 'Arrêtez de faire les choses manuellement. Donnez plutôt des instructions à un agent et gagnez beaucoup de temps.'},
},
expenseRulesPage: {
title: 'Règles de dépenses',
diff --git a/src/languages/it.ts b/src/languages/it.ts
index 1e4f32d7..7151601d 100644
--- a/src/languages/it.ts
+++ b/src/languages/it.ts
@@ -2720,7 +2720,7 @@ ${amount} per ${merchant} - ${date}`,
title: 'Agenti',
subtitle: 'Automatizza le attività con agenti personalizzati.',
newAgent: 'Nuovo agente',
- emptyAgents: {title: 'Nessun agente creato', subtitle: 'Smetti di fare le cose manualmente. Dai invece istruzioni a un agente e risparmia un sacco di tempo.'},
+ emptyAgents: {title: 'Nessun agente creato', subtitle: 'Smetti di fare le cose manualmente. Dai istruzioni a un agente e risparmia un sacco di tempo.'},
},
expenseRulesPage: {
title: 'Regole spese',
diff --git a/src/languages/ja.ts b/src/languages/ja.ts
index 5ff49e2b..f0816403 100644
--- a/src/languages/ja.ts
+++ b/src/languages/ja.ts
@@ -2690,8 +2690,8 @@ ${date} の ${merchant} への ${amount}`,
bankAccountLastFour: (lastFour: string) => `銀行口座・${lastFour}`,
},
agentsPage: {
- title: 'エージェント',
- subtitle: 'カスタムエージェントでタスクを自動化。',
+ title: '担当者',
+ subtitle: 'カスタムエージェントでタスクを自動化しましょう。',
newAgent: '新しいエージェント',
emptyAgents: {title: 'エージェントは作成されていません', subtitle: '手作業はやめて、代わりにエージェントに指示を出して、時間を大幅に節約しましょう。'},
},
diff --git a/src/languages/nl.ts b/src/languages/nl.ts
index afb6f494..d406cb82 100644
--- a/src/languages/nl.ts
+++ b/src/languages/nl.ts
@@ -95,7 +95,7 @@ const translations: TranslationDeepObject<typeof en> = {
optional: 'Optioneel',
new: 'Nieuw',
newFeature: 'Nieuwe functie',
- beta: 'Beta',
+ beta: 'Bèta',
search: 'Zoeken',
reports: 'Rapporten',
spend: 'Uitgaven',
diff --git a/src/languages/pl.ts b/src/languages/pl.ts
index f019f242..77ea07ec 100644
--- a/src/languages/pl.ts
+++ b/src/languages/pl.ts
@@ -2711,7 +2711,7 @@ ${amount} dla ${merchant} - ${date}`,
title: 'Agenci',
subtitle: 'Automatyzuj zadania za pomocą niestandardowych agentów.',
newAgent: 'Nowy agent',
- emptyAgents: {title: 'Nie utworzono agentów', subtitle: 'Przestań robić wszystko ręcznie. Wydaj instrukcje agentowi i zaoszczędź mnóstwo czasu.'},
+ emptyAgents: {title: 'Nie utworzono agentów', subtitle: 'Przestań robić wszystko ręcznie. Zamiast tego wydaj polecenia agentowi i zaoszczędź mnóstwo czasu.'},
},
expenseRulesPage: {
title: 'Reguły wydatków',
diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts
index 9800997c..fd344b5f 100644
--- a/src/languages/zh-hans.ts
+++ b/src/languages/zh-hans.ts
@@ -2641,9 +2641,9 @@ ${amount},商户:${merchant} - 日期:${date}`,
},
agentsPage: {
title: '代理人',
- subtitle: '使用自定义代理自动化任务。',
- newAgent: '新代理',
- emptyAgents: {title: '未创建代理', subtitle: '别再手动处理这些事情了。交给智能助理去执行,帮你节省大量时间。'},
+ subtitle: '通过自定义智能体自动化处理任务。',
+ newAgent: '新代理人',
+ emptyAgents: {title: '尚未创建代理', subtitle: '别再手动处理这些事情了。交给智能代理去执行,为自己节省大量时间。'},
},
expenseRulesPage: {
title: '报销规则',
Note You can apply these changes to your branch by copying the patch to your clipboard, then running |
…d styling flexibility. Update AgentsPage to utilize new subtitleStyles for better presentation of empty state messages. Add corresponding styles for agents page subtitle in the styles index.
Reviewer Checklist
Screenshots/VideosAndroid: HybridAppAndroid: mWeb ChromeiOS: HybridAppiOS: mWeb Safari |
|
@puneetlath looks like this was merged without a test passing. Please add a note explaining why this was done and remove the |
|
🚧 @puneetlath has triggered a test Expensify/App build. You can view the workflow run here. |
|
@NicolasBonet did sign the CLA here. The check is failing because of this bug: https://github.com/Expensify/Expensify/issues/631744 |
|
🧪🧪 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/puneetlath in version: 9.3.66-0 🚀
|
|
I reviewed the changes in this PR and no help site updates are required at this time. Reasoning:
Help site articles should be created when the Agents feature becomes generally available and has actual functionality (e.g., creating, configuring, and managing agents) for users to interact with. |

Explanation of Change
Adds the agents empty state page using betas to cover hide it from users unwilling to try it.
Fixed Issues
$ #89284
PROPOSAL: https://expensify.enterprise.slack.com/docs/T03SC9DTT/F0AKV1FPD41
Tests
Automated tests
I added four tests to cover the beta flag and also the network request.
Offline tests
No specific test 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
iOS: mWeb Safari
MacOS: Chrome / Safari