Skip to content

Commit 644e4e6

Browse files
localai-botlocalai-bot
authored
feat: initial AgentHub setup with UI and workflow (#2)
* feat: initial AgentHub setup with UI and workflow - Add static HTML/JS webui for browsing and searching agents - Add CSS styling with modern card-based design - Add sample agent JSON configuration - Add GitHub Actions workflow for GitHub Pages deployment - Client-side search filters by name, description, model * fix: clear description and model fields per reviewer request
1 parent 11f584b commit 644e4e6

5 files changed

Lines changed: 685 additions & 0 deletions

File tree

‎.github/workflows/deploy.yml‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
name: Deploy to GitHub Pages
2+
3+
on:
4+
push:
5+
branches:
6+
- main
7+
8+
permissions:
9+
contents: read
10+
pages: write
11+
id-token: write
12+
13+
concurrency:
14+
group: "pages"
15+
cancel-in-progress: false
16+
17+
jobs:
18+
deploy:
19+
environment:
20+
name: github-pages
21+
url: ${{ steps.deployment.outputs.page_url }}
22+
runs-on: ubuntu-latest
23+
steps:
24+
- name: Checkout
25+
uses: actions/checkout@v4
26+
27+
- name: Setup Pages
28+
uses: actions/configure-pages@v4
29+
30+
- name: Upload artifact
31+
uses: actions/upload-pages-artifact@v3
32+
with:
33+
path: '.'
34+
35+
- name: Deploy to GitHub Pages
36+
id: deployment
37+
uses: actions/deploy-pages@v4

‎agents/manual-assistant.json‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
{
2+
"connectors": [],
3+
"actions": [],
4+
"dynamic_prompts": null,
5+
"mcp_servers": [],
6+
"mcp_prepare_script": "",
7+
"filters": null,
8+
"description": "",
9+
"model": "",
10+
"multimodal_model": "",
11+
"transcription_model": "",
12+
"transcription_language": "",
13+
"tts_model": "",
14+
"api_url": "",
15+
"api_key": "",
16+
"local_rag_url": "",
17+
"local_rag_api_key": "",
18+
"last_message_duration": "",
19+
"name": "ManualAssistant",
20+
"hud": false,
21+
"standalone_job": true,
22+
"random_identity": false,
23+
"initiate_conversations": false,
24+
"enable_planning": false,
25+
"plan_reviewer_model": "",
26+
"disable_sink_state": true,
27+
"identity_guidance": "",
28+
"periodic_runs": "10m",
29+
"scheduler_poll_interval": "",
30+
"permanent_goal": "",
31+
"enable_kb": false,
32+
"enable_kb_compaction": false,
33+
"kb_compaction_interval": "",
34+
"kb_compaction_summarize": false,
35+
"kb_auto_search": false,
36+
"kb_as_tools": false,
37+
"enable_reasoning": false,
38+
"enable_reasoning_tool": false,
39+
"enable_guided_tools": false,
40+
"enable_skills": false,
41+
"kb_results": 4,
42+
"can_stop_itself": false,
43+
"system_prompt": "Current date: {{ now | date \"Mon, 02 Jan 2006 15:04:05 MST\" }}",
44+
"skills_prompt": "",
45+
"inner_monologue_template": "Current date: {{ now | date \"Mon, 02 Jan 2006 15:04:05 MST\" }}",
46+
"long_term_memory": false,
47+
"summary_long_term_memory": false,
48+
"conversation_storage_mode": "",
49+
"parallel_jobs": 1,
50+
"cancel_previous_on_new_message": true,
51+
"strip_thinking_tags": true,
52+
"enable_evaluation": false,
53+
"max_evaluation_loops": 374,
54+
"max_attempts": 10,
55+
"loop_detection": 0,
56+
"mcp_stdio_servers": "{\"mcpServers\":{\"bash\":{\"command\":\"docker\",\"args\":[\"run\",\"-i\",\"--rm\",\"-e\",\"SHELL_WORKING_DIR\",\"-e\",\"SHELL_CMD\",\"-v\",\"/data/workspace:/root\",\"-e\",\"TOOL_NAME\",\"-e\",\"SHELL_INIT_SCRIPT\",\"-e\",\"DOCKER_HOST\",\"ghcr.io/mudler/mcps/shell:master\"],\"env\":{\"DOCKER_HOST\":\"tcp://172.17.0.1:2375\",\"SHELL_CMD\":\"sh\",\"SHELL_INIT_SCRIPT\":\"apt-get update \\u0026\\u0026 apt-get install -y docker.io bash \\u0026\\u0026 curl -sL \"https://go.dev/dl/$(curl -s https://go.dev/VERSION?m=text | head -1).linux-amd64.tar.gz\" | tar -C /usr/lib -xzf - \\u0026\\u0026 ln -s /usr/lib/go/bin/go /usr/bin/go \\u0026\\u0026 ln -s /usr/lib/go/bin/gofmt /usr/bin/gofmt\",\"SHELL_WORKING_DIR\":\"/root\",\"TOOL_NAME\":\"bash\"}}}}"
57+
}

‎css/styles.css‎

Lines changed: 285 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,285 @@
1+
:root {
2+
--primary-color: #2563eb;
3+
--primary-hover: #1d4ed8;
4+
--background: #f8fafc;
5+
--card-bg: #ffffff;
6+
--text-primary: #1e293b;
7+
--text-secondary: #64748b;
8+
--border-color: #e2e8f0;
9+
--shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
10+
--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
11+
}
12+
13+
* {
14+
margin: 0;
15+
padding: 0;
16+
box-sizing: border-box;
17+
}
18+
19+
body {
20+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
21+
background: var(--background);
22+
color: var(--text-primary);
23+
line-height: 1.6;
24+
}
25+
26+
.container {
27+
max-width: 1200px;
28+
margin: 0 auto;
29+
padding: 0 1rem;
30+
}
31+
32+
header {
33+
background: linear-gradient(135deg, var(--primary-color), #7c3aed);
34+
color: white;
35+
padding: 3rem 0;
36+
text-align: center;
37+
}
38+
39+
header h1 {
40+
font-size: 2.5rem;
41+
margin-bottom: 0.5rem;
42+
}
43+
44+
header p {
45+
font-size: 1.1rem;
46+
opacity: 0.9;
47+
}
48+
49+
main {
50+
padding: 2rem 0;
51+
min-height: 60vh;
52+
}
53+
54+
.search-section {
55+
margin-bottom: 2rem;
56+
display: flex;
57+
justify-content: space-between;
58+
align-items: center;
59+
gap: 1rem;
60+
flex-wrap: wrap;
61+
}
62+
63+
#searchInput {
64+
flex: 1;
65+
min-width: 280px;
66+
padding: 0.75rem 1rem;
67+
font-size: 1rem;
68+
border: 2px solid var(--border-color);
69+
border-radius: 8px;
70+
transition: border-color 0.2s, box-shadow 0.2s;
71+
}
72+
73+
#searchInput:focus {
74+
outline: none;
75+
border-color: var(--primary-color);
76+
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
77+
}
78+
79+
.stats {
80+
color: var(--text-secondary);
81+
font-weight: 500;
82+
white-space: nowrap;
83+
}
84+
85+
.agents-grid {
86+
display: grid;
87+
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
88+
gap: 1.5rem;
89+
}
90+
91+
.agent-card {
92+
background: var(--card-bg);
93+
border-radius: 12px;
94+
padding: 1.5rem;
95+
box-shadow: var(--shadow);
96+
border: 1px solid var(--border-color);
97+
transition: transform 0.2s, box-shadow 0.2s;
98+
cursor: pointer;
99+
}
100+
101+
.agent-card:hover {
102+
transform: translateY(-4px);
103+
box-shadow: var(--shadow-lg);
104+
}
105+
106+
.agent-card h3 {
107+
font-size: 1.25rem;
108+
margin-bottom: 0.5rem;
109+
color: var(--text-primary);
110+
}
111+
112+
.agent-card .model {
113+
display: inline-block;
114+
background: #dbeafe;
115+
color: #1e40af;
116+
padding: 0.25rem 0.75rem;
117+
border-radius: 9999px;
118+
font-size: 0.75rem;
119+
font-weight: 600;
120+
margin-bottom: 0.75rem;
121+
}
122+
123+
.agent-card .description {
124+
color: var(--text-secondary);
125+
font-size: 0.9rem;
126+
margin-bottom: 1rem;
127+
display: -webkit-box;
128+
-webkit-line-clamp: 3;
129+
-webkit-box-orient: vertical;
130+
overflow: hidden;
131+
}
132+
133+
.agent-card .details {
134+
display: flex;
135+
flex-wrap: wrap;
136+
gap: 0.5rem;
137+
font-size: 0.8rem;
138+
color: var(--text-secondary);
139+
}
140+
141+
.agent-card .detail-item {
142+
display: flex;
143+
align-items: center;
144+
gap: 0.25rem;
145+
}
146+
147+
.no-results {
148+
text-align: center;
149+
padding: 3rem;
150+
color: var(--text-secondary);
151+
}
152+
153+
footer {
154+
background: var(--card-bg);
155+
border-top: 1px solid var(--border-color);
156+
padding: 2rem 0;
157+
text-align: center;
158+
color: var(--text-secondary);
159+
}
160+
161+
/* Modal */
162+
.modal {
163+
display: none;
164+
position: fixed;
165+
z-index: 100;
166+
left: 0;
167+
top: 0;
168+
width: 100%;
169+
height: 100%;
170+
background-color: rgba(0, 0, 0, 0.5);
171+
overflow-y: auto;
172+
}
173+
174+
.modal.active {
175+
display: flex;
176+
align-items: center;
177+
justify-content: center;
178+
padding: 1rem;
179+
}
180+
181+
.modal-content {
182+
background: var(--card-bg);
183+
border-radius: 12px;
184+
padding: 2rem;
185+
max-width: 800px;
186+
width: 100%;
187+
max-height: 90vh;
188+
overflow-y: auto;
189+
position: relative;
190+
box-shadow: var(--shadow-lg);
191+
}
192+
193+
.close-modal {
194+
position: absolute;
195+
top: 1rem;
196+
right: 1.5rem;
197+
font-size: 1.5rem;
198+
font-weight: bold;
199+
color: var(--text-secondary);
200+
cursor: pointer;
201+
line-height: 1;
202+
}
203+
204+
.close-modal:hover {
205+
color: var(--text-primary);
206+
}
207+
208+
.modal-content h2 {
209+
margin-bottom: 1.5rem;
210+
color: var(--text-primary);
211+
}
212+
213+
#modalBody {
214+
margin-bottom: 1.5rem;
215+
}
216+
217+
#modalBody pre {
218+
background: #1e293b;
219+
color: #e2e8f0;
220+
padding: 1rem;
221+
border-radius: 8px;
222+
overflow-x: auto;
223+
font-size: 0.85rem;
224+
line-height: 1.5;
225+
max-height: 400px;
226+
overflow-y: auto;
227+
}
228+
229+
.download-btn {
230+
background: var(--primary-color);
231+
color: white;
232+
border: none;
233+
padding: 0.75rem 1.5rem;
234+
font-size: 1rem;
235+
border-radius: 8px;
236+
cursor: pointer;
237+
transition: background-color 0.2s;
238+
font-weight: 500;
239+
}
240+
241+
.download-btn:hover {
242+
background: var(--primary-hover);
243+
}
244+
245+
@media (max-width: 640px) {
246+
header h1 {
247+
font-size: 2rem;
248+
}
249+
250+
.agents-grid {
251+
grid-template-columns: 1fr;
252+
}
253+
254+
.search-section {
255+
flex-direction: column;
256+
}
257+
258+
#searchInput {
259+
width: 100%;
260+
}
261+
}
262+
263+
/* Summary table in modal */
264+
.summary-table {
265+
width: 100%;
266+
border-collapse: collapse;
267+
margin-bottom: 1.5rem;
268+
}
269+
270+
.summary-table tr {
271+
border-bottom: 1px solid var(--border-color);
272+
}
273+
274+
.summary-table td {
275+
padding: 0.5rem 0;
276+
}
277+
278+
.summary-table td:first-child {
279+
width: 40%;
280+
color: var(--text-secondary);
281+
}
282+
283+
.summary-table td:last-child {
284+
color: var(--text-primary);
285+
}

0 commit comments

Comments
 (0)