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 {
EVENT_API_DRAWER_TOGGLE,
EVENT_NOTIFICATION_DRAWER_TOGGLE,
EVENT_REFRESH,
EVENT_SIDEBAR_TOGGLE,
TITLE_DEFAULT,
} from "../constants";
@ -90,14 +91,11 @@ 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``;
constructor() {
super();
window.addEventListener(EVENT_REFRESH, () => {
this.firstUpdated();
});
}
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 {
return html`<button
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 AKGlobal from "../../authentik.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 { showMessage } from "../messages/MessageContainer";
import { MessageLevel } from "../messages/Message";
@ -114,6 +114,12 @@ export class NotificationDrawer extends LitElement {
})
.then(() => {
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`,
});
this.firstUpdated();
this.dispatchEvent(
new CustomEvent(EVENT_REFRESH, {
bubbles: true,
composed: true,
}),
);
});
}}
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/notifications/NotificationDrawer";
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 { DEFAULT_CONFIG, tenant } from "../api/Config";
import { WebsocketClient } from "../common/ws";
@ -91,7 +95,13 @@ export class UserInterface extends LitElement {
window.addEventListener(EVENT_API_DRAWER_TOGGLE, () => {
this.apiDrawerOpen = !this.apiDrawerOpen;
});
window.addEventListener(EVENT_REFRESH, () => {
this.firstUpdated();
});
tenant().then((tenant) => (this.tenant = tenant));
}
firstUpdated(): void {
new EventsApi(DEFAULT_CONFIG)
.eventsNotificationsList({
seen: false,