feat: list agents#89409
Conversation
- Add AgentsListRow component for displaying individual agent details. - Update AgentsPage to utilize new AgentsListRow and manage agent data from Onyx. - Introduce SHARED_NVP_AGENT_PROMPT key in ONYXKEYS for agent prompts. - Enhance translations for agents page subtitle to improve clarity. - Create AgentPrompt type for better data structure in Onyx. - Update unit tests to cover new agent list functionality and ensure proper rendering.
…bility. Update styles to include background highlight, margin, and padding adjustments, as well as refine text styling for better visual hierarchy.
… visual consistency. Introduce new styles for avatar container and inner elements to ensure proper sizing and alignment.
|
@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 ✍️ ✅ |
🦜 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..c1dbb205 100644
--- a/src/languages/de.ts
+++ b/src/languages/de.ts
@@ -2723,7 +2723,7 @@ ${amount} für ${merchant} – ${date}`,
},
agentsPage: {
title: 'Agenten',
- subtitle: 'Automatisiere Aufgaben mit benutzerdefinierten Agenten.',
+ subtitle: 'Erstelle Agents, die deinen Workflow übernehmen. Spare dir die manuelle Arbeit und gewinne stundenweise Zeit im Alltag zurück.',
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.'},
},
diff --git a/src/languages/fr.ts b/src/languages/fr.ts
index 284b29e5..8f24e18a 100644
--- a/src/languages/fr.ts
+++ b/src/languages/fr.ts
@@ -2729,7 +2729,7 @@ ${amount} pour ${merchant} - ${date}`,
},
agentsPage: {
title: 'Agent·e·s',
- subtitle: 'Automatisez les tâches avec des agents personnalisés.',
+ subtitle: 'Créez des agents pour gérer votre flux de travail. Évitez le travail manuel et gagnez des heures dans votre journée.',
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.'},
},
diff --git a/src/languages/it.ts b/src/languages/it.ts
index 1e4f32d7..6ea7e953 100644
--- a/src/languages/it.ts
+++ b/src/languages/it.ts
@@ -2718,7 +2718,7 @@ ${amount} per ${merchant} - ${date}`,
},
agentsPage: {
title: 'Agenti',
- subtitle: 'Automatizza le attività con agenti personalizzati.',
+ subtitle: 'Crea agenti per gestire il tuo flusso di lavoro. Elimina il lavoro manuale e recupera ore della tua giornata.',
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.'},
},
diff --git a/src/languages/ja.ts b/src/languages/ja.ts
index 5ff49e2b..b58219a4 100644
--- a/src/languages/ja.ts
+++ b/src/languages/ja.ts
@@ -2691,7 +2691,7 @@ ${date} の ${merchant} への ${amount}`,
},
agentsPage: {
title: 'エージェント',
- subtitle: 'カスタムエージェントでタスクを自動化。',
+ subtitle: 'ワークフローを処理するエージェントを作成しましょう。手作業を省いて、1日の時間を何時間も取り戻せます。',
newAgent: '新しいエージェント',
emptyAgents: {title: 'エージェントは作成されていません', subtitle: '手作業はやめて、代わりにエージェントに指示を出して、時間を大幅に節約しましょう。'},
},
diff --git a/src/languages/nl.ts b/src/languages/nl.ts
index afb6f494..4d552f2a 100644
--- a/src/languages/nl.ts
+++ b/src/languages/nl.ts
@@ -2716,7 +2716,7 @@ ${amount} voor ${merchant} - ${date}`,
},
agentsPage: {
title: 'Agenten',
- subtitle: 'Automatiseer taken met aangepaste agents.',
+ subtitle: 'Maak agents aan om je workflow af te handelen. Sla het handmatige werk over en krijg uren van je dag terug.',
newAgent: 'Nieuwe medewerker',
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.'},
},
diff --git a/src/languages/pl.ts b/src/languages/pl.ts
index f019f242..dd5b68ed 100644
--- a/src/languages/pl.ts
+++ b/src/languages/pl.ts
@@ -2709,7 +2709,7 @@ ${amount} dla ${merchant} - ${date}`,
},
agentsPage: {
title: 'Agenci',
- subtitle: 'Automatyzuj zadania za pomocą niestandardowych agentów.',
+ subtitle: 'Twórz agentów do obsługi swojego przepływu pracy. Pomiń ręczną pracę i odzyskaj godziny w ciągu dnia.',
newAgent: 'Nowy agent',
emptyAgents: {title: 'Nie utworzono agentów', subtitle: 'Przestań robić wszystko ręcznie. Wydaj instrukcje agentowi i zaoszczędź mnóstwo czasu.'},
},
diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts
index a96d6bd5..93a87e96 100644
--- a/src/languages/pt-BR.ts
+++ b/src/languages/pt-BR.ts
@@ -2709,7 +2709,7 @@ ${amount} para ${merchant} - ${date}`,
},
agentsPage: {
title: 'Agentes',
- subtitle: 'Automatize tarefas com agentes personalizados.',
+ subtitle: 'Crie agentes para gerenciar seu fluxo de trabalho. Pule o trabalho manual e ganhe horas de volta no seu dia.',
newAgent: 'Novo agente',
emptyAgents: {title: 'Nenhum agente criado', subtitle: 'Pare de fazer tudo manualmente. Instrua um agente e economize muito tempo.'},
},
diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts
index 9800997c..dc02bcfc 100644
--- a/src/languages/zh-hans.ts
+++ b/src/languages/zh-hans.ts
@@ -2641,7 +2641,7 @@ ${amount},商户:${merchant} - 日期:${date}`,
},
agentsPage: {
title: '代理人',
- subtitle: '使用自定义代理自动化任务。',
+ subtitle: '创建智能代理来处理您的工作流程。跳过手动操作,每天为自己节省数小时。',
newAgent: '新代理',
emptyAgents: {title: '未创建代理', subtitle: '别再手动处理这些事情了。交给智能助理去执行,帮你节省大量时间。'},
},
Note You can apply these changes to your branch by copying the patch to your clipboard, then running |
…nce clarity and consistency. Adjust titles, subtitles, and messages for improved user experience, including gender-neutral language and refined phrasing.
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 6d27f7f4bb
ℹ️ 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".
|
I have read the CLA Document and I hereby sign the CLA |
Codecov Report✅ Changes either increased or maintained existing code coverage, great job!
|
…lity and styling consistency. Remove unnecessary comments in AgentsListRowProps and simplify the renderItem function in AgentsPage. Update avatar styles to use variables for better maintainability.
…es to enhance clarity and user experience. Refine phrasing to emphasize workflow management and time-saving benefits.
|
🚧 @NicolasBonet has triggered a test Expensify/App build. You can view the workflow run here. |
… accountID, displayName, login, and avatar. Update comment regarding action buttons to align with phased rollout plan.
This comment has been minimized.
This comment has been minimized.
…th ReportActionAvatars for improved visual consistency. Remove avatar prop from AgentsPage and update related styles. Integrate usePersonalDetails hook for better data handling in AgentsPage.
…ileOfflineIndicatorStickToBottom prop to false for improved layout on mobile devices.
|
🚧 @NicolasBonet has triggered a test Expensify/App build. You can view the workflow run here. |
|
Can you test on web I think it's still cutting the last item Screen.Recording.2026-05-01.at.10.57.44.PM.mov |
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
|
Ah my bad, yeah it's fixed Thanks! |





Explanation of Change
Implements the agents list which is right now simply mocking data as the BE is not fully done.
Fixed Issues
$ #89299
PROPOSAL: https://expensify.enterprise.slack.com/docs/T03SC9DTT/F0AKV1FPD41
Tests
Offline tests
No relevant information for offline testing
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