fix(core): update

2024-04-20 12:21:41 +02:00
commit c24262f765
84 changed files with 14340 additions and 0 deletions
--- a/ts_web/elements/cloudly-dashboard.ts
+++ b/ts_web/elements/cloudly-dashboard.ts
@@ -0,0 +1,202 @@
+import { commitinfo } from '../00_commitinfo_data.js';
+import * as plugins from '../plugins.js';
+
+import * as appstate from '../appstate.js';
+
+import {
+  DeesElement,
+  css,
+  cssManager,
+  customElement,
+  html,
+  state
+} from '@design.estate/dees-element';
+import { CloudlyViewBackups } from './cloudly-view-backups.js';
+import { CloudlyViewClusters } from './cloudly-view-clusters.js';
+import { CloudlyViewDbs } from './cloudly-view-dbs.js';
+import { CloudlyViewDeployments } from './cloudly-view-deployments.js';
+import { CloudlyViewDns } from './cloudly-view-dns.js';
+import { CloudlyViewImages } from './cloudly-view-images.js';
+import { CloudlyViewLogs } from './cloudly-view-logs.js';
+import { CloudlyViewMails } from './cloudly-view-mails.js';
+import { CloudlyViewOverview } from './cloudly-view-overview.js';
+import { CloudlyViewS3 } from './cloudly-view-s3.js';
+import { CloudlyViewSecretBundles } from './cloudly-view-secretbundles.js';
+import { CloudlyViewSecretGroups } from './cloudly-view-secretgroups.js';
+import { CloudlyViewServices } from './cloudly-view-services.js';
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'cvault-dashboard': CloudlyDashboard;
+  }
+}
+
+@customElement('cloudly-dashboard')
+export class CloudlyDashboard extends DeesElement {
+  @state() private jwt: string;
+  @state() private data: appstate.IDataState = {
+    secretGroups: [],
+    secretBundles: [],
+    clusters: [],
+  };
+
+  constructor() {
+    super();
+    const subcription = appstate.dataState
+      .select((stateArg) => stateArg)
+      .subscribe((dataArg) => {
+        this.data = dataArg;
+      });
+    this.rxSubscriptions.push(subcription);
+  }
+
+  public static styles = [
+    cssManager.defaultStyles,
+    css`
+      .maincontainer {
+        position: relative;
+        width: 100vw;
+        height: 100vh;
+      }
+
+      h1 {
+        font-weight: 400;
+        font-size: 24px;
+        font-family: 'Cal Sans';
+      }
+    `,
+  ];
+  public render() {
+    return html`
+      <div class="maincontainer">
+        <dees-simple-login name="cloudly v${commitinfo.version}">
+          <dees-simple-appdash name="cloudly v${commitinfo.version}"
+            .viewTabs=${[
+              {
+                name: 'Overview',
+                element: CloudlyViewOverview,
+              },
+              {
+                name: 'SecretGroups',
+                element: CloudlyViewSecretGroups,
+              },
+              {
+                name: 'SecretBundles',
+                element: CloudlyViewSecretBundles,
+              },
+              {
+                name: 'Clusters',
+                element: CloudlyViewClusters,
+              },
+              {
+                name: 'Images',
+                element: CloudlyViewImages,
+              },
+              {
+                name: 'Services',
+                element: CloudlyViewServices,
+              },
+              {
+                name: 'Deployments',
+                element: CloudlyViewDeployments,
+              },
+              {
+                name: 'DNS',
+                element: CloudlyViewDns,
+              },
+              {
+                name: 'Mails',
+                element: CloudlyViewMails,
+              },
+              {
+                name: 'Logs',
+                element: CloudlyViewLogs,
+              },
+              {
+                name: 's3',
+                element: CloudlyViewS3,
+              },
+              {
+                name: 'DBs',
+                element: CloudlyViewDbs,
+              },
+              {
+                name: 'Backups',
+                element: CloudlyViewBackups,
+              },
+              {
+                name: 'Fleet',
+                element: CloudlyViewBackups,
+              }
+            ] as plugins.deesCatalog.IView[]}
+          ></dees-simple-appdash>
+        </dees-simple-login>
+      </div>
+    `;
+  }
+  public async firstUpdated() {
+    const simpleLogin = this.shadowRoot.querySelector('dees-simple-login');
+    simpleLogin.addEventListener('login', (e: CustomEvent) => {
+      console.log(e.detail);
+      this.login(e.detail.data.username, e.detail.data.password);
+    });
+    this.addEventListener('contextmenu', (eventArg) => {
+      plugins.deesCatalog.DeesContextmenu.openContextMenuWithOptions(eventArg, [
+        {
+          name: 'About',
+          iconName: 'mugHot',
+          action: async () => {
+            await plugins.deesCatalog.DeesModal.createAndShow({
+              heading: 'About',
+              content: html`configvault ${commitinfo.version}`,
+              menuOptions: [
+                {
+                  name: 'close',
+                  iconName: null,
+                  action: async (modalArg) => {
+                    await modalArg.destroy();
+                  },
+                },
+              ],
+            });
+          },
+        },
+      ]);
+    });
+
+    // lets deal with initial state
+    const domtools = await this.domtoolsPromise;
+    const loginState = appstate.loginStatePart.getState();
+    console.log(loginState);
+    if (loginState.jwt) {
+      this.jwt = loginState.jwt;
+      await simpleLogin.switchToSlottedContent();
+      await appstate.dataState.dispatchAction(appstate.getDataAction, null);
+    }
+  }
+
+  private async login(username: string, password: string) {
+    const domtools = await this.domtoolsPromise;
+    console.log(`attempting to login...`);
+    const simpleLogin = this.shadowRoot.querySelector('dees-simple-login');
+    const form = simpleLogin.shadowRoot.querySelector('dees-form');
+    form.setStatus('pending', 'Logging in...');
+    const state = await appstate.loginStatePart.dispatchAction(appstate.loginAction, {
+      username,
+      password,
+    });
+    if (state.jwt) {
+      console.log('got jwt');
+      this.jwt = state.jwt;
+      form.setStatus('success', 'Logged in!');
+      await simpleLogin.switchToSlottedContent();
+      await appstate.dataState.dispatchAction(appstate.getDataAction, null);
+    } else {
+      form.setStatus('error', 'Login failed!');
+      await domtools.convenience.smartdelay.delayFor(2000);
+      form.reset();
+    }
+  }
+
+  private async logout() {}
+}