wip: UI

2024-04-08 00:35:14 +02:00
parent dbfc596333
commit 7adcce78be
8 changed files with 262 additions and 172 deletions
--- a/example/webui/agentpool.go
+++ b/example/webui/agentpool.go
@@ -4,8 +4,11 @@ import (
 	"encoding/json"
 	"fmt"
 	"os"
+	"path/filepath"
+	"time"

 	. "github.com/mudler/local-agent-framework/agent"
+	"github.com/mudler/local-agent-framework/external"
 )

 type ConnectorConfig struct {
@@ -16,13 +19,11 @@ type ConnectorConfig struct {
 type ActionsConfig string

 type AgentConfig struct {
-	Connector     []ConnectorConfig `json:"connector"`
-	Actions       []ActionsConfig   `json:"actions"`
-	StateFile     string            `json:"state_file"`
-	CharacterFile string            `json:"character_file"`
+	Connector []ConnectorConfig `json:"connector"`
+	Actions   []ActionsConfig   `json:"actions"`
 	// This is what needs to be part of ActionsConfig
-	APIURL           string `json:"api_url"`
 	Model            string `json:"model"`
+	Name             string `json:"name"`
 	HUD              bool   `json:"hud"`
 	Debug            bool   `json:"debug"`
 	StandaloneJob    bool   `json:"standalone_job"`
@@ -32,35 +33,47 @@ type AgentConfig struct {
 }

 type AgentPool struct {
-	file     string
-	pool     AgentPoolData
-	agents   map[string]*Agent
-	managers map[string]Manager
+	file          string
+	pooldir       string
+	pool          AgentPoolData
+	agents        map[string]*Agent
+	managers      map[string]Manager
+	apiURL, model string
 }

 type AgentPoolData map[string]AgentConfig

-func NewAgentPool(file string) (*AgentPool, error) {
+func NewAgentPool(model, apiURL, directory string) (*AgentPool, error) {
 	// if file exists, try to load an existing pool.
 	// if file does not exist, create a new pool.

-	if _, err := os.Stat(file); err != nil {
+	poolfile := filepath.Join(directory, "pool.json")
+
+	if _, err := os.Stat(poolfile); err != nil {
 		// file does not exist, create a new pool
 		return &AgentPool{
-			file:   file,
-			agents: make(map[string]*Agent),
-			pool:   make(map[string]AgentConfig),
+			file:     poolfile,
+			pooldir:  directory,
+			apiURL:   apiURL,
+			model:    model,
+			agents:   make(map[string]*Agent),
+			pool:     make(map[string]AgentConfig),
+			managers: make(map[string]Manager),
 		}, nil
 	}

-	poolData, err := loadPoolFromFile(file)
+	poolData, err := loadPoolFromFile(poolfile)
 	if err != nil {
 		return nil, err
 	}
 	return &AgentPool{
-		file:   file,
-		agents: make(map[string]*Agent),
-		pool:   *poolData,
+		file:     poolfile,
+		apiURL:   apiURL,
+		pooldir:  directory,
+		model:    model,
+		agents:   make(map[string]*Agent),
+		managers: make(map[string]Manager),
+		pool:     *poolData,
 	}, nil
 }

@@ -91,16 +104,48 @@ func (a *AgentPool) List() []string {
 	return agents
 }

+func (a *AgentConfig) availableActions() []Action {
+	actions := []Action{}
+	if len(a.Actions) == 0 {
+		// Return search as default
+		return []Action{external.NewSearch(3)}
+	}
+	for _, action := range a.Actions {
+		switch action {
+		case "search":
+			actions = append(actions, external.NewSearch(3))
+		}
+	}
+
+	return actions
+}
+
 func (a *AgentPool) startAgentWithConfig(name string, config *AgentConfig) error {
 	manager := NewManager(5)
+	model := a.model
+	if config.Model != "" {
+		model = config.Model
+	}
+	if config.PeriodicRuns == "" {
+		config.PeriodicRuns = "10m"
+	}
+	fmt.Println("Creating agent", name)
+	fmt.Println("Model", model)
+	fmt.Println("API URL", a.apiURL)
+
+	actions := config.availableActions()
 	opts := []Option{
-		WithModel(config.Model),
-		WithLLMAPIURL(config.APIURL),
+		WithModel(model),
+		WithLLMAPIURL(a.apiURL),
 		WithPeriodicRuns(config.PeriodicRuns),
-		WithStateFile(config.StateFile),
-		WithCharacterFile(config.StateFile),
+		WithActions(
+			actions...,
+		),
+		WithStateFile(filepath.Join(a.pooldir, fmt.Sprintf("%s.state.json", name))),
+		WithCharacterFile(filepath.Join(a.pooldir, fmt.Sprintf("%s.character.json", name))),
 		WithAgentReasoningCallback(func(state ActionCurrentState) bool {
-			sseManager.Send(
+			fmt.Println("Reasoning", state.Reasoning)
+			manager.Send(
 				NewMessage(
 					fmt.Sprintf(`Thinking: %s`, htmlIfy(state.Reasoning)),
 				).WithEvent("status"),
@@ -108,6 +153,8 @@ func (a *AgentPool) startAgentWithConfig(name string, config *AgentConfig) error
 			return true
 		}),
 		WithAgentResultCallback(func(state ActionState) {
+			fmt.Println("Reasoning", state.Reasoning)
+
 			text := fmt.Sprintf(`Reasoning: %s
 			Action taken: %+v
 			Parameters: %+v
@@ -116,7 +163,7 @@ func (a *AgentPool) startAgentWithConfig(name string, config *AgentConfig) error
 				state.ActionCurrentState.Action.Definition().Name,
 				state.ActionCurrentState.Params,
 				state.Result)
-			sseManager.Send(
+			manager.Send(
 				NewMessage(
 					htmlIfy(
 						text,
@@ -141,6 +188,9 @@ func (a *AgentPool) startAgentWithConfig(name string, config *AgentConfig) error
 			opts = append(opts, WithRandomIdentity())
 		}
 	}
+
+	fmt.Println("Starting agent", name)
+	fmt.Printf("Config %+v\n", config)
 	agent, err := New(opts...)
 	if err != nil {
 		return err
@@ -155,6 +205,15 @@ func (a *AgentPool) startAgentWithConfig(name string, config *AgentConfig) error
 		}
 	}()

+	go func() {
+		for {
+			time.Sleep(1 * time.Second) // Send a message every seconds
+			manager.Send(NewMessage(
+				htmlIfy(agent.State().String()),
+			).WithEvent("hud"))
+		}
+	}()
+
 	return nil
 }

--- a/example/webui/chat.html
+++ b/example/webui/chat.html
@@ -42,11 +42,11 @@
        }
    </style>
 </head>
-<body class="bg-gray-900 p-4 text-white" hx-ext="sse" sse-connect="/sse">
+<body class="bg-gray-900 p-4 text-white" hx-ext="sse" sse-connect="/sse/{{.Name}}">
 <div class="chat-container bg-gray-800 shadow-lg rounded-lg" >
    <!-- Chat Header -->
    <div class="border-b border-gray-700 p-4">
-        <h1 class="text-lg font-semibold">Talk to '{{.Character.Name}}'</h1>
+        <h1 class="text-lg font-semibold">Talk to '{{.Name}}'</h1>
    </div>
    
    <!-- Chat Messages -->
@@ -82,7 +82,7 @@
    <!-- Message Input -->
    <div class="p-4 border-t border-gray-700">
        <div sse-swap="message_status"></div>
-        <input id="inputMessage" name="message" type="text" hx-post="/chat"  hx-target="#results" hx-indicator=".htmx-indicator"
+        <input id="inputMessage" name="message" type="text" hx-post="/chat/{{.Name}}"  hx-target="#results" hx-indicator=".htmx-indicator"
        class="p-2 border rounded w-full bg-gray-600 text-white placeholder-gray-300" placeholder="Type a message..." _="on htmx:afterRequest set my value to ''">
        <div class="my-2 htmx-indicator" ></div>
        <div id="results" class="flex justify-center"></div>
--- a/example/webui/create.html
+++ b/example/webui/create.html
@@ -8,18 +8,44 @@
 <body class="bg-gray-900 p-4 text-white">
 <div class="max-w-md mx-auto mt-10">
    <h1 class="text-2xl font-bold text-center mb-6">Create New Agent</h1>
-    <form action="/path/to/your/form/handler" method="POST">
+    <form action="/create" method="POST">
        <div class="mb-4">
-            <label for="agentName" class="block text-sm font-medium text-gray-400">Agent Name</label>
-            <input type="text" name="agentName" id="agentName" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md bg-gray-700 text-white" placeholder="Agent Name">
+            <label for="connector" class="block text-sm font-medium text-gray-400">Connector Config (JSON)</label>
+            <textarea id="connector" name="connector" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md bg-gray-700 text-white" placeholder='[{"...":"..."}]'></textarea>
        </div>
        <div class="mb-4">
-            <label for="agentType" class="block text-sm font-medium text-gray-400">Agent Type</label>
-            <select id="agentType" name="agentType" class="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md bg-gray-700 text-white">
-                <option>General</option>
-                <option>Support</option>
-                <option>Sales</option>
-            </select>
+            <label for="actions" class="block text-sm font-medium text-gray-400">Actions Config (JSON)</label>
+            <textarea id="actions" name="actions" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md bg-gray-700 text-white" placeholder='[{"...":"..."}]'></textarea>
+        </div>
+        <!-- Adding fields for properties in ActionsConfig -->
+ 
+        <div class="mb-4">
+            <label for="name" class="block text-sm font-medium text-gray-400">Name</label>
+            <input type="text" name="name" id="name" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md bg-gray-700 text-white" placeholder="Name">
+        </div>
+        <div class="mb-4">
+            <label for="hud" class="block text-sm font-medium text-gray-400">HUD</label>
+            <input type="checkbox" name="hud" id="hud" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block shadow-sm sm:text-sm border-gray-300 rounded bg-gray-700">
+        </div>
+        <div class="mb-4">
+            <label for="debug" class="block text-sm font-medium text-gray-400">Debug</label>
+            <input type="checkbox" name="debug" id="debug" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block shadow-sm sm:text-sm border-gray-300 rounded bg-gray-700">
+        </div>
+        <div class="mb-4">
+            <label for="standalone_job" class="block text-sm font-medium text-gray-400">Standalone Job</label>
+            <input type="checkbox" name="standalone_job" id="standalone_job" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block shadow-sm sm:text-sm border-gray-300 rounded bg-gray-700">
+        </div>
+        <div class="mb-4">
+            <label for="random_identity" class="block text-sm font-medium text-gray-400">Random Identity</label>
+            <input type="checkbox" name="random_identity" id="random_identity" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block shadow-sm sm:text-sm border-gray-300 rounded bg-gray-700">
+        </div>
+        <div class="mb-4">
+            <label for="identity_guidance" class="block text-sm font-medium text-gray-400">Identity Guidance</label>
+            <input type="text" name="identity_guidance" id="identity_guidance" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md bg-gray-700 text-white" placeholder="Identity Guidance">
+        </div>
+        <div class="mb-4">
+            <label for="periodic_runs" class="block text-sm font-medium text-gray-400">Periodic Runs</label>
+            <input type="text" name="periodic_runs" id="periodic_runs" class="mt-1 focus:ring-blue-500 focus:border-blue-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md bg-gray-700 text-white" placeholder="Periodic Runs">
        </div>
        <div class="flex items-center justify-between">
            <button type="submit" class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-500 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
--- a/example/webui/index.html
+++ b/example/webui/index.html
@@ -30,13 +30,15 @@
                        </thead>
                        <tbody class="bg-gray-800 divide-y divide-gray-700">
                        <!-- Dynamic agent rows go here -->
+                        {{ range .Agents }}
                        <tr>
-                            <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-300">Agent 1</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">Online</td>
                            <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
-                                <a href="#" class="text-blue-500 hover:text-blue-400">Edit</a>
+                                <a href="/talk/{{.}}" class="text-blue-500 hover:text-blue-400">Talk</a>
                            </td>
                        </tr>
+                        {{ end }}
                        <!-- Repeat for each agent -->
                        </tbody>
                    </table>
@@ -45,7 +47,7 @@
        </div>
    </div>
    <div class="mt-6">
-        <a href="create_agent.html" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
+        <a href="/create" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
            Add New Agent
        </a>
    </div>
--- a/example/webui/main.go
+++ b/example/webui/main.go
@@ -2,19 +2,14 @@ package main

 import (
 	"fmt"
-	"html/template"
 	"log"
 	"math/rand"
 	"net/http"
 	"os"
 	"strings"
-	"time"

 	"github.com/donseba/go-htmx"
-	"github.com/donseba/go-htmx/sse"
-	fiber "github.com/gofiber/fiber/v3"
-	external "github.com/mudler/local-agent-framework/external"
-	"github.com/valyala/fasthttp/fasthttpadaptor"
+	fiber "github.com/gofiber/fiber/v2"

 	. "github.com/mudler/local-agent-framework/agent"
 )
@@ -22,21 +17,19 @@ import (
 type (
 	App struct {
 		htmx *htmx.HTMX
+		pool *AgentPool
 	}
 )

-var (
-	sseManager Manager
-)
 var testModel = os.Getenv("TEST_MODEL")
-var apiModel = os.Getenv("API_MODEL")
+var apiURL = os.Getenv("API_URL")

 func init() {
 	if testModel == "" {
 		testModel = "hermes-2-pro-mistral"
 	}
-	if apiModel == "" {
-		apiModel = "http://192.168.68.113:8080"
+	if apiURL == "" {
+		apiURL = "http://192.168.68.113:8080"
 	}
 }

@@ -46,79 +39,40 @@ func htmlIfy(s string) string {
 	return s
 }

-var agentInstance *Agent
-
 func main() {
-	app := &App{
-		htmx: htmx.New(),
-	}
-
-	agent, err := New(
-		WithLLMAPIURL(apiModel),
-		WithModel(testModel),
-		EnableHUD,
-		DebugMode,
-		EnableStandaloneJob,
-		WithAgentReasoningCallback(func(state ActionCurrentState) bool {
-			sseManager.Send(
-				sse.NewMessage(
-					fmt.Sprintf(`Thinking: %s`, htmlIfy(state.Reasoning)),
-				).WithEvent("status"),
-			)
-			return true
-		}),
-		WithActions(external.NewSearch(3)),
-		WithAgentResultCallback(func(state ActionState) {
-			text := fmt.Sprintf(`Reasoning: %s
-			Action taken: %+v
-			Parameters: %+v
-			Result: %s`,
-				state.Reasoning,
-				state.ActionCurrentState.Action.Definition().Name,
-				state.ActionCurrentState.Params,
-				state.Result)
-			sseManager.Send(
-				sse.NewMessage(
-					htmlIfy(
-						text,
-					),
-				).WithEvent("status"),
-			)
-		}),
-		WithRandomIdentity(),
-		WithPeriodicRuns("10m"),
-		//WithPermanentGoal("get the weather of all the cities in italy and store the results"),
-	)
+	// current dir
+	cwd, err := os.Getwd()
 	if err != nil {
 		panic(err)
 	}
-	go agent.Run()
-	defer agent.Stop()
+	os.MkdirAll(cwd+"/pool", 0755)

-	agentInstance = agent
-	sseManager = NewManager(5)
+	pool, err := NewAgentPool(testModel, apiURL, cwd+"/pool")
+	if err != nil {
+		panic(err)

-	go func() {
-		for {
-			clientsStr := ""
-			clients := sseManager.Clients()
-			for _, c := range clients {
-				clientsStr += c + ", "
-			}
+	}
+	app := &App{
+		htmx: htmx.New(),
+		pool: pool,
+	}

-			time.Sleep(1 * time.Second) // Send a message every seconds
-			sseManager.Send(NewMessage(fmt.Sprintf("connected clients: %v", clientsStr)).WithEvent("clients"))
-		}
-	}()
+	if err := pool.StartAll(); err != nil {
+		panic(err)
+	}

-	go func() {
-		for {
-			time.Sleep(1 * time.Second) // Send a message every seconds
-			sseManager.Send(NewMessage(
-				htmlIfy(agent.State().String()),
-			).WithEvent("hud"))
-		}
-	}()
+	// go func() {
+	// 	for {
+	// 		clientsStr := ""
+	// 		clients := sseManager.Clients()
+	// 		for _, c := range clients {
+	// 			clientsStr += c + ", "
+	// 		}
+
+	// 		time.Sleep(1 * time.Second) // Send a message every seconds
+	// 		sseManager.Send(NewMessage(fmt.Sprintf("connected clients: %v", clientsStr)).WithEvent("clients"))
+	// 	}
+	// }()

 	// Initialize a new Fiber app
 	webapp := fiber.New()
@@ -126,26 +80,41 @@ func main() {
 	// Serve static files
 	webapp.Static("/", "./public")

-	webapp.Get("/", func(c fiber.Ctx) error {
+	webapp.Get("/", func(c *fiber.Ctx) error {
 		return c.Render("index.html", fiber.Map{
-			"Title": "Hello, World!",
+			"Agents": pool.List(),
 		})
 	})

-	webapp.Get("/create", func(c fiber.Ctx) error {
+	webapp.Get("/create", func(c *fiber.Ctx) error {
 		return c.Render("create.html", fiber.Map{
 			"Title": "Hello, World!",
 		})
 	})

 	// Define a route for the GET method on the root path '/'
-	webapp.Get("/sse", func(c fiber.Ctx) error {
-		sseManager.Handle(c, NewClient(randStringRunes(10)))
+	webapp.Get("/sse/:name", func(c *fiber.Ctx) error {
+
+		m := pool.GetManager(c.Params("name"))
+		if m == nil {
+			return c.SendStatus(404)
+		}
+
+		m.Handle(c, NewClient(randStringRunes(10)))
 		return nil
 	})
-	webapp.Get("/notify", wrapHandler(http.HandlerFunc(app.Notify)))
-	webapp.Post("/chat", wrapHandler(http.HandlerFunc(app.Chat(sseManager))))
-	webapp.Get("/talk", wrapHandler(http.HandlerFunc(app.Home(agent))))
+
+	webapp.Get("/notify/:name", app.Notify(pool))
+	webapp.Post("/chat/:name", app.Chat(pool))
+	webapp.Post("/create", app.Create(pool))
+
+	webapp.Get("/talk/:name", func(c *fiber.Ctx) error {
+		return c.Render("chat.html", fiber.Map{
+			//	"Character": agent.Character,
+			"Name": c.Params("name"),
+		})
+	})
+
 	log.Fatal(webapp.Listen(":3000"))

 	// mux := http.NewServeMux()
@@ -166,71 +135,94 @@ func main() {
 	// log.Fatal(err)
 }

-func (a *App) Home(agent *Agent) func(w http.ResponseWriter, r *http.Request) {
-	return func(w http.ResponseWriter, r *http.Request) {
-		tmpl, err := template.ParseFiles("chat.html")
-		if err != nil {
-			http.Error(w, err.Error(), http.StatusInternalServerError)
-			return
-		}
-
-		tmpl.Execute(w,
-			struct {
-				Character Character
-			}{
-				Character: agent.Character,
-			})
-	}
-}
-
 // func (a *App) SSE(w http.ResponseWriter, r *http.Request) {
 // 	cl := sse.NewClient(randStringRunes(10))
 // 	sseManager.Handle(w, r, cl)
 // }

-func (a *App) Notify(w http.ResponseWriter, r *http.Request) {
-	query := strings.ToLower(r.PostFormValue("message"))
-	if query == "" {
-		_, _ = w.Write([]byte("Please enter a message."))
-		return
-	}
+func (a *App) Notify(pool *AgentPool) func(c *fiber.Ctx) error {
+	return func(c *fiber.Ctx) error {
+		payload := struct {
+			Message string `json:"message"`
+		}{}

-	agentInstance.Ask(
-		WithText(query),
-	)
-	_, _ = w.Write([]byte("Message sent"))
-}
+		if err := c.BodyParser(&payload); err != nil {
+			return err
+		}
+
+		query := payload.Message
+		if query == "" {
+			_, _ = c.Write([]byte("Please enter a message."))
+			return nil
+		}
+
+		agent := pool.GetAgent(c.Params("name"))
+		agent.Ask(
+			WithText(query),
+		)
+		_, _ = c.Write([]byte("Message sent"))

-func wrapHandler(f func(http.ResponseWriter, *http.Request)) func(ctx fiber.Ctx) error {
-	return func(ctx fiber.Ctx) error {
-		fasthttpadaptor.NewFastHTTPHandler(http.HandlerFunc(f))(ctx.Context())
 		return nil
 	}
 }

-func (a *App) Chat(m Manager) func(w http.ResponseWriter, r *http.Request) {
-	return func(w http.ResponseWriter, r *http.Request) {
-		query := strings.ToLower(r.PostFormValue("message"))
-		if query == "" {
-			_, _ = w.Write([]byte("Please enter a message."))
-			return
+func (a *App) Create(pool *AgentPool) func(c *fiber.Ctx) error {
+	return func(c *fiber.Ctx) error {
+		config := AgentConfig{}
+		if err := c.BodyParser(&config); err != nil {
+			return err
 		}
-		m.Send(
+
+		if config.Name == "" {
+			c.Status(http.StatusBadRequest).SendString("Name is required")
+			return nil
+		}
+		if err := pool.CreateAgent(config.Name, &config); err != nil {
+			c.Status(http.StatusInternalServerError).SendString(err.Error())
+			return nil
+		}
+		return c.Redirect("/")
+	}
+}
+
+func (a *App) Chat(pool *AgentPool) func(c *fiber.Ctx) error {
+	return func(c *fiber.Ctx) error {
+		payload := struct {
+			Message string `json:"message"`
+		}{}
+
+		if err := c.BodyParser(&payload); err != nil {
+			return err
+		}
+		agentName := c.Params("name")
+		manager := pool.GetManager(agentName)
+
+		query := payload.Message
+		if query == "" {
+			_, _ = c.Write([]byte("Please enter a message."))
+			return nil
+		}
+		manager.Send(
 			NewMessage(
 				chatDiv(query, "gray"),
 			).WithEvent("messages"))

 		go func() {
-			res := agentInstance.Ask(
+			agent := pool.GetAgent(agentName)
+			if agent == nil {
+				fmt.Println("Agent not found in pool", c.Params("name"))
+				return
+			}
+			res := agent.Ask(
 				WithText(query),
 			)
 			fmt.Println("response is", res.Response)
-			m.Send(
-				sse.NewMessage(
+			manager.Send(
+				NewMessage(
 					chatDiv(res.Response, "blue"),
 				).WithEvent("messages"))
-			m.Send(
-				sse.NewMessage(
+			manager.Send(
+				NewMessage(
 					inputMessageDisabled(false), // show again the input
 				).WithEvent("message_status"))

@@ -238,10 +230,12 @@ func (a *App) Chat(m Manager) func(w http.ResponseWriter, r *http.Request) {
 			//	_, _ = w.Write([]byte(result))
 		}()

-		m.Send(
-			sse.NewMessage(
+		manager.Send(
+			NewMessage(
 				loader() + inputMessageDisabled(true),
 			).WithEvent("message_status"))
+
+		return nil
 	}
 }

--- a/example/webui/sse.go
+++ b/example/webui/sse.go
@@ -7,7 +7,7 @@ import (
 	"sync"
 	"time"

-	"github.com/gofiber/fiber/v3"
+	"github.com/gofiber/fiber/v2"
 	"github.com/valyala/fasthttp"
 )

@@ -26,7 +26,7 @@ type (
 	// Manager defines the interface for managing clients and broadcasting messages.
 	Manager interface {
 		Send(message Envelope)
-		Handle(ctx fiber.Ctx, cl Listener)
+		Handle(ctx *fiber.Ctx, cl Listener)
 		Clients() []string
 	}

@@ -111,7 +111,7 @@ func (manager *broadcastManager) Send(message Envelope) {
 }

 // Handle sets up a new client and handles the connection.
-func (manager *broadcastManager) Handle(c fiber.Ctx, cl Listener) {
+func (manager *broadcastManager) Handle(c *fiber.Ctx, cl Listener) {

 	manager.register(cl)
 	ctx := c.Context()
--- a/go.mod
+++ b/go.mod
@@ -20,6 +20,7 @@ require (
 	github.com/andybalholm/cascadia v1.1.0 // indirect
 	github.com/go-logr/logr v1.3.0 // indirect
 	github.com/go-task/slim-sprig v0.0.0-20230315185526-52ccab3ef572 // indirect
+	github.com/gofiber/fiber/v2 v2.52.4 // indirect
 	github.com/gofiber/utils/v2 v2.0.0-beta.4 // indirect
 	github.com/google/go-cmp v0.6.0 // indirect
 	github.com/google/pprof v0.0.0-20210407192527-94a9f03dee38 // indirect
@@ -27,6 +28,8 @@ require (
 	github.com/klauspost/compress v1.17.7 // indirect
 	github.com/mattn/go-colorable v0.1.13 // indirect
 	github.com/mattn/go-isatty v0.0.20 // indirect
+	github.com/mattn/go-runewidth v0.0.15 // indirect
+	github.com/rivo/uniseg v0.2.0 // indirect
 	github.com/valyala/bytebufferpool v1.0.0 // indirect
 	github.com/valyala/tcplisten v1.0.0 // indirect
 	golang.org/x/net v0.21.0 // indirect
--- a/go.sum
+++ b/go.sum
@@ -16,6 +16,8 @@ github.com/go-logr/logr v1.3.0 h1:2y3SDp0ZXuc6/cjLSZ+Q3ir+QB9T/iG5yYRXqsagWSY=
 github.com/go-logr/logr v1.3.0/go.mod h1:9T104GzyrTigFIr8wt5mBrctHMim0Nb2HLGrmQ40KvY=
 github.com/go-task/slim-sprig v0.0.0-20230315185526-52ccab3ef572 h1:tfuBGBXKqDEevZMzYi5KSi8KkcZtzBcTgAUUtapy0OI=
 github.com/go-task/slim-sprig v0.0.0-20230315185526-52ccab3ef572/go.mod h1:9Pwr4B2jHnOSGXyyzV8ROjYa2ojvAY6HCGYYfMoC3Ls=
+github.com/gofiber/fiber/v2 v2.52.4 h1:P+T+4iK7VaqUsq2PALYEfBBo6bJZ4q3FP8cZ84EggTM=
+github.com/gofiber/fiber/v2 v2.52.4/go.mod h1:KEOE+cXMhXG0zHc9d8+E38hoX+ZN7bhOtgeF2oT6jrQ=
 github.com/gofiber/fiber/v3 v3.0.0-20240405062939-c8c51ee78331 h1:kDxTNPKMIRz8q28+tJHL2p87Cjtmkfn/OsLfastmpaY=
 github.com/gofiber/fiber/v3 v3.0.0-20240405062939-c8c51ee78331/go.mod h1:w7sdfTY0okjZ1oVH6rSOGvuACUIt0By1iK0HKUb3uqM=
 github.com/gofiber/utils/v2 v2.0.0-beta.4 h1:1gjbVFFwVwUb9arPcqiB6iEjHBwo7cHsyS41NeIW3co=
@@ -36,12 +38,16 @@ github.com/mattn/go-colorable v0.1.13/go.mod h1:7S9/ev0klgBDR4GtXTXX8a3vIGJpMovk
 github.com/mattn/go-isatty v0.0.16/go.mod h1:kYGgaQfpe5nmfYZH+SKPsOc2e4SrIfOl2e/yFXSvRLM=
 github.com/mattn/go-isatty v0.0.20 h1:xfD0iDuEKnDkl03q4limB+vH+GxLEtL/jb4xVJSWWEY=
 github.com/mattn/go-isatty v0.0.20/go.mod h1:W+V8PltTTMOvKvAeJH7IuucS94S2C6jfK/D7dTCTo3Y=
+github.com/mattn/go-runewidth v0.0.15 h1:UNAjwbU9l54TA3KzvqLGxwWjHmMgBUVhBiTjelZgg3U=
+github.com/mattn/go-runewidth v0.0.15/go.mod h1:Jdepj2loyihRzMpdS35Xk/zdY8IAYHsh153qUoGf23w=
 github.com/onsi/ginkgo/v2 v2.15.0 h1:79HwNRBAZHOEwrczrgSOPy+eFTTlIGELKy5as+ClttY=
 github.com/onsi/ginkgo/v2 v2.15.0/go.mod h1:HlxMHtYF57y6Dpf+mc5529KKmSq9h2FpCF+/ZkwUxKM=
 github.com/onsi/gomega v1.31.1 h1:KYppCUK+bUgAZwHOu7EXVBKyQA6ILvOESHkn/tgoqvo=
 github.com/onsi/gomega v1.31.1/go.mod h1:y40C95dwAD1Nz36SsEnxvfFe8FFfNxzI5eJ0EYGyAy0=
 github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
 github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
+github.com/rivo/uniseg v0.2.0 h1:S1pD9weZBuJdFmowNwbpi7BJ8TNftyUImj/0WQi72jY=
+github.com/rivo/uniseg v0.2.0/go.mod h1:J6wj4VEh+S6ZtnVlnTBMWIodfgj8LQOQFoIToxlJtxc=
 github.com/sap-nocops/duckduckgogo v0.0.0-20201102135645-176990152850 h1:DsVS3HK/t9X7ereJYMTiOeFSJWLOmrSG74CQhk2SlEs=
 github.com/sap-nocops/duckduckgogo v0.0.0-20201102135645-176990152850/go.mod h1:ur7dCshjxoPKHtsZgtb6n5gpOmzQNRQ5AT+yOLwaJxM=
 github.com/sashabaranov/go-openai v1.18.3 h1:dspFGkmZbhjg1059KhqLYSV2GaCiRIn+bOu50TlXUq8=