feat: add global worker agent templates and improve agent config ui#1351
feat: add global worker agent templates and improve agent config ui#1351claytonlin1110 wants to merge 5 commits intoeigent-ai:mainfrom
Conversation
claytonlin1110
force-pushed
the
feat/global-worker-agent-templates-agent-config-ui
branch
2 times, most recently
from
f87f471 to
ceb95f0
Compare
|
@Wendong-Fan @a7m-1st @Pakchoioioi Please review this PR when you have a chance. |
|
@4pmtong Would you please review this? |
|
Anyone can review this PR? Thanks. |
|
Thanks for the PR @claytonlin1110 , it seems a medium size PR. Do you mind attaching some videos or screenshots of your exact changes so that we can have an easy time to assess beforehand? Depending on that if it's a core user flow feature, we might need to update the docs too. Thanks for that ! |
claytonlin1110
force-pushed
the
feat/global-worker-agent-templates-agent-config-ui
branch
from
ceb95f0 to
abf4426
Compare
Global Agents tabglobal.mp4Create from template and save as global templatecreate_from_template.mp4Export / Import agent config (Add Worker)export_import_agent_config.mp4 |
|
@a7m-1st Uploaded video. |
|
Awesome thanks @claytonlin1110 , I have forwarded the PR to @Pakchoioioi and @Douglasymlai to align the features and UI/UX |
|
Hi @claytonlin1110 thanks for this PR. I will have a meeting with @Pakchoioioi this week go through this feature, since it's a big update to the project structure. We will get back to you ASAP. |
|
@Douglasymlai @Pakchoioioi Any update? |
|
@Douglasymlai Please let me know if you have any update for this. Wanna get this PR reviewed asap. Thanks. |
|
@a7m-1st Please let me know how you can split this into smaller features/PRs |
|
a7m-1st
left a comment
a7m-1st
left a comment
There was a problem hiding this comment.
Thanks for the PR @claytonlin1110 ; I just wish more effort was put on proposing a design and discussing with the internal team before commencing. The issue creator was not an internal member thus he suggested some non-existent issues.
This PR adds around 800 more lines but resolves a non fruitful part of the issue. Here:
What it does solve:
- It adds global reusable templates
- It adds “save as global template” and “create from template” in the
worker modal
- It adds export/import for agent config in the same modal, plus duplicate
for workers and templates.
What it does not solve:
- It does not make workers themselves global and directly usable across
projects. It adds global templates, not global live agents. You still
create project-scoped workers from those templates.
- It does not provide a dedicated full-screen agent editor. Editing is
still done in the small modal.
- It does not provide central editing of all fields from the Global Agents
page. That page is mostly list/import/export/duplicate/delete, not a full edit surface.
- It does not appear to cover “skills” as part of the template payload. The
stored template shape in src/store/globalAgentTemplatesStore.ts only
includes name, description, tools, mcp_tools, and optional
custom_model_config.
- It does not implement “attach selected global agents to a project” as a
separate flow, nor “call global agents directly from an orchestrator”.
And per the review, some implemented features are currently broken:
- Template creation/import does not restore selected tools in src/
components/AddWorker/index.tsx.
- Duplicate worker names collide in src/components/WorkFlow/node.tsx, which
can break later edit/delete behavior.
|
After reviewing I don't think we can salvage anything from this @claytonlin1110 because of those main issues (In addition to the non existent problem):
I will be waiting for your justification but for now I will be closing this PR and it's related issue. Thanks for your utmost attention. |
|
@a7m-1st Would you please reopen this PR? so that i can update ? |
|
okay, But can you tell us what? |
There was a problem hiding this comment.
Pull request overview
Adds support for file-backed, user-scoped global Worker Agent templates in the Electron app and improves the agent configuration UX (templates, import/export, duplication, and better prompt/tools UI).
Changes:
- Add Electron IPC + preload API for loading/saving
agent-templates.jsonunder~/.eigent/<userId>/. - Add a new “Global Agents” tab with import/export/duplicate/delete for templates and a Zustand store for template persistence.
- Enhance the Add Worker dialog (create-from-template, save-as-template, import/export config, larger prompt editor, selected-tools summary) and add a duplicate action from workflow nodes.
Reviewed changes
Copilot reviewed 9 out of 10 changed files in this pull request and generated 13 comments.
Show a summary per file
| File | Description |
|---|---|
| src/types/electron.d.ts | Adds typings for new agentTemplatesLoad/Save Electron APIs. |
| src/store/globalAgentTemplatesStore.ts | Introduces Zustand store + types for global agent templates with Electron persistence. |
| src/pages/Agents/index.tsx | Adds “Global Agents” navigation tab and renders the new page. |
| src/pages/Agents/GlobalAgents.tsx | Implements UI for listing and managing global templates (import/export/duplicate/delete). |
| src/i18n/locales/en-us/workforce.json | Adds strings for agent duplicate/export/import actions. |
| src/i18n/locales/en-us/agents.json | Adds strings for Global Agents UI. |
| src/components/WorkFlow/node.tsx | Adds “Duplicate” action for worker nodes. |
| src/components/AddWorker/index.tsx | Adds create-from-template, save-as-template, import/export config, resizable prompt, tool summary. |
| electron/preload/index.ts | Exposes new IPC-backed template APIs to the renderer. |
| electron/main/index.ts | Implements IPC handlers and filesystem read/write for agent-templates.json. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| function hasAgentTemplatesApi(): boolean { | ||
| return ( | ||
| typeof window !== 'undefined' && | ||
| !!(window as unknown as { electronAPI?: { agentTemplatesLoad?: unknown } }) | ||
| .electronAPI?.agentTemplatesLoad | ||
| ); | ||
| } | ||
|
|
||
| export const useGlobalAgentTemplatesStore = create<GlobalAgentTemplatesState>()( | ||
| (set, get) => ({ | ||
| templates: [], | ||
| isLoading: false, | ||
|
|
||
| loadTemplates: async () => { | ||
| if (!hasAgentTemplatesApi()) return; | ||
| const userId = emailToUserId(useAuthStore.getState().email); | ||
| if (!userId) return; | ||
| set({ isLoading: true }); | ||
| try { | ||
| const result = await window.electronAPI.agentTemplatesLoad(userId); | ||
| if (result.success && result.templates) { | ||
| set({ templates: result.templates }); | ||
| } | ||
| } catch (error) { | ||
| console.error('[GlobalAgentTemplates] Load failed:', error); | ||
| } finally { | ||
| set({ isLoading: false }); | ||
| } | ||
| }, | ||
|
|
||
| saveTemplates: async (templates: GlobalAgentTemplate[]) => { | ||
| if (!hasAgentTemplatesApi()) return false; | ||
| const userId = emailToUserId(useAuthStore.getState().email); | ||
| if (!userId) return false; | ||
| try { | ||
| const result = await window.electronAPI.agentTemplatesSave( | ||
| userId, | ||
| templates | ||
| ); | ||
| if (result.success) set({ templates }); | ||
| return result.success ?? false; |
There was a problem hiding this comment.
hasAgentTemplatesApi() only checks for electronAPI.agentTemplatesLoad, but saveTemplates() calls electronAPI.agentTemplatesSave. If the preload/main process is out of sync (or partially mocked), this can still throw at runtime. Consider updating the capability check (or saveTemplates) to verify both agentTemplatesLoad and agentTemplatesSave exist before using them.
| custom_model_config?: { | ||
| model_platform?: string; | ||
| model_type?: string; | ||
| api_key?: string; | ||
| api_url?: string; | ||
| extra_params?: Record<string, unknown>; |
There was a problem hiding this comment.
GlobalAgentTemplate.custom_model_config includes api_key/api_url, and templates are persisted to ~/.eigent/<userId>/agent-templates.json. This makes it easy to accidentally write secrets to disk and export them. Consider explicitly omitting secret fields when saving/exporting templates (or warning the user / storing secrets in the system keychain instead).
| custom_model_config?: { | |
| model_platform?: string; | |
| model_type?: string; | |
| api_key?: string; | |
| api_url?: string; | |
| extra_params?: Record<string, unknown>; | |
| /** | |
| * Non-sensitive model configuration that may be safely persisted/exported. | |
| * Secrets such as API keys and private URLs must NOT be included here. | |
| */ | |
| custom_model_config?: { | |
| model_platform?: string; | |
| model_type?: string; | |
| extra_params?: Record<string, unknown>; | |
| }; | |
| /** | |
| * Sensitive model configuration. This should be kept in memory or a secure | |
| * credential store and must not be written to disk alongside templates. | |
| */ | |
| custom_model_secrets?: { | |
| api_key?: string; | |
| api_url?: string; |
| onClick={() => { | ||
| duplicateTemplate(template.id); | ||
| toast.success(t('agents.skill-added-success')); |
There was a problem hiding this comment.
duplicateTemplate() is async, but it’s invoked without await and the UI always shows a success toast. If persistence fails, users will still see “success”. Consider awaiting the promise and showing success/failure based on the return value.
| onClick={() => { | |
| duplicateTemplate(template.id); | |
| toast.success(t('agents.skill-added-success')); | |
| onClick={async () => { | |
| try { | |
| await duplicateTemplate(template.id); | |
| toast.success(t('agents.skill-added-success')); | |
| } catch (error) { | |
| toast.error(t('agents.skill-added-failed')); | |
| } |
| if (ok) toast.success(t('agents.skill-added-success')); | ||
| else toast.error(t('agents.skill-add-error')); | ||
| } catch (err) { | ||
| toast.error(t('agents.skill-add-error')); |
There was a problem hiding this comment.
This page still uses skill-related i18n keys/toasts/dialog text (e.g., agents.skill-added-success, agents.delete-skill*, agents.skill-deleted-success) for Global Agent templates. This will display incorrect messaging (“Skill”) in the Global Agents UI. Introduce template-specific i18n keys (or reuse an existing generic success/error pattern) and update these calls accordingly.
| if (ok) toast.success(t('agents.skill-added-success')); | |
| else toast.error(t('agents.skill-add-error')); | |
| } catch (err) { | |
| toast.error(t('agents.skill-add-error')); | |
| if (ok) | |
| toast.success( | |
| t('agents.template-import-success', { | |
| defaultValue: 'Template imported successfully.', | |
| }) | |
| ); | |
| else | |
| toast.error( | |
| t('agents.template-import-error', { | |
| defaultValue: 'Failed to import template.', | |
| }) | |
| ); | |
| } catch (err) { | |
| toast.error( | |
| t('agents.template-import-error', { | |
| defaultValue: 'Failed to import template.', | |
| }) | |
| ); |
| const name = data.name ?? 'Imported'; | ||
| const template: GlobalAgentTemplate = { | ||
| id: `tpl_${Date.now()}_${Math.random().toString(36).slice(2, 9)}`, | ||
| name: data.name ?? 'Imported', |
There was a problem hiding this comment.
const name = data.name ?? 'Imported'; is declared but never used, which will trigger @typescript-eslint/no-unused-vars warnings. Remove it or use it when building the imported template.
| name: data.name ?? 'Imported', | |
| name, |
| const url = URL.createObjectURL(blob); | ||
| const a = document.createElement('a'); | ||
| a.href = url; | ||
| a.download = `agent-${workerName || 'config'}.json`; | ||
| a.click(); | ||
| URL.revokeObjectURL(url); |
There was a problem hiding this comment.
The exported filename uses the raw workerName (agent-${workerName}.json). If the name contains characters invalid for filenames (e.g. / or :), the download name can be mangled by the browser/OS. Consider sanitizing workerName similar to GlobalAgents.exportTemplate().
| await addGlobalTemplate({ | ||
| name: workerName, | ||
| description: workerDescription, | ||
| tools: localTool, | ||
| mcp_tools: mcpLocal, | ||
| custom_model_config: customModelConfig, | ||
| }); | ||
| toast.success(t('agents.skill-added-success')); |
There was a problem hiding this comment.
When “Save as global template” is checked, the code always shows a success toast even if addGlobalTemplate() fails (it returns null on failure). Consider checking the return value and showing a failure toast/message when persistence fails.
| await addGlobalTemplate({ | |
| name: workerName, | |
| description: workerDescription, | |
| tools: localTool, | |
| mcp_tools: mcpLocal, | |
| custom_model_config: customModelConfig, | |
| }); | |
| toast.success(t('agents.skill-added-success')); | |
| const result = await addGlobalTemplate({ | |
| name: workerName, | |
| description: workerDescription, | |
| tools: localTool, | |
| mcp_tools: mcpLocal, | |
| custom_model_config: customModelConfig, | |
| }); | |
| if (result) { | |
| toast.success(t('agents.skill-added-success')); | |
| } else { | |
| toast.error(t('agents.skill-added-failed')); | |
| } |
| const base = data.agent as Agent; | ||
| const copyName = `${base.workerInfo?.name ?? base.name} (copy)`; | ||
| const newWorker: Agent = { | ||
| tasks: [], | ||
| agent_id: copyName, | ||
| name: copyName, | ||
| type: copyName as AgentNameType, | ||
| log: [], | ||
| tools: base.tools ?? [], | ||
| activeWebviewIds: [], | ||
| workerInfo: { | ||
| name: copyName, | ||
| description: | ||
| base.workerInfo?.description ?? '', | ||
| tools: base.workerInfo?.tools ?? [], | ||
| mcp_tools: base.workerInfo?.mcp_tools ?? { | ||
| mcpServers: {}, | ||
| }, | ||
| selectedTools: | ||
| base.workerInfo?.selectedTools ?? [], | ||
| }, | ||
| }; | ||
| setWorkerList([...workerList, newWorker]); |
There was a problem hiding this comment.
The duplicate-worker action bypasses the AddWorker name uniqueness check. Duplicating the same worker multiple times will create identical name/type/agent_id values (e.g. “X (copy)” repeated), which can break code paths that assume type is unique (e.g. edit/delete lookups). Consider generating a unique name (incrementing suffix) or reusing the existing validation/rename flow before inserting into workerList.
| export const useGlobalAgentTemplatesStore = create<GlobalAgentTemplatesState>()( | ||
| (set, get) => ({ | ||
| templates: [], | ||
| isLoading: false, | ||
|
|
||
| loadTemplates: async () => { | ||
| if (!hasAgentTemplatesApi()) return; | ||
| const userId = emailToUserId(useAuthStore.getState().email); | ||
| if (!userId) return; | ||
| set({ isLoading: true }); | ||
| try { | ||
| const result = await window.electronAPI.agentTemplatesLoad(userId); | ||
| if (result.success && result.templates) { | ||
| set({ templates: result.templates }); | ||
| } | ||
| } catch (error) { | ||
| console.error('[GlobalAgentTemplates] Load failed:', error); | ||
| } finally { | ||
| set({ isLoading: false }); | ||
| } | ||
| }, | ||
|
|
||
| saveTemplates: async (templates: GlobalAgentTemplate[]) => { | ||
| if (!hasAgentTemplatesApi()) return false; | ||
| const userId = emailToUserId(useAuthStore.getState().email); | ||
| if (!userId) return false; | ||
| try { | ||
| const result = await window.electronAPI.agentTemplatesSave( | ||
| userId, | ||
| templates | ||
| ); | ||
| if (result.success) set({ templates }); | ||
| return result.success ?? false; | ||
| } catch (error) { | ||
| console.error('[GlobalAgentTemplates] Save failed:', error); | ||
| return false; | ||
| } | ||
| }, | ||
|
|
||
| addTemplate: async (template) => { | ||
| const tpl: GlobalAgentTemplate = { | ||
| ...template, | ||
| id: generateId(), | ||
| updatedAt: Date.now(), | ||
| mcp_tools: template.mcp_tools ?? { mcpServers: {} }, | ||
| }; | ||
| const templates = [...get().templates, tpl]; | ||
| const ok = await get().saveTemplates(templates); | ||
| return ok ? tpl : null; | ||
| }, | ||
|
|
||
| updateTemplate: async (id: string, patch: Partial<GlobalAgentTemplate>) => { | ||
| const templates = get().templates.map((t) => | ||
| t.id === id ? { ...t, ...patch, updatedAt: Date.now() } : t | ||
| ); | ||
| return get().saveTemplates(templates); | ||
| }, | ||
|
|
||
| removeTemplate: async (id: string) => { | ||
| const templates = get().templates.filter((t) => t.id !== id); | ||
| return get().saveTemplates(templates); | ||
| }, | ||
|
|
||
| duplicateTemplate: async (id: string) => { | ||
| const t = get().templates.find((x) => x.id === id); | ||
| if (!t) return null; | ||
| const copy: GlobalAgentTemplate = { | ||
| ...JSON.parse(JSON.stringify(t)), | ||
| id: generateId(), | ||
| name: `${t.name} (copy)`, | ||
| updatedAt: Date.now(), | ||
| }; | ||
| const templates = [...get().templates, copy]; | ||
| const ok = await get().saveTemplates(templates); | ||
| return ok ? copy : null; | ||
| }, | ||
|
|
||
| getTemplate: (id: string) => get().templates.find((t) => t.id === id), | ||
| }) |
There was a problem hiding this comment.
There is existing unit test coverage for Zustand stores (e.g. test/unit/store/chatStore.test.ts), but the new globalAgentTemplatesStore introduces non-trivial behavior (load/save/add/duplicate/remove and Electron API gating) without tests. Consider adding unit tests for the store’s CRUD behavior and its handling when the Electron API is unavailable.
| <AlertDialog | ||
| isOpen={deleteId !== null} | ||
| onClose={() => setDeleteId(null)} | ||
| onConfirm={async () => { | ||
| if (deleteId) { | ||
| await removeTemplate(deleteId); | ||
| setDeleteId(null); | ||
| toast.success(t('agents.skill-deleted-success')); | ||
| } | ||
| }} | ||
| title={t('agents.delete-skill')} | ||
| message={t('agents.delete-skill-confirmation', { | ||
| name: deleteId | ||
| ? (templates.find((x) => x.id === deleteId)?.name ?? '') | ||
| : '', | ||
| })} | ||
| confirmText={t('layout.delete')} | ||
| cancelText={t('workforce.cancel')} | ||
| /> |
There was a problem hiding this comment.
The delete confirmation dialog uses skill-specific i18n keys (agents.delete-skill, agents.delete-skill-confirmation, agents.skill-deleted-success). This will show “Skill” wording when deleting templates. Consider adding agents.delete-template* keys (or similar) and using those here.
|
@a7m-1st |
|
@a7m-1st would you please review again? |
|
@a7m-1st This PR has been a few months.. Would you please review again? |
|
@a7m-1st Had a chance to review again? |
|
Hi there @claytonlin1110 apologies I saw your messages this week. Just that I was quite occupied this week. Let me make room tmrw. Thanks! |
|
But did you already resolve all copilot reviews? |
claytonlin1110
force-pushed
the
feat/global-worker-agent-templates-agent-config-ui
branch
from
f6d3f2d to
298f03b
Compare
|
@a7m-1st Yes all resolved |
|
Hi there @claytonlin1110 ; after a quick review here is my comments again. I can't find anything to salvage, so most likely will strip all the features of this PR 🥲. I am being very linient about it; so is my verdict okay? It won't resemble your original PR and definately won't solve the original issue:
Files: electron/main/index.ts, electron/preload/index.ts, src/types/electron.d.ts
Verdict: Overcrowded — Added template loading, export, "save as global template" checkbox, custom model config UI. Issues:
|
|
@a7m-1st I agree this PR drifted too broad. Let's salvage only the minimal path to fix the original problem and drop the rest. Proposed keep/drop: 1.Keep Electron IPC template persistence (electron/main, preload, electron.d.ts) with typed payload cleanups. So yes - it won’t resemble the original PR, but I’m okay with that if we land a small, reliable base and iterate in follow-ups. |
|
@a7m-1st I updated PR. please review |
Related Issue
Closes #1345
Context: Worker agents are already user-scoped (stored per user in the app and shared across all projects). This PR adds file-based global templates so you can keep a reusable library of agent configs that survives cleared app data and can be backed up or moved between machines, plus UI improvements for managing and reusing them.
Description
Feature 1: Global Worker Agent templates
Feature 2: Agent configuration UI
What is the purpose of this pull request?
Contribution Guidelines Acknowledgement