feat(admin): Add global admin functionality: backend admin APIs, model fields and UI integration

ts_web/elements/account/navigation.ts

@@ -6,6 +6,7 @@ import {
   cssManager,
   unsafeCSS,
   css,
+  state,
   type TemplateResult,
 } from '@design.estate/dees-element';
 
@@ -24,6 +25,9 @@ declare global {
 
 @customElement('lele-accountnavigation')
 export class LeleAccountNavigation extends DeesElement {
+  @state()
+  accessor isGlobalAdmin: boolean = false;
+
   constructor() {
     super();
   }
@@ -252,12 +256,34 @@ export class LeleAccountNavigation extends DeesElement {
           <dees-icon .icon=${'lucide:wallet'}></dees-icon>
           Billing
         </div>
+
+        ${this.renderAdminLink()}
       </div>
 
       <div class="commitinfo">v${commitinfo.version}</div>
     `;
   }
 
+  private renderAdminLink(): TemplateResult | null {
+    if (!this.isGlobalAdmin) {
+      return null;
+    }
+    return html`
+      <div class="divider"></div>
+      <div class="navigationGroupLabel">Platform</div>
+      <div
+        class="navigationOption"
+        @click=${async () => {
+          const subrouter = await this.getAccountRouter();
+          subrouter.pushUrl('/admin');
+        }}
+      >
+        <dees-icon .icon=${'lucide:shield'}></dees-icon>
+        Global Admin
+      </div>
+    `;
+  }
+
   public firstUpdated() {
     const deesInputDropdown = this.shadowRoot.querySelector('dees-input-dropdown');
     const orgToMenuEntry = (orgArg?: plugins.idpInterfaces.data.IOrganization) => {
@@ -286,5 +312,12 @@ export class LeleAccountNavigation extends DeesElement {
       .subscribe((selectedOrgArg) => {
         deesInputDropdown.selectedOption = selectedOrgArg;
       });
+
+    // Check if user is global admin
+    states.accountState
+      .select((stateArg) => stateArg.user)
+      .subscribe((user) => {
+        this.isGlobalAdmin = user?.data?.isGlobalAdmin ?? false;
+      });
   }
 }