refactor: replace Jinja templates with static frontend pages

webui/static/hoover/components/data.js

@@ -0,0 +1,59 @@
+/**
+ * Hoover — components/data.js
+ *
+ * Data display components: Badge, StatusDot, Empty, Card.
+ */
+
+import { h } from '../vdom.js';
+
+/**
+ * Colored badge/span.
+ *
+ * @param {object} props
+ * @param {string} props.text    – Badge text
+ * @param {string} [props.variant] – 'info' | 'success' | 'warning' | 'danger'
+ */
+export function Badge(props = {}) {
+    return h('span', { class: `badge badge-${props.variant || 'info'}` }, String(props.text || ''));
+}
+
+/**
+ * Status indicator dot.
+ *
+ * @param {object} props
+ * @param {string} props.status – 'success' | 'up' | 'danger' | 'down' | 'pending'
+ */
+export function StatusDot(props = {}) {
+    const v = ['success', 'up'].includes(props.status) ? 'up' :
+              ['danger', 'down'].includes(props.status) ? 'down' : 'pending';
+    return h('span', { class: `status-dot status-${v}` });
+}
+
+/**
+ * Empty-state placeholder card.
+ *
+ * @param {object} props
+ * @param {string} [props.text]
+ */
+export function Empty(props = {}) {
+    return h('div', { class: 'card' },
+        h('div', { class: 'text-muted text-sm' }, props.text || 'No data available'),
+    );
+}
+
+/**
+ * Card wrapper with optional header and body content.
+ *
+ * @param {object} props
+ * @param {string} [props.header]
+ * @param {VNode[]} [props.children]
+ */
+export function Card(props = {}) {
+    if (props.header) {
+        return h('div', { class: 'card' },
+            h('div', { class: 'card-header' }, props.header),
+            h('div', { class: 'card-body' }, props.children || []),
+        );
+    }
+    return h('div', { class: 'card' }, props.children || []);
+}