trustchain-oc1-orchestral
/
authentik
Archived
10
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web/elements: add spinner when loading dynamic routes 

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2022-06-18 13:36:18 +02:00
parent 7caac1d0c7
commit cdf88e4477
3 changed files with 11 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
web/src/elements/router/Route.ts
View File

@ -1,6 +1,8 @@
import { TemplateResult, html } from "lit"; import { TemplateResult, html } from "lit";
import { until } from "lit/directives/until.js"; import { until } from "lit/directives/until.js";
import "../EmptyState";
export const SLUG_REGEX = "[-a-zA-Z0-9_]+"; export const SLUG_REGEX = "[-a-zA-Z0-9_]+";
export const ID_REGEX = "\\d+"; export const ID_REGEX = "\\d+";
export const UUID_REGEX = "[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}"; export const UUID_REGEX = "[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}";
@ -47,7 +49,10 @@ export class Route {
render(args: RouteArgs): TemplateResult { render(args: RouteArgs): TemplateResult {
if (this.callback) { if (this.callback) {
return html`${until(this.callback(args))}`; return html`${until(
this.callback(args),
html`<ak-empty-state ?loading=${true}></ak-empty-state>`,
)}`;
} }
if (this.element) { if (this.element) {
return this.element; return this.element;

9
web/src/elements/router/RouterOutlet.ts
View File

@ -103,12 +103,11 @@ export class RouterOutlet extends LitElement {
}); });
if (!matchedRoute) { if (!matchedRoute) {
console.debug(`authentik/router: route "${activeUrl}" not defined`); console.debug(`authentik/router: route "${activeUrl}" not defined`);
const route = new Route( const route = new Route(RegExp(""), async () => {
RegExp(""), return html`<div class="pf-c-page__main">
html`<div class="pf-c-page__main">
<ak-router-404 url=${activeUrl}></ak-router-404> <ak-router-404 url=${activeUrl}></ak-router-404>
</div>`, </div>`;
); });
matchedRoute = new RouteMatch(route); matchedRoute = new RouteMatch(route);
matchedRoute.arguments = route.url.exec(activeUrl)?.groups || {}; matchedRoute.arguments = route.url.exec(activeUrl)?.groups || {};
matchedRoute.fullUrl = activeUrl; matchedRoute.fullUrl = activeUrl;

2
web/src/interfaces/UserInterface.ts
View File

@ -53,7 +53,7 @@ export class UserInterface extends LitElement {
tenant: CurrentTenant = DefaultTenant; tenant: CurrentTenant = DefaultTenant;
@property({ type: Number }) @property({ type: Number })
notificationsCount = -1; notificationsCount = 0;
static get styles(): CSSResult[] { static get styles(): CSSResult[] {
return [ return [