web: use generated API Client (#616)

* api: fix types for config API

* api: remove broken swagger UI

* admin: re-fix system task enum

* events: make event optional

* events: fix Schema for notification transport test

* flows: use APIView for Flow Executor

* core: fix schema for Metrics APIs

* web: rewrite to use generated API client

* web: generate API Client in CI

* admin: use x_cord and y_cord to prevent yaml issues

* events: fix linting errors

* web: don't lint generated code

* core: fix fields not being required in TypeSerializer

* flows: fix missing permission_classes

* web: cleanup

* web: fix rendering of graph on Overview page

* web: cleanup imports

* core: fix missing background image filter

* flows: fix flows not advancing properly

* stages/*: fix warnings during get_challenge

* web: send Flow response as JSON instead of FormData

* web: fix styles for horizontal tabs

* web: add base chart class and custom chart for application view

* root: generate ts client for e2e tests

* web: don't attempt to connect to websocket in selenium tests

* web: fix UserTokenList not being included in the build

* web: fix styling for static token list

* web: fix CSRF Token missing

* stages/authenticator_static: fix error when disable static tokens

* core: fix display issue when updating user info

* web: fix Flow executor not showing spinner when redirecting

web/src/pages/admin-overview/AdminOverviewPage.ts

@@ -2,7 +2,7 @@ import { gettext } from "django";
 import { CSSResult, customElement, html, LitElement, TemplateResult } from "lit-element";
 import { COMMON_STYLES } from "../../common/styles";
 
-import "../../elements/AdminLoginsChart";
+import "../../elements/charts/AdminLoginsChart";
 import "../../elements/cards/AggregatePromiseCard";
 import "./TopApplicationsTable";
 import "./cards/AdminStatusCard";
@@ -30,7 +30,7 @@ export class AdminOverviewPage extends LitElement {
         <section class="pf-c-page__main-section">
             <div class="pf-l-gallery pf-m-gutter">
                 <ak-aggregate-card class="pf-l-gallery__item pf-m-4-col" icon="pf-icon pf-icon-server" header="Logins over the last 24 hours" style="grid-column-end: span 3;grid-row-end: span 2;">
-                    <ak-admin-logins-chart .url="${["admin", "metrics"]}"></ak-admin-logins-chart>
+                    <ak-charts-admin-login></ak-charts-admin-login>
                 </ak-aggregate-card>
                 <ak-aggregate-card class="pf-l-gallery__item pf-m-4-col" icon="pf-icon pf-icon-server" header="Apps with most usage" style="grid-column-end: span 2;grid-row-end: span 3;">
                     <ak-top-applications-table></ak-top-applications-table>

web/src/pages/admin-overview/TopApplicationsTable.ts

@@ -1,34 +1,39 @@
 import { gettext } from "django";
 import { CSSResult, customElement, html, LitElement, property, TemplateResult } from "lit-element";
-import { Event, TopNEvent } from "../../api/Events";
 import { COMMON_STYLES } from "../../common/styles";
+import { EventsApi, EventTopPerUser } from "../../api";
 
 import "../../elements/Spinner";
+import { DEFAULT_CONFIG } from "../../api/Config";
 
 @customElement("ak-top-applications-table")
 export class TopApplicationsTable extends LitElement {
 
     @property({attribute: false})
-    topN?: TopNEvent[];
+    topN?: EventTopPerUser[];
 
     static get styles(): CSSResult[] {
         return COMMON_STYLES;
     }
 
     firstUpdated(): void {
-        Event.topForUser("authorize_application").then(events => this.topN = events);
+        new EventsApi(DEFAULT_CONFIG).eventsEventsTopPerUser({
+            action: "authorize_application",
+        }).then((events) => {
+            this.topN = events;
+        });
     }
 
-    renderRow(event: TopNEvent): TemplateResult {
+    renderRow(event: EventTopPerUser): TemplateResult {
         return html`<tr role="row">
             <td role="cell">
                 ${event.application.name}
             </td>
             <td role="cell">
-                ${event.counted_events}
+                ${event.countedEvents}
             </td>
             <td role="cell">
-                <progress value="${event.counted_events}" max="${this.topN ? this.topN[0].counted_events : 0}"></progress>
+                <progress value="${event.countedEvents}" max="${this.topN ? this.topN[0].countedEvents : 0}"></progress>
             </td>
         </tr>`;
     }

web/src/pages/admin-overview/cards/AdminStatusCard.ts

@@ -23,14 +23,14 @@ export abstract class AdminStatusCard<T> extends AggregateCard {
     renderInner(): TemplateResult {
         return html`<p class="center-value">
             ${until(this.getPrimaryValue().then((v) => {
-        this.value = v;
-        return this.getStatus(v);
-    }).then((status) => {
-        return html`<p class="ak-aggregate-card">
-                    <i class="${status.icon}"></i> ${this.renderValue()}
-                </p>
-                ${status.message ? html`<p class="subtext">${status.message}</p>` : html``}`;
-    }), html`<ak-spinner size="${SpinnerSize.Large}"></ak-spinner>`)}
+                this.value = v;
+                return this.getStatus(v);
+            }).then((status) => {
+                return html`<p class="ak-aggregate-card">
+                        <i class="${status.icon}"></i> ${this.renderValue()}
+                    </p>
+                    ${status.message ? html`<p class="subtext">${status.message}</p>` : html``}`;
+            }), html`<ak-spinner size="${SpinnerSize.Large}"></ak-spinner>`)}
         </p>`;
     }
 }

web/src/pages/admin-overview/cards/FlowCacheStatusCard.ts

@@ -1,14 +1,17 @@
 import { gettext } from "django";
 import { customElement, html, TemplateResult } from "lit-element";
-import { Flow } from "../../../api/Flows";
 import { AdminStatus, AdminStatusCard } from "./AdminStatusCard";
 import "../../../elements/buttons/ModalButton";
+import { FlowsApi } from "../../../api";
+import { DEFAULT_CONFIG } from "../../../api/Config";
 
 @customElement("ak-admin-status-card-flow-cache")
 export class FlowCacheStatusCard extends AdminStatusCard<number> {
 
     getPrimaryValue(): Promise<number> {
-        return Flow.cached();
+        return new FlowsApi(DEFAULT_CONFIG).flowsInstancesCached({}).then((value) => {
+            return value.count || 0;
+        });
     }
 
     getStatus(value: number): Promise<AdminStatus> {

web/src/pages/admin-overview/cards/PolicyCacheStatusCard.ts

@@ -1,15 +1,18 @@
 import { gettext } from "django";
 import { customElement } from "lit-element";
 import { TemplateResult, html } from "lit-html";
-import { Policy } from "../../../api/Policies";
 import { AdminStatusCard, AdminStatus } from "./AdminStatusCard";
 import "../../../elements/buttons/ModalButton";
+import { PoliciesApi } from "../../../api";
+import { DEFAULT_CONFIG } from "../../../api/Config";
 
 @customElement("ak-admin-status-card-policy-cache")
 export class PolicyCacheStatusCard extends AdminStatusCard<number> {
 
     getPrimaryValue(): Promise<number> {
-        return Policy.cached();
+        return new PoliciesApi(DEFAULT_CONFIG).policiesAllCached({}).then((value) => {
+            return value.count || 0;
+        });
     }
 
     getStatus(value: number): Promise<AdminStatus> {

web/src/pages/admin-overview/cards/PolicyUnboundStatusCard.ts

@@ -1,17 +1,18 @@
 import { gettext } from "django";
 import { customElement } from "lit-element";
-import { Policy } from "../../../api/Policies";
+import { PoliciesApi } from "../../../api";
+import { DEFAULT_CONFIG } from "../../../api/Config";
 import { AdminStatusCard, AdminStatus } from "./AdminStatusCard";
 
 @customElement("ak-admin-status-card-policy-unbound")
 export class PolicyUnboundStatusCard extends AdminStatusCard<number> {
 
     getPrimaryValue(): Promise<number> {
-        return Policy.list({
-            "bindings__isnull": true,
-            "promptstage__isnull": true,
-        }).then((response) => {
-            return response.pagination.count;
+        return new PoliciesApi(DEFAULT_CONFIG).policiesAllList({
+            bindingsIsnull: "true",
+            promptstageIsnull: "true",
+        }).then((value) => {
+            return value.pagination.count;
         });
     }
 

web/src/pages/admin-overview/cards/ProviderStatusCard.ts

@@ -1,16 +1,17 @@
 import { gettext } from "django";
 import { customElement } from "lit-element";
-import { Provider } from "../../../api/Providers";
+import { ProvidersApi } from "../../../api";
+import { DEFAULT_CONFIG } from "../../../api/Config";
 import { AdminStatusCard, AdminStatus } from "./AdminStatusCard";
 
 @customElement("ak-admin-status-card-provider")
 export class ProviderStatusCard extends AdminStatusCard<number> {
 
     getPrimaryValue(): Promise<number> {
-        return Provider.list({
-            "application__isnull": true
-        }).then((response) => {
-            return response.pagination.count;
+        return new ProvidersApi(DEFAULT_CONFIG).providersAllList({
+            applicationIsnull: "true"
+        }).then((value) => {
+            return value.pagination.count;
         });
     }
 

web/src/pages/admin-overview/cards/UserCountStatusCard.ts

@@ -1,12 +1,17 @@
 import { customElement } from "lit-element";
-import { User } from "../../../api/Users";
+import { CoreApi } from "../../../api";
+import { DEFAULT_CONFIG } from "../../../api/Config";
 import { AdminStatusCard, AdminStatus } from "./AdminStatusCard";
 
 @customElement("ak-admin-status-card-user-count")
 export class UserCountStatusCard extends AdminStatusCard<number> {
 
     getPrimaryValue(): Promise<number> {
-        return User.count();
+        return new CoreApi(DEFAULT_CONFIG).coreUsersList({
+            pageSize: 1
+        }).then((value) => {
+            return value.pagination.count;
+        });
     }
 
     // eslint-disable-next-line @typescript-eslint/no-unused-vars

web/src/pages/admin-overview/cards/VersionStatusCard.ts

@@ -1,20 +1,21 @@
 import { gettext } from "django";
 import { customElement, html, TemplateResult } from "lit-element";
-import { Version } from "../../../api/Versions";
+import { AdminApi, Version } from "../../../api";
+import { DEFAULT_CONFIG } from "../../../api/Config";
 import { AdminStatusCard, AdminStatus } from "./AdminStatusCard";
 
 @customElement("ak-admin-status-version")
 export class VersionStatusCard extends AdminStatusCard<Version> {
 
     getPrimaryValue(): Promise<Version> {
-        return Version.get();
+        return new AdminApi(DEFAULT_CONFIG).adminVersionList({});
     }
 
     getStatus(value: Version): Promise<AdminStatus> {
         if (value.outdated) {
             return Promise.resolve<AdminStatus>({
                 icon: "fa fa-exclamation-triangle pf-m-warning",
-                message: gettext(`${value.version_latest} is available!`),
+                message: gettext(`${value.versionLatest} is available!`),
             });
         } else {
             return Promise.resolve<AdminStatus>({
@@ -25,7 +26,7 @@ export class VersionStatusCard extends AdminStatusCard<Version> {
     }
 
     renderValue(): TemplateResult {
-        return html`${this.value?.version_current}`;
+        return html`${this.value?.versionCurrent}`;
     }
 
 }

web/src/pages/admin-overview/cards/WorkerStatusCard.ts

@@ -1,14 +1,15 @@
 import { gettext } from "django";
 import { customElement } from "lit-element";
-import { DefaultClient, AKResponse } from "../../../api/Client";
+import { AdminApi } from "../../../api";
+import { DEFAULT_CONFIG } from "../../../api/Config";
 import { AdminStatus, AdminStatusCard } from "./AdminStatusCard";
 
 @customElement("ak-admin-status-card-workers")
 export class WorkersStatusCard extends AdminStatusCard<number> {
 
     getPrimaryValue(): Promise<number> {
-        return DefaultClient.fetch<AKResponse<number>>(["admin", "workers"]).then((r) => {
-            return r.pagination.count;
+        return new AdminApi(DEFAULT_CONFIG).adminWorkersList({}).then((workers) => {
+            return workers.pagination.count;
         });
     }