feat(api): add 404 handling

mudler · Mar 27, 2024 · c28f16b · c28f16b
1 parent 04735b8
commit c28f16b
Show file tree

Hide file tree

Showing 6 changed files with 84 additions and 20 deletions.
diff --git a/core/http/api.go b/core/http/api.go
@@ -299,5 +299,21 @@ func App(cl *config.BackendConfigLoader, ml *model.ModelLoader, appConfig *confi
 
 	app.Get("/metrics", localai.LocalAIMetricsEndpoint())
 
+	// Define a custom 404 handler
+	app.Use(func(c *fiber.Ctx) error {
+
+		// Check if the request accepts JSON
+		if string(c.Context().Request.Header.ContentType()) == "application/json" || len(c.Accepts("html")) == 0 {
+			// The client expects a JSON response
+			c.Status(fiber.StatusNotFound).JSON(fiber.Map{
+				"error": "Resource not found",
+			})
+		} else {
+			// The client expects an HTML response
+			c.Status(fiber.StatusNotFound).Render("views/404", fiber.Map{})
+		}
+		return nil
+	})
+
 	return app, nil
 }
diff --git a/core/http/views/404.html b/core/http/views/404.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en">
+
+{{template "views/partials/head" .}}
+
+<body class="bg-black text-white">
+<div class="flex flex-col min-h-screen">
+
+    {{template "views/partials/navbar" .}}
+
+    <div class="container mx-auto px-4 flex-grow">
+        <div class="header text-center py-12">
+            <h1 class="text-5xl font-bold">Welcome to your LocalAI instance!</h1>
+            <div class="mt-6">
+         <!--       <a href="/" aria-label="HomePage" alt="HomePage">           
+                    <img class="mx-auto w-1/4 h-auto" src="https://github.com/go-skynet/LocalAI/assets/2420543/0966aa2a-166e-4f99-a3e5-6c915fc997dd" alt="LocalAI Logo">            
+                </a>
+            -->
+            </div>
+            <p class="mt-4 text-lg">The FOSS alternative to OpenAI, Claude, ...</p>
+            <a href="https://localai.io" target="_blank" class="mt-4 inline-block bg-blue-500 text-white py-2 px-4 rounded transition duration-300 ease-in-out hover:bg-blue-700"><i class="fas fa-book-reader pr-2"></i>Documentation</a>
+        </div>
+
+        <div class="models mt-12">
+            <h2 class="text-center text-3xl font-semibold">Nothing found!</h2>
+        </div>
+    </div>
+
+    {{template "views/partials/footer" .}}
+</div>
+
+</body>
+</html>
diff --git a/core/http/views/index.html b/core/http/views/index.html
@@ -17,21 +17,7 @@
 
 <div class="flex flex-col min-h-screen">
 
-    <nav class="bg-gray-800 shadow-lg">
-        <div class="container mx-auto px-4 py-4">
-            <div class="flex items-center justify-between">
-                <div class="flex items-center">
-                    <!-- Logo Image: Replace 'logo_url_here' with your actual logo URL -->
-                    <a href="/" class="text-white text-xl font-bold"><img src="https://github.com/go-skynet/LocalAI/assets/2420543/0966aa2a-166e-4f99-a3e5-6c915fc997dd" alt="LocalAI Logo" class="h-10 mr-3 border-2 border-gray-300 shadow rounded"></a>
-                    <a href="/" class="text-white text-xl font-bold">LocalAI</a>
-                </div>
-                <div>
-                    <a href="/" class="text-gray-400 hover:text-white px-3 py-2 rounded"><i class="fas fa-home pr-2"></i>Home</a>
-                    <a href="https://localai.io" class="text-gray-400 hover:text-white px-3 py-2 rounded" target="_blank" class="fas fa-book-reader pr-2"></i> Documentation</a>
-                </div>
-            </div>
-        </div>
-    </nav>
+    {{template "views/partials/navbar" .}}
 
     <div class="container mx-auto px-4 flex-grow">
         <div class="header text-center py-12">
@@ -64,11 +50,8 @@ <h2 class="text-center text-3xl font-semibold">Installed models</h2>
             </ul>
         </div>
     </div>
-
-    <footer class="text-center py-8">
-        LocalAI Version {{.Version}}<br>
-        <a href='https://localai.io' class="text-blue-400 hover:text-blue-600" target="_blank">LocalAI</a> © 2023-2024 <a href='https://mudler.pm' class="text-blue-400 hover:text-blue-600" target="_blank">Ettore Di Giacinto</a>
-    </footer>
+
+    {{template "views/partials/footer" .}}
 </div>
 
 </body>

diff --git a/core/http/views/partials/footer.html b/core/http/views/partials/footer.html
@@ -0,0 +1,4 @@
+<footer class="text-center py-8">
+    LocalAI Version {{.Version}}<br>
+    <a href='https://localai.io' class="text-blue-400 hover:text-blue-600" target="_blank">LocalAI</a> © 2023-2024 <a href='https://mudler.pm' class="text-blue-400 hover:text-blue-600" target="_blank">Ettore Di Giacinto</a>
+</footer>
diff --git a/core/http/views/partials/head.html b/core/http/views/partials/head.html
@@ -0,0 +1,13 @@
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{{.Title}}</title>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Roboto:wght@400;500&display=swap" rel="stylesheet">
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">
+    <style>
+        body {
+            font-family: 'Inter', sans-serif;
+        }
+    </style>
+</head>
diff --git a/core/http/views/partials/navbar.html b/core/http/views/partials/navbar.html
@@ -0,0 +1,15 @@
+<nav class="bg-gray-800 shadow-lg">
+    <div class="container mx-auto px-4 py-4">
+        <div class="flex items-center justify-between">
+            <div class="flex items-center">
+                <!-- Logo Image: Replace 'logo_url_here' with your actual logo URL -->
+                <a href="/" class="text-white text-xl font-bold"><img src="https://github.com/go-skynet/LocalAI/assets/2420543/0966aa2a-166e-4f99-a3e5-6c915fc997dd" alt="LocalAI Logo" class="h-10 mr-3 border-2 border-gray-300 shadow rounded"></a>
+                <a href="/" class="text-white text-xl font-bold">LocalAI</a>
+            </div>
+            <div>
+                <a href="/" class="text-gray-400 hover:text-white px-3 py-2 rounded"><i class="fas fa-home pr-2"></i>Home</a>
+                <a href="https://localai.io" class="text-gray-400 hover:text-white px-3 py-2 rounded" target="_blank" class="fas fa-book-reader pr-2"></i> Documentation</a>
+            </div>
+        </div>
+    </div>
+</nav>