feat: add 404 not found page and update catch-all handler

Author: pphatdev

src/client/routes/web.ts

@@ -4,6 +4,7 @@ import { fileURLToPath } from 'url';
 import { DashboardController } from '../controller/dashboard.js';
 import { MyFileController } from '../controller/my-file.js';
 import { StarredController } from '../controller/starred.js';
+import { Controller } from '../controller/controller.js';
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
@@ -24,5 +25,15 @@ app.get('/', DashboardController.get);
 app.get('/files', MyFileController.get);
 app.get('/starred', StarredController.get);
 
+// Catch-all 404 handler - render not-found page with default config
+app.use((req, res) => {
+    const pageData = {
+        ...Controller.defaultConfig,
+        page: 'not-found',
+        title: '404 Not Found',
+        currentPath: req.path
+    };
+    res.status(404).render('layouts/main', pageData);
+});
 
 export default app;

src/client/views/pages/not-found.ejs

@@ -0,0 +1,14 @@
+<main class="flex-1 overflow-y-auto bg-background relative">
+    <%- include('../components/header') %>
+
+    <div class="p-12 flex items-center justify-center">
+        <div class="max-w-xl text-center">
+            <h1 class="text-6xl font-bold text-slate-900">404</h1>
+            <p class="mt-4 text-xl text-slate-700">Page not found</p>
+            <p class="mt-2 text-sm text-slate-400">We couldn't find the page you're looking for.</p>
+            <div class="mt-6">
+                <a href="/" class="inline-block px-4 py-2 bg-primary text-white rounded-lg">Go back home</a>
+            </div>
+        </div>
+    </div>
+</main>