web: fix notification badge not refreshing after clearing notifications

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-09-19 21:58:59 +02:00
parent 1670ec9167
commit 879b5ead71
3 changed files with 40 additions and 10 deletions

View File

@ -15,6 +15,7 @@ import PFButton from "@patternfly/patternfly/components/Button/button.css";
import { import {
EVENT_API_DRAWER_TOGGLE, EVENT_API_DRAWER_TOGGLE,
EVENT_NOTIFICATION_DRAWER_TOGGLE, EVENT_NOTIFICATION_DRAWER_TOGGLE,
EVENT_REFRESH,
EVENT_SIDEBAR_TOGGLE, EVENT_SIDEBAR_TOGGLE,
TITLE_DEFAULT, TITLE_DEFAULT,
} from "../constants"; } from "../constants";
@ -90,14 +91,11 @@ export class PageHeader extends LitElement {
]; ];
} }
renderIcon(): TemplateResult { constructor() {
if (this.icon) { super();
if (this.iconImage) { window.addEventListener(EVENT_REFRESH, () => {
return html`<img class="pf-icon" src="${this.icon}" />&nbsp;`; this.firstUpdated();
} });
return html`<i class=${this.icon}></i>&nbsp;`;
}
return html``;
} }
firstUpdated(): void { firstUpdated(): void {
@ -112,6 +110,16 @@ export class PageHeader extends LitElement {
}); });
} }
renderIcon(): TemplateResult {
if (this.icon) {
if (this.iconImage) {
return html`<img class="pf-icon" src="${this.icon}" />&nbsp;`;
}
return html`<i class=${this.icon}></i>&nbsp;`;
}
return html``;
}
render(): TemplateResult { render(): TemplateResult {
return html`<button return html`<button
class="sidebar-trigger pf-c-button pf-m-plain" class="sidebar-trigger pf-c-button pf-m-plain"

View File

@ -17,7 +17,7 @@ import PFDropdown from "@patternfly/patternfly/components/Dropdown/dropdown.css"
import PFButton from "@patternfly/patternfly/components/Button/button.css"; import PFButton from "@patternfly/patternfly/components/Button/button.css";
import AKGlobal from "../../authentik.css"; import AKGlobal from "../../authentik.css";
import PFContent from "@patternfly/patternfly/components/Content/content.css"; import PFContent from "@patternfly/patternfly/components/Content/content.css";
import { EVENT_NOTIFICATION_DRAWER_TOGGLE } from "../../constants"; import { EVENT_NOTIFICATION_DRAWER_TOGGLE, EVENT_REFRESH } from "../../constants";
import { ActionToLabel } from "../../pages/events/utils"; import { ActionToLabel } from "../../pages/events/utils";
import { showMessage } from "../messages/MessageContainer"; import { showMessage } from "../messages/MessageContainer";
import { MessageLevel } from "../messages/Message"; import { MessageLevel } from "../messages/Message";
@ -114,6 +114,12 @@ export class NotificationDrawer extends LitElement {
}) })
.then(() => { .then(() => {
this.firstUpdated(); this.firstUpdated();
this.dispatchEvent(
new CustomEvent(EVENT_REFRESH, {
bubbles: true,
composed: true,
}),
);
}); });
}} }}
> >
@ -174,6 +180,12 @@ export class NotificationDrawer extends LitElement {
message: t`Successfully cleared notifications`, message: t`Successfully cleared notifications`,
}); });
this.firstUpdated(); this.firstUpdated();
this.dispatchEvent(
new CustomEvent(EVENT_REFRESH, {
bubbles: true,
composed: true,
}),
);
}); });
}} }}
class="pf-c-button pf-m-secondary pf-m-block" class="pf-c-button pf-m-secondary pf-m-block"

View File

@ -26,7 +26,11 @@ import "../elements/router/RouterOutlet";
import "../elements/messages/MessageContainer"; import "../elements/messages/MessageContainer";
import "../elements/notifications/NotificationDrawer"; import "../elements/notifications/NotificationDrawer";
import "../elements/sidebar/Sidebar"; import "../elements/sidebar/Sidebar";
import { EVENT_API_DRAWER_TOGGLE, EVENT_NOTIFICATION_DRAWER_TOGGLE } from "../constants"; import {
EVENT_API_DRAWER_TOGGLE,
EVENT_NOTIFICATION_DRAWER_TOGGLE,
EVENT_REFRESH,
} from "../constants";
import { CurrentTenant, EventsApi } from "@goauthentik/api"; import { CurrentTenant, EventsApi } from "@goauthentik/api";
import { DEFAULT_CONFIG, tenant } from "../api/Config"; import { DEFAULT_CONFIG, tenant } from "../api/Config";
import { WebsocketClient } from "../common/ws"; import { WebsocketClient } from "../common/ws";
@ -91,7 +95,13 @@ export class UserInterface extends LitElement {
window.addEventListener(EVENT_API_DRAWER_TOGGLE, () => { window.addEventListener(EVENT_API_DRAWER_TOGGLE, () => {
this.apiDrawerOpen = !this.apiDrawerOpen; this.apiDrawerOpen = !this.apiDrawerOpen;
}); });
window.addEventListener(EVENT_REFRESH, () => {
this.firstUpdated();
});
tenant().then((tenant) => (this.tenant = tenant)); tenant().then((tenant) => (this.tenant = tenant));
}
firstUpdated(): void {
new EventsApi(DEFAULT_CONFIG) new EventsApi(DEFAULT_CONFIG)
.eventsNotificationsList({ .eventsNotificationsList({
seen: false, seen: false,