feat(admin-ui): introduce view layer and refactor admin UI to use view components, consolidate demos, and update interfaces

ts_web/views/upladmin-dashboard-view/upladmin-dashboard-view.ts

@@ -0,0 +1,60 @@
+import {
+  DeesElement,
+  customElement,
+  html,
+  state,
+  css,
+  cssManager,
+} from '@design.estate/dees-element';
+import type { DeesAppuiBase } from '@design.estate/dees-catalog';
+
+// View lifecycle interfaces (defined locally as they're not exported from dees-catalog)
+interface IViewActivationContext {
+  appui: DeesAppuiBase;
+  viewId: string;
+  params?: Record<string, string>;
+}
+
+interface IViewLifecycle {
+  onActivate?: (context: IViewActivationContext) => void | Promise<void>;
+  onDeactivate?: () => void | Promise<void>;
+}
+import { adminState } from '../../services/admin-state.js';
+import '../../elements/upladmin-dashboard/upladmin-dashboard.js';
+
+@customElement('upladmin-dashboard-view')
+export class UpladminDashboardView extends DeesElement implements IViewLifecycle {
+  @state()
+  accessor loading: boolean = true;
+
+  public static styles = [
+    cssManager.defaultStyles,
+    css`
+      :host {
+        display: block;
+        height: 100%;
+      }
+    `,
+  ];
+
+  async onActivate(context: IViewActivationContext): Promise<void> {
+    // Dashboard has no secondary menu - clear any existing
+    context.appui.clearSecondaryMenu();
+
+    // No content tabs for dashboard
+    context.appui.setContentTabs([]);
+
+    // Load data
+    this.loading = false;
+  }
+
+  render() {
+    return html`
+      <upladmin-dashboard
+        .monitors=${adminState.monitors}
+        .incidents=${adminState.incidents}
+        .loading=${this.loading}
+      ></upladmin-dashboard>
+    `;
+  }
+}