Update frame work and workspace codebase

internal/templates/hx_monitoring.html

@@ -0,0 +1,68 @@
+{{define "hx_monitoring"}}
+<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+  {{range .Groups}}
+  <div class="bg-white rounded-lg shadow-md p-6">
+    <div class="flex justify-between items-center mb-4">
+      <h2 class="text-xl font-semibold">{{.Title}}</h2>
+      <button hx-get="/hx/monitoring/group?group={{.Title}}" 
+              hx-target="closest .bg-white" 
+              hx-swap="outerHTML"
+              class="text-blue-600 hover:text-blue-800 text-sm">
+        🔄 Refresh
+      </button>
+    </div>
+    
+    {{if .Errors}}
+    <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-4">
+      <div class="flex">
+        <div class="ml-3">
+          <p class="text-sm text-yellow-700">
+            <strong>Warnings:</strong>
+            <ul class="list-disc list-inside mt-1">
+              {{range .Errors}}
+              <li>{{.}}</li>
+              {{end}}
+            </ul>
+          </p>
+        </div>
+      </div>
+    </div>
+    {{end}}
+
+    <div class="space-y-3">
+      {{range .Metrics}}
+      <div class="flex justify-between items-center p-3 {{if eq .Status "error"}}bg-red-50{{else if eq .Status "warning"}}bg-yellow-50{{else}}bg-gray-50{{end}} rounded">
+        <div class="flex-1">
+          <div class="font-medium text-sm">{{.Name}}</div>
+          <div class="text-xs text-gray-500 mt-1">{{.Timestamp.Format "15:04:05"}}</div>
+        </div>
+        <div class="flex items-center space-x-2">
+          <span class="text-lg font-semibold">{{.Value}}</span>
+          {{if eq .Status "error"}}
+            <span class="text-red-600">⚠️</span>
+          {{else if eq .Status "warning"}}
+            <span class="text-yellow-600">⚡</span>
+          {{else}}
+            <span class="text-green-600">✓</span>
+          {{end}}
+        </div>
+      </div>
+      {{else}}
+      <div class="text-center text-gray-500 py-4">No metrics available</div>
+      {{end}}
+    </div>
+  </div>
+  {{else}}
+  <div class="col-span-2 bg-yellow-50 border-l-4 border-yellow-400 p-4">
+    <div class="flex">
+      <div class="ml-3">
+        <p class="text-sm text-yellow-700">
+          <strong>Warning:</strong> No monitoring data available. Some collectors may have failed.
+        </p>
+      </div>
+    </div>
+  </div>
+  {{end}}
+</div>
+{{end}}
+

internal/templates/hx_monitoring_group.html

@@ -0,0 +1,54 @@
+{{define "hx_monitoring_group"}}
+<div class="bg-white rounded-lg shadow-md p-6">
+  <div class="flex justify-between items-center mb-4">
+    <h2 class="text-xl font-semibold">{{.Group.Title}}</h2>
+    <button hx-get="/hx/monitoring/group?group={{.Group.Title}}" 
+            hx-target="closest .bg-white" 
+            hx-swap="outerHTML"
+            class="text-blue-600 hover:text-blue-800 text-sm">
+      🔄 Refresh
+    </button>
+  </div>
+  
+  {{if .Group.Errors}}
+  <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-4">
+    <div class="flex">
+      <div class="ml-3">
+        <p class="text-sm text-yellow-700">
+          <strong>Warnings:</strong>
+          <ul class="list-disc list-inside mt-1">
+            {{range .Group.Errors}}
+            <li>{{.}}</li>
+            {{end}}
+          </ul>
+        </p>
+      </div>
+    </div>
+  </div>
+  {{end}}
+
+  <div class="space-y-3">
+    {{range .Group.Metrics}}
+    <div class="flex justify-between items-center p-3 {{if eq .Status "error"}}bg-red-50{{else if eq .Status "warning"}}bg-yellow-50{{else}}bg-gray-50{{end}} rounded">
+      <div class="flex-1">
+        <div class="font-medium text-sm">{{.Name}}</div>
+        <div class="text-xs text-gray-500 mt-1">{{.Timestamp.Format "15:04:05"}}</div>
+      </div>
+      <div class="flex items-center space-x-2">
+        <span class="text-lg font-semibold">{{.Value}}</span>
+        {{if eq .Status "error"}}
+          <span class="text-red-600">⚠️</span>
+        {{else if eq .Status "warning"}}
+          <span class="text-yellow-600">⚡</span>
+        {{else}}
+          <span class="text-green-600">✓</span>
+        {{end}}
+      </div>
+    </div>
+    {{else}}
+    <div class="text-center text-gray-500 py-4">No metrics available</div>
+    {{end}}
+  </div>
+</div>
+{{end}}
+

internal/templates/hx_roles.html

@@ -0,0 +1,41 @@
+{{define "hx_roles"}}
+<div class="bg-white rounded-lg shadow-md overflow-hidden">
+  <table class="min-w-full divide-y divide-gray-200">
+    <thead class="bg-gray-50">
+      <tr>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Role Name</th>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Description</th>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Permissions</th>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
+      </tr>
+    </thead>
+    <tbody class="bg-white divide-y divide-gray-200">
+      {{range .Roles}}
+      <tr>
+        <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">{{.Name}}</td>
+        <td class="px-6 py-4 text-sm text-gray-500">{{.Description}}</td>
+        <td class="px-6 py-4 text-sm text-gray-500">
+          {{range .Permissions}}
+            <span class="inline-block bg-green-100 text-green-800 text-xs px-2 py-1 rounded mr-1 mb-1">{{.Name}}</span>
+          {{else}}
+            <span class="text-gray-400">No permissions</span>
+          {{end}}
+        </td>
+        <td class="px-6 py-4 whitespace-nowrap text-sm">
+          <button hx-post="/admin/roles/{{.ID}}/delete" 
+                  hx-confirm="Are you sure you want to delete role {{.Name}}?"
+                  hx-target="#roles-list" 
+                  hx-swap="outerHTML"
+                  class="text-red-600 hover:text-red-900">Delete</button>
+        </td>
+      </tr>
+      {{else}}
+      <tr>
+        <td colspan="4" class="px-6 py-4 text-center text-gray-500">No roles found</td>
+      </tr>
+      {{end}}
+    </tbody>
+  </table>
+</div>
+{{end}}
+

internal/templates/hx_users.html

@@ -0,0 +1,41 @@
+{{define "hx_users"}}
+<div class="bg-white rounded-lg shadow-md overflow-hidden">
+  <table class="min-w-full divide-y divide-gray-200">
+    <thead class="bg-gray-50">
+      <tr>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Username</th>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Roles</th>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Created</th>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
+      </tr>
+    </thead>
+    <tbody class="bg-white divide-y divide-gray-200">
+      {{range .Users}}
+      <tr>
+        <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">{{.Username}}</td>
+        <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+          {{range .Roles}}
+            <span class="inline-block bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded mr-1">{{.Name}}</span>
+          {{else}}
+            <span class="text-gray-400">No roles</span>
+          {{end}}
+        </td>
+        <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">{{.CreatedAt}}</td>
+        <td class="px-6 py-4 whitespace-nowrap text-sm">
+          <button hx-post="/admin/users/{{.ID}}/delete" 
+                  hx-confirm="Are you sure you want to delete user {{.Username}}?"
+                  hx-target="#users-list" 
+                  hx-swap="outerHTML"
+                  class="text-red-600 hover:text-red-900">Delete</button>
+        </td>
+      </tr>
+      {{else}}
+      <tr>
+        <td colspan="4" class="px-6 py-4 text-center text-gray-500">No users found</td>
+      </tr>
+      {{end}}
+    </tbody>
+  </table>
+</div>
+{{end}}
+

internal/templates/login.html

@@ -0,0 +1,34 @@
+{{define "login"}}
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <script src="https://unpkg.com/htmx.org@1.9.2"></script>
+  <title>Login - Storage Appliance</title>
+  <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
+</head>
+<body class="bg-gray-100 flex items-center justify-center min-h-screen">
+  <div class="bg-white p-8 rounded-lg shadow-md w-full max-w-md">
+    <h1 class="text-2xl font-bold mb-6 text-center">Storage Appliance</h1>
+    <form hx-post="/login" hx-target="#error-message" hx-swap="innerHTML">
+      <div class="mb-4">
+        <label for="username" class="block text-sm font-medium text-gray-700 mb-2">Username</label>
+        <input type="text" id="username" name="username" required
+               class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
+      </div>
+      <div class="mb-6">
+        <label for="password" class="block text-sm font-medium text-gray-700 mb-2">Password</label>
+        <input type="password" id="password" name="password" required
+               class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
+      </div>
+      <div id="error-message" class="mb-4"></div>
+      <button type="submit" class="w-full bg-blue-600 text-white py-2 px-4 rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500">
+        Login
+      </button>
+    </form>
+  </div>
+</body>
+</html>
+{{end}}
+

internal/templates/monitoring.html

@@ -0,0 +1,16 @@
+{{define "monitoring"}}
+{{template "base" .}}
+{{define "content"}}
+<div class="container mx-auto p-4">
+  <div class="flex justify-between items-center mb-6">
+    <h1 class="text-3xl font-bold">Monitoring Dashboard</h1>
+    <a href="/dashboard" class="text-blue-600 hover:underline">← Back to Dashboard</a>
+  </div>
+
+  <div id="monitoring-content" hx-get="/hx/monitoring" hx-trigger="load" hx-swap="innerHTML">
+    <div class="text-center py-8 text-gray-500">Loading metrics...</div>
+  </div>
+</div>
+{{end}}
+{{end}}
+

internal/templates/roles.html

@@ -0,0 +1,37 @@
+{{define "roles"}}
+{{template "base" .}}
+{{define "content"}}
+<div class="container mx-auto p-4">
+  <div class="flex justify-between items-center mb-6">
+    <h1 class="text-3xl font-bold">Role Management</h1>
+    <a href="/dashboard" class="text-blue-600 hover:underline">← Back to Dashboard</a>
+  </div>
+
+  <div class="bg-white rounded-lg shadow-md p-6 mb-6">
+    <h2 class="text-xl font-semibold mb-4">Create New Role</h2>
+    <form hx-post="/admin/roles/create" hx-target="#roles-list" hx-swap="outerHTML" hx-trigger="submit" hx-on::after-request="this.reset()">
+      <div class="grid grid-cols-2 gap-4 mb-4">
+        <div>
+          <label for="name" class="block text-sm font-medium text-gray-700 mb-1">Role Name</label>
+          <input type="text" id="name" name="name" required
+                 class="w-full px-3 py-2 border border-gray-300 rounded-md">
+        </div>
+        <div>
+          <label for="description" class="block text-sm font-medium text-gray-700 mb-1">Description</label>
+          <input type="text" id="description" name="description"
+                 class="w-full px-3 py-2 border border-gray-300 rounded-md">
+        </div>
+      </div>
+      <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700">
+        Create Role
+      </button>
+    </form>
+  </div>
+
+  <div id="roles-list" hx-get="/admin/hx/roles" hx-trigger="load">
+    <div class="text-center py-8 text-gray-500">Loading roles...</div>
+  </div>
+</div>
+{{end}}
+{{end}}
+

internal/templates/users.html

@@ -0,0 +1,37 @@
+{{define "users"}}
+{{template "base" .}}
+{{define "content"}}
+<div class="container mx-auto p-4">
+  <div class="flex justify-between items-center mb-6">
+    <h1 class="text-3xl font-bold">User Management</h1>
+    <a href="/dashboard" class="text-blue-600 hover:underline">← Back to Dashboard</a>
+  </div>
+
+  <div class="bg-white rounded-lg shadow-md p-6 mb-6">
+    <h2 class="text-xl font-semibold mb-4">Create New User</h2>
+    <form hx-post="/admin/users/create" hx-target="#users-list" hx-swap="outerHTML" hx-trigger="submit" hx-on::after-request="this.reset()">
+      <div class="grid grid-cols-2 gap-4 mb-4">
+        <div>
+          <label for="username" class="block text-sm font-medium text-gray-700 mb-1">Username</label>
+          <input type="text" id="username" name="username" required
+                 class="w-full px-3 py-2 border border-gray-300 rounded-md">
+        </div>
+        <div>
+          <label for="password" class="block text-sm font-medium text-gray-700 mb-1">Password</label>
+          <input type="password" id="password" name="password" required
+                 class="w-full px-3 py-2 border border-gray-300 rounded-md">
+        </div>
+      </div>
+      <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700">
+        Create User
+      </button>
+    </form>
+  </div>
+
+  <div id="users-list" hx-get="/admin/hx/users" hx-trigger="load">
+    <div class="text-center py-8 text-gray-500">Loading users...</div>
+  </div>
+</div>
+{{end}}
+{{end}}
+