From a6e26c6d728ea3f4a78aebf8d053afedd28e7bd8 Mon Sep 17 00:00:00 2001
From: Kitteh <kitteh@kitteh.pw>
Date: Tue, 18 May 2021 12:32:13 +0100
Subject: [PATCH] Add list to auth home page.

---
 src/api/auth/listAuth.ts          | 11 +++++++
 src/api/types/auth.ts             | 19 ++++++++++++
 src/elements/Tile.ts              |  5 ++--
 src/pages/Access/Auth/AuthHome.ts | 50 ++++++++++++++++++++++++++++++-
 src/translations/en.js            |  2 ++
 5 files changed, 84 insertions(+), 3 deletions(-)
 create mode 100644 src/api/auth/listAuth.ts
 create mode 100644 src/api/types/auth.ts

diff --git a/src/api/auth/listAuth.ts b/src/api/auth/listAuth.ts
new file mode 100644
index 0000000..b268d82
--- /dev/null
+++ b/src/api/auth/listAuth.ts
@@ -0,0 +1,11 @@
+import { appendAPIURL, getHeaders } from "../apiUtils";
+import { AuthListAPIType, AuthListType } from "../types/auth";
+
+export async function listAuth(): Promise<AuthListType> {
+  const request = new Request(appendAPIURL(`/v1/sys/auth`), {
+    headers: getHeaders(),
+  });
+  const resp = await fetch(request);
+  const data = (await resp.json()) as AuthListAPIType;
+  return data.data;
+}
diff --git a/src/api/types/auth.ts b/src/api/types/auth.ts
new file mode 100644
index 0000000..fb9e8f1
--- /dev/null
+++ b/src/api/types/auth.ts
@@ -0,0 +1,19 @@
+export type AuthMethod = {
+  type: string;
+  accessor: string;
+  config: Record<string, unknown>;
+  description: string;
+  external_entropy_access: Boolean;
+  local: Boolean;
+  options: Record<string, unknown>;
+  seal_wrap: Boolean;
+  uuid: string;
+}
+
+export type AuthListAPIType = {
+  data: AuthListType;
+}
+
+export type AuthListType = {
+  [path: string]: AuthMethod;
+}
\ No newline at end of file
diff --git a/src/elements/Tile.ts b/src/elements/Tile.ts
index f7eb5e7..77f575e 100644
--- a/src/elements/Tile.ts
+++ b/src/elements/Tile.ts
@@ -1,7 +1,8 @@
 import { makeElement } from "z-makeelement";
 
-type TileParams = {
+export type TileParams = {
   condition?: boolean;
+  color?: string;
   title: string;
   description: string;
   icon?: string;
@@ -17,7 +18,7 @@ export function Tile(params: TileParams): HTMLElement {
     onclick: params.onclick,
     children: makeElement({
       tag: "div",
-      class: ["uk-padding-small", "uk-background-primary"],
+      class: ["uk-padding-small", "uk-background-" + (params.color || "primary")],
       children: [
         makeElement({
           tag: "p",
diff --git a/src/pages/Access/Auth/AuthHome.ts b/src/pages/Access/Auth/AuthHome.ts
index 21a3305..d92598a 100644
--- a/src/pages/Access/Auth/AuthHome.ts
+++ b/src/pages/Access/Auth/AuthHome.ts
@@ -1,6 +1,49 @@
 import { Page } from "../../../types/Page";
 import i18next from "i18next";
 import { setErrorText } from "../../../pageUtils";
+import { listAuth } from "../../../api/auth/listAuth";
+import { objectToMap } from "../../../utils";
+import { AuthMethod } from "../../../api/types/auth";
+import { makeElement } from "z-makeelement";
+
+
+export function AuthListElement(path: string, method: AuthMethod): HTMLElement {
+  const isClickable = method.type != "token";
+
+  return makeElement({
+    tag: "div",
+    class: ["uk-padding-small", "uk-background-secondary"],
+    children: [
+      makeElement({
+        tag: isClickable ? "a" : "span",
+        class: "uk-h4 uk-margin-bottom",
+        text: path,
+      }),
+      makeElement({
+        tag: "span",
+        class: "uk-text-muted",
+        text: ` (${method.accessor})`
+      }),
+      makeElement({
+        tag: "div",
+        class: "uk-margin-top",
+        children: [
+          makeElement({
+            tag: "button",
+            class: "uk-button uk-button-small uk-button-primary",
+            text: "View Config",
+          }),
+          makeElement({
+            tag: "button",
+            class: "uk-button uk-button-small uk-button-primary",
+            text: "Edit Config",
+          }),
+        ]
+      }),
+
+    ],
+  });
+}
 
 export class AuthHomePage extends Page {
   constructor() {
@@ -10,7 +53,12 @@ export class AuthHomePage extends Page {
     await this.router.changePage("ACCESS_HOME");
   }
   async render(): Promise<void> {
-    setErrorText(i18next.t("not_implemented"));
+    let authList = objectToMap(await listAuth()) as Map<string, AuthMethod>;
+    const contentElement = makeElement({ tag: "div" });
+    this.router.setPageContent(contentElement);
+    for (const [path, details] of authList) {
+      contentElement.appendChild(AuthListElement(path, details))
+    }
   }
   get name(): string {
     return i18next.t("auth_home_title");
diff --git a/src/translations/en.js b/src/translations/en.js
index fbbf4ff..2dce818 100644
--- a/src/translations/en.js
+++ b/src/translations/en.js
@@ -220,4 +220,6 @@ module.exports = {
 
   // Auth Home Page
   auth_home_title: "Auth",
+  auth_home_view_config: "View Config",
+  auth_home_edit_config: "Edit Config",
 };