From 9e33b49d29ee34e11248ebf2c8b39fdf9e03d91a Mon Sep 17 00:00:00 2001 From: Jens Langhammer Date: Wed, 16 Dec 2020 22:00:40 +0100 Subject: [PATCH] web: rewrite aggregate cards to separate components --- web/src/api/{policy_binding.ts => policy.ts} | 15 +++- web/src/api/provider.ts | 19 ++++ .../elements/policies/BoundPoliciesList.ts | 2 +- .../pages/admin-overview/AdminOverviewPage.ts | 69 ++------------ web/src/pages/admin-overview/OverviewCards.ts | 90 +++++++++++++++++++ 5 files changed, 128 insertions(+), 67 deletions(-) rename web/src/api/{policy_binding.ts => policy.ts} (66%) create mode 100644 web/src/api/provider.ts create mode 100644 web/src/pages/admin-overview/OverviewCards.ts diff --git a/web/src/api/policy_binding.ts b/web/src/api/policy.ts similarity index 66% rename from web/src/api/policy_binding.ts rename to web/src/api/policy.ts index 7d2168d3f..3344e361d 100644 --- a/web/src/api/policy_binding.ts +++ b/web/src/api/policy.ts @@ -1,9 +1,20 @@ import { DefaultClient, PBResponse, QueryArguments } from "./client"; -export interface Policy { +export class Policy { pk: string; name: string; - [key: string]: unknown; + + constructor() { + throw Error(); + } + + static get(pk: string): Promise { + return DefaultClient.fetch(["policies", "all", pk]); + } + + static list(filter?: QueryArguments): Promise> { + return DefaultClient.fetch>(["policies", "all"], filter); + } } export class PolicyBinding { diff --git a/web/src/api/provider.ts b/web/src/api/provider.ts new file mode 100644 index 000000000..b31d15459 --- /dev/null +++ b/web/src/api/provider.ts @@ -0,0 +1,19 @@ +import { DefaultClient, PBResponse, QueryArguments } from "./client"; + +export class Provider { + pk: number; + name: string; + authorization_flow: string; + + constructor() { + throw Error(); + } + + static get(slug: string): Promise { + return DefaultClient.fetch(["providers", "all", slug]); + } + + static list(filter?: QueryArguments): Promise> { + return DefaultClient.fetch>(["providers", "all"], filter); + } +} diff --git a/web/src/elements/policies/BoundPoliciesList.ts b/web/src/elements/policies/BoundPoliciesList.ts index eba400426..ac3b73890 100644 --- a/web/src/elements/policies/BoundPoliciesList.ts +++ b/web/src/elements/policies/BoundPoliciesList.ts @@ -1,7 +1,7 @@ import { gettext } from "django"; import { customElement, html, property, TemplateResult } from "lit-element"; import { PBResponse } from "../../api/client"; -import { PolicyBinding } from "../../api/policy_binding"; +import { PolicyBinding } from "../../api/policy"; import { Table } from "../../elements/table/Table"; import "../../elements/Tabs"; diff --git a/web/src/pages/admin-overview/AdminOverviewPage.ts b/web/src/pages/admin-overview/AdminOverviewPage.ts index 719345744..c4bd1ce08 100644 --- a/web/src/pages/admin-overview/AdminOverviewPage.ts +++ b/web/src/pages/admin-overview/AdminOverviewPage.ts @@ -4,50 +4,11 @@ import { AdminOverview } from "../../api/admin_overview"; import { DefaultClient } from "../../api/client"; import { User } from "../../api/user"; import { COMMON_STYLES } from "../../common/styles"; -import { AggregatePromiseCard } from "../../elements/cards/AggregatePromiseCard"; import { SpinnerSize } from "../../elements/Spinner"; import "../../elements/AdminLoginsChart"; import "./TopApplicationsTable"; - -@customElement("ak-admin-status-card") -export class AdminStatusCard extends AggregatePromiseCard { - - @property({type: Number}) - value?: number; - - @property() - warningText?: string; - - @property({type: Number}) - lessThanThreshold?: number; - - renderNone(): TemplateResult { - return html``; - } - - renderGood(): TemplateResult { - return html`

- ${this.value} -

`; - } - - renderBad(): TemplateResult { - return html`

- ${this.value} -

-

${this.warningText ? gettext(this.warningText) : ""}

`; - } - - renderInner(): TemplateResult { - if (!this.value) { - return this.renderNone(); - } - - return html``; - } - -} +import "./OverviewCards"; @customElement("ak-admin-overview") export class AdminOverviewPage extends LitElement { @@ -92,30 +53,10 @@ export class AdminOverviewPage extends LitElement {

` : html``} - - ${this.data ? - this.data?.providers_without_application > 1 ? - html`

- 0 -

-

${gettext("At least one Provider has no application assigned.")}

` : - html`

- 0 -

` - : html``} - - - ${this.data ? - this.data?.policies_without_binding > 1 ? - html`

- 0 -

-

${gettext("Policies without binding exist.")}

` : - html`

- 0 -

` - : html``} - + + + + ; + + abstract getStatus(counter: number): Promise; + + @property({type: Number}) + counter = 0; + + renderInner(): TemplateResult { + return html`

+ ${until(this.getPrimaryCounter().then((c) => { + this.counter = c; + return this.getStatus(c); + }).then((status) => { + return html`

+ ${this.counter} +

+ ${status.message ? html`

${status.message}

` : html``}`; + }), html``)} +

`; + } +} + +@customElement("ak-admin-status-card-provider") +export class ProviderStatusCard extends AdminStatusCard { + + getPrimaryCounter(): Promise { + return Provider.list({ + "application__isnull": true + }).then((response) => { + return response.pagination.count; + }); + } + + getStatus(counter: number): Promise { + if (counter > 0) { + return Promise.resolve({ + icon: "fa fa-exclamation-triangle", + message: gettext("Warning: At least one Provider has no application assigned."), + }); + } else { + return Promise.resolve({ + icon: "fa fa-check-circle" + }); + } + } + +} + +@customElement("ak-admin-status-card-policy") +export class PolicyStatusCard extends AdminStatusCard { + + getPrimaryCounter(): Promise { + return Policy.list({ + "bindings__isnull": true, + "promptstage__isnull": true, + }).then((response) => { + return response.pagination.count; + }); + } + + getStatus(counter: number): Promise { + if (counter > 0) { + return Promise.resolve({ + icon: "fa fa-exclamation-triangle", + message: gettext("Policies without binding exist."), + }); + } else { + return Promise.resolve({ + icon: "fa fa-check-circle" + }); + } + } + +}