alex/LocalAGI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Small ux enhancements

Browse Source
This commit is contained in:
Ettore Di Giacinto
2024-04-12 00:23:55 +02:00
parent adf649be99
commit 82f1b37ae8
4 changed files with 19 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
example/webui/routes.go
View File

@@ -40,7 +40,6 @@ func RegisterRoutes(webapp *fiber.App, pool *AgentPool, db *InMemoryDatabase, ap
// Define a route for the GET method on the root path '/' // Define a route for the GET method on the root path '/'
webapp.Get("/sse/:name", func(c *fiber.Ctx) error { webapp.Get("/sse/:name", func(c *fiber.Ctx) error {
m := pool.GetManager(c.Params("name")) m := pool.GetManager(c.Params("name"))
if m == nil { if m == nil {
return c.SendStatus(404) return c.SendStatus(404)

20
example/webui/views/agents.html
View File

@@ -5,6 +5,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Agent List</title> <title>Agent List</title>
{{template "views/partials/header"}} {{template "views/partials/header"}}
<style>
.button-container {
display: flex;
justify-content: flex-end;
margin-bottom: 8px; /* Adjusts the spacing to your liking */
}
</style>
</head> </head>
<body class="bg-gray-900 p-4 text-white font-sans"> <body class="bg-gray-900 p-4 text-white font-sans">
{{template "views/partials/menu"}} {{template "views/partials/menu"}}
@@ -12,6 +19,11 @@
<header class="text-center mb-8"> <header class="text-center mb-8">
<h1 class="text-3xl md:text-5xl font-bold">Smart Agent List</h1> <h1 class="text-3xl md:text-5xl font-bold">Smart Agent List</h1>
</header> </header>
<div class="button-container">
<a href="/create" class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded transition duration-300 ease-in-out">
Add New Agent
</a>
</div>
<section class="flex flex-col"> <section class="flex flex-col">
<div class="overflow-x-auto"> <div class="overflow-x-auto">
<div class="py-2 align-middle inline-block min-w-full"> <div class="py-2 align-middle inline-block min-w-full">
@@ -36,9 +48,9 @@
<tbody class="bg-gray-800 divide-y divide-gray-700"> <tbody class="bg-gray-800 divide-y divide-gray-700">
<!-- Dynamic agent rows go here --> <!-- Dynamic agent rows go here -->
{{ range .Agents }} {{ range .Agents }}
<tr> <tr hx-ext="sse" sse-connect="/sse/{{.}}">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-300">{{.}}</td> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-300">{{.}}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">{{.}}</td> <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300"><div sse-swap="status" ></div></td>
<td class="px-6 py-4 whitespace-nowrap text-center text-sm font-medium"> <td class="px-6 py-4 whitespace-nowrap text-center text-sm font-medium">
<a href="/talk/{{.}}" class="text-indigo-500 hover:text-indigo-400"> <a href="/talk/{{.}}" class="text-indigo-500 hover:text-indigo-400">
<i class="fas fa-comments"></i> Talk <i class="fas fa-comments"></i> Talk
@@ -58,9 +70,7 @@
</div> </div>
</section> </section>
<footer class="mt-8 text-center"> <footer class="mt-8 text-center">
<a href="/create" class="bg-indigo-500 hover:bg-indigo-700 text-white font-bold py-2 px-4 rounded transition duration-300 ease-in-out"> <!-- Moved the button up for alignment with the table -->
Add New Agent
</a>
</footer> </footer>
</div> </div>
</body> </body>

6
example/webui/views/chat.html
View File

@@ -3,13 +3,9 @@
<head> <head>
<title>Smart Agent Interface</title> <title>Smart Agent Interface</title>
{{template "views/partials/header"}} {{template "views/partials/header"}}
<!-- Optional: Include HTMX and SSE Extension for dynamic updates -->
<script src="https://unpkg.com/htmx.org"></script>
<script src="https://unpkg.com/htmx.org/dist/ext/sse.js"></script>
<script src="https://unpkg.com/hyperscript.org@0.9.12"></script>
<style> <style>
body { overflow: hidden; } body { overflow: hidden; }
.chat-container { height: 100vh; display: flex; flex-direction: column; } .chat-container { height: 90vh; display: flex; flex-direction: column; }
.chat-messages { overflow-y: auto; flex-grow: 1; } .chat-messages { overflow-y: auto; flex-grow: 1; }
.htmx-indicator{ .htmx-indicator{
opacity:0; opacity:0;

3
example/webui/views/partials/header.html
View File

@@ -3,6 +3,9 @@
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<script src="https://unpkg.com/htmx.org"></script>
<script src="https://unpkg.com/htmx.org/dist/ext/sse.js"></script>
<script src="https://unpkg.com/hyperscript.org@0.9.12"></script>
<style> <style>
body { body {
font-family: 'Roboto', sans-serif; font-family: 'Roboto', sans-serif;