web: add flow and policy cache card

This commit is contained in:
Jens Langhammer
2020-12-16 22:25:44 +01:00
parent cf46ee06b7
commit 885a2f0a58
6 changed files with 103 additions and 69 deletions

View File

@ -41,6 +41,17 @@ export class AdminOverviewPage extends LitElement {
<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>
</ak-aggregate-card>
<ak-admin-status-card-provider class="pf-l-gallery__item pf-m-4-col" icon="pf-icon pf-icon-plugged" header="Providers" headerLink="#/administration/providers/">
</ak-admin-status-card-provider>
<ak-admin-status-card-policy-unbound class="pf-l-gallery__item pf-m-4-col" icon="pf-icon pf-icon-infrastructure" header="Policies" headerLink="#/administration/policies/">
</ak-admin-status-card-policy-unbound>
<ak-aggregate-card-promise
icon="pf-icon pf-icon-user"
header="Users"
headerLink="#/administration/users/"
.promise=${this.users}>
</ak-aggregate-card-promise>
<!-- Version card -->
<ak-aggregate-card class="pf-l-gallery__item pf-m-4-col" icon="pf-icon pf-icon-server" header="Workers">
${this.data ?
this.data?.worker_count < 1 ?
@ -53,16 +64,10 @@ export class AdminOverviewPage extends LitElement {
</p>`
: html`<ak-spinner size=${SpinnerSize.Large}></ak-spinner>`}
</ak-aggregate-card>
<ak-admin-status-card-provider class="pf-l-gallery__item pf-m-4-col" icon="pf-icon pf-icon-plugged" header="Providers" headerLink="#/administration/providers/">
</ak-admin-status-card-provider>
<ak-admin-status-card-policy class="pf-l-gallery__item pf-m-4-col" icon="pf-icon pf-icon-plugged" header="Policies" headerLink="#/administration/policies/">
</ak-admin-status-card-policy>
<ak-aggregate-card-promise
icon="pf-icon pf-icon-user"
header="Users"
headerLink="#/administration/users/"
.promise=${this.users}>
</ak-aggregate-card-promise>
<ak-admin-status-card-policy-cache class="pf-l-gallery__item pf-m-4-col" icon="pf-icon pf-icon-server" header="Cached Policies">
</ak-admin-status-card-policy-cache>
<ak-admin-status-card-flow-cache class="pf-l-gallery__item pf-m-4-col" icon="pf-icon pf-icon-server" header="Cached Flows">
</ak-admin-status-card-flow-cache>
</div>
</section>`;
}

View File

@ -2,6 +2,7 @@ import { gettext } from "django";
import { customElement, property } from "lit-element";
import { html, TemplateResult } from "lit-html";
import { until } from "lit-html/directives/until";
import { Flow } from "../../api/flow";
import { Policy } from "../../api/policy";
import { Provider } from "../../api/provider";
import { AggregateCard } from "../../elements/cards/AggregateCard";
@ -62,8 +63,8 @@ export class ProviderStatusCard extends AdminStatusCard {
}
@customElement("ak-admin-status-card-policy")
export class PolicyStatusCard extends AdminStatusCard {
@customElement("ak-admin-status-card-policy-unbound")
export class PolicyUnboundStatusCard extends AdminStatusCard {
getPrimaryCounter(): Promise<number> {
return Policy.list({
@ -88,3 +89,65 @@ export class PolicyStatusCard extends AdminStatusCard {
}
}
@customElement("ak-admin-status-card-policy-cache")
export class PolicyCacheStatusCard extends AdminStatusCard {
getPrimaryCounter(): Promise<number> {
return Policy.cached();
}
getStatus(counter: number): Promise<AdminStatus> {
if (counter < 1) {
return Promise.resolve<AdminStatus>({
icon: "fa fa-exclamation-triangle",
message: gettext("No policies cached. Users may experience slow response times."),
});
} else {
return Promise.resolve<AdminStatus>({
icon: "fa fa-check-circle"
});
}
}
renderHeaderLink(): TemplateResult {
return html`<ak-modal-button href="/administration/overview/cache/policy/">
<a slot="trigger">
<i class="fa fa-trash"> </i>
</a>
<div slot="modal"></div>
</ak-modal-button>`;
}
}
@customElement("ak-admin-status-card-flow-cache")
export class FlowCacheStatusCard extends AdminStatusCard {
getPrimaryCounter(): Promise<number> {
return Flow.cached();
}
getStatus(counter: number): Promise<AdminStatus> {
if (counter < 1) {
return Promise.resolve<AdminStatus>({
icon: "fa fa-exclamation-triangle",
message: gettext("No flows cached."),
});
} else {
return Promise.resolve<AdminStatus>({
icon: "fa fa-check-circle"
});
}
}
renderHeaderLink(): TemplateResult {
return html`<ak-modal-button href="/administration/overview/cache/flow/">
<a slot="trigger">
<i class="fa fa-trash"> </i>
</a>
<div slot="modal"></div>
</ak-modal-button>`;
}
}