web: re-organise frontend and cleanup common code (#3572)

* fix repo in api client Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * web: re-organise files to match their interface Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * core: include version in script tags Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * cleanup maybe broken Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * revert rename Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * web: get rid of Client.ts Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * move more to common Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * more moving Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * format Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * unfuck files that vscode fucked, thanks Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * move more Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * finish moving (maybe) Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * ok more moving Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * fix more stuff that vs code destroyed Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * get rid "web" prefix for virtual package Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * fix locales Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * use custom base element Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * fix css file Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * don't run autoDetectLanguage when importing locale Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * fix circular dependencies Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> * web: fix build Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org> Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
2022-09-15 00:05:21 +02:00
parent 369440652c
commit 4a91a7d2e2
291 changed files with 2062 additions and 1921 deletions
--- a/web/src/admin/system-tasks/SystemTaskListPage.ts
+++ b/web/src/admin/system-tasks/SystemTaskListPage.ts
@ -0,0 +1,131 @@
+import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
+import { EVENT_REFRESH } from "@goauthentik/common/constants";
+import { PFColor } from "@goauthentik/elements/Label";
+import "@goauthentik/elements/buttons/ActionButton";
+import "@goauthentik/elements/buttons/SpinnerButton";
+import { PaginatedResponse } from "@goauthentik/elements/table/Table";
+import { TableColumn } from "@goauthentik/elements/table/Table";
+import { TablePage } from "@goauthentik/elements/table/TablePage";
+
+import { t } from "@lingui/macro";
+
+import { CSSResult, TemplateResult, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+
+import PFDescriptionList from "@patternfly/patternfly/components/DescriptionList/description-list.css";
+
+import { AdminApi, Task, TaskStatusEnum } from "@goauthentik/api";
+
+@customElement("ak-system-task-list")
+export class SystemTaskListPage extends TablePage<Task> {
+    searchEnabled(): boolean {
+        return false;
+    }
+    pageTitle(): string {
+        return t`System Tasks`;
+    }
+    pageDescription(): string {
+        return t`Long-running operations which authentik executes in the background.`;
+    }
+    pageIcon(): string {
+        return "pf-icon pf-icon-automation";
+    }
+
+    expandable = true;
+
+    @property()
+    order = "slug";
+
+    static get styles(): CSSResult[] {
+        return super.styles.concat(PFDescriptionList);
+    }
+
+    async apiEndpoint(page: number): Promise<PaginatedResponse<Task>> {
+        return new AdminApi(DEFAULT_CONFIG).adminSystemTasksList().then((tasks) => {
+            return {
+                pagination: {
+                    count: tasks.length,
+                    totalPages: 1,
+                    startIndex: 1,
+                    endIndex: tasks.length,
+                    current: page,
+                },
+                results: tasks,
+            };
+        });
+    }
+
+    columns(): TableColumn[] {
+        return [
+            new TableColumn(t`Identifier`),
+            new TableColumn(t`Description`),
+            new TableColumn(t`Last run`),
+            new TableColumn(t`Status`),
+            new TableColumn(t`Actions`),
+        ];
+    }
+
+    taskStatus(task: Task): TemplateResult {
+        switch (task.status) {
+            case TaskStatusEnum.Successful:
+                return html`<ak-label color=${PFColor.Green}>${t`Successful`}</ak-label>`;
+            case TaskStatusEnum.Warning:
+                return html`<ak-label color=${PFColor.Orange}>${t`Warning`}</ak-label>`;
+            case TaskStatusEnum.Error:
+                return html`<ak-label color=${PFColor.Red}>${t`Error`}</ak-label>`;
+            default:
+                return html`<ak-label color=${PFColor.Grey}>${t`Unknown`}</ak-label>`;
+        }
+    }
+
+    renderExpanded(item: Task): TemplateResult {
+        return html` <td role="cell" colspan="3">
+                <div class="pf-c-table__expandable-row-content">
+                    <dl class="pf-c-description-list pf-m-horizontal">
+                        <div class="pf-c-description-list__group">
+                            <dt class="pf-c-description-list__term">
+                                <span class="pf-c-description-list__text">${t`Messages`}</span>
+                            </dt>
+                            <dd class="pf-c-description-list__description">
+                                <div class="pf-c-description-list__text">
+                                    ${item.messages.map((m) => {
+                                        return html`<li>${m}</li>`;
+                                    })}
+                                </div>
+                            </dd>
+                        </div>
+                    </dl>
+                </div>
+            </td>
+            <td></td>
+            <td></td>`;
+    }
+
+    row(item: Task): TemplateResult[] {
+        return [
+            html`${item.taskName}`,
+            html`${item.taskDescription}`,
+            html`${item.taskFinishTimestamp.toLocaleString()}`,
+            this.taskStatus(item),
+            html`<ak-action-button
+                class="pf-m-plain"
+                .apiRequest=${() => {
+                    return new AdminApi(DEFAULT_CONFIG)
+                        .adminSystemTasksRetryCreate({
+                            id: item.taskName,
+                        })
+                        .then(() => {
+                            this.dispatchEvent(
+                                new CustomEvent(EVENT_REFRESH, {
+                                    bubbles: true,
+                                    composed: true,
+                                }),
+                            );
+                        });
+                }}
+            >
+                <i class="fas fa-play" aria-hidden="true"></i>
+            </ak-action-button>`,
+        ];
+    }
+}