From 4525a43e63fae05e70d6c639972c1d322f305e68 Mon Sep 17 00:00:00 2001 From: Jens Langhammer Date: Sat, 20 Mar 2021 16:37:31 +0100 Subject: [PATCH] web: add initial user view page with consent Signed-off-by: Jens Langhammer --- web/src/elements/user/UserConsentList.ts | 55 +++++++++++ web/src/interfaces/AdminInterface.ts | 2 +- .../pages/applications/ApplicationViewPage.ts | 4 +- web/src/pages/users/UserListPage.ts | 4 +- web/src/pages/users/UserViewPage.ts | 96 +++++++++++++++++++ web/src/routes.ts | 12 ++- 6 files changed, 164 insertions(+), 9 deletions(-) create mode 100644 web/src/elements/user/UserConsentList.ts create mode 100644 web/src/pages/users/UserViewPage.ts diff --git a/web/src/elements/user/UserConsentList.ts b/web/src/elements/user/UserConsentList.ts new file mode 100644 index 000000000..921bb43ef --- /dev/null +++ b/web/src/elements/user/UserConsentList.ts @@ -0,0 +1,55 @@ +import { gettext } from "django"; +import { customElement, html, property, TemplateResult } from "lit-element"; +import { AKResponse } from "../../api/Client"; +import { Table, TableColumn } from "../table/Table"; + +import "../forms/DeleteForm"; +import { PAGE_SIZE } from "../../constants"; +import { CoreApi, UserConsent } from "authentik-api"; +import { DEFAULT_CONFIG } from "../../api/Config"; + +@customElement("ak-user-consent-list") +export class UserConsentList extends Table { + @property() + userId?: string; + + apiEndpoint(page: number): Promise> { + return new CoreApi(DEFAULT_CONFIG).coreUserConsentList({ + user: this.userId, + ordering: "expires", + page: page, + pageSize: PAGE_SIZE, + }); + } + + order = "-expires"; + + columns(): TableColumn[] { + return [ + new TableColumn("Application", "application"), + new TableColumn("Expires", "expires"), + new TableColumn(""), + ]; + } + + row(item: UserConsent): TemplateResult[] { + return [ + html`${item.application.name}`, + html`${item.expires?.toLocaleString()}`, + html` + { + return new CoreApi(DEFAULT_CONFIG).coreUserConsentDelete({ + id: item.pk || 0, + }); + }}> + + `, + ]; + } + +} diff --git a/web/src/interfaces/AdminInterface.ts b/web/src/interfaces/AdminInterface.ts index 68322fba2..9a9821fdc 100644 --- a/web/src/interfaces/AdminInterface.ts +++ b/web/src/interfaces/AdminInterface.ts @@ -51,7 +51,7 @@ export const SIDEBAR_ITEMS: SidebarItem[] = [ return me().then(u => u.isSuperuser||false); }), new SidebarItem("Identity & Cryptography").children( - new SidebarItem("User", "/identity/users"), + new SidebarItem("User", "/identity/users").activeWhen(`^/identity/users/(?${ID_REGEX})$`), new SidebarItem("Groups", "/identity/groups"), new SidebarItem("Certificates", "/crypto/certificates"), new SidebarItem("Tokens", "/core/tokens"), diff --git a/web/src/pages/applications/ApplicationViewPage.ts b/web/src/pages/applications/ApplicationViewPage.ts index a3992f292..c4a663dcf 100644 --- a/web/src/pages/applications/ApplicationViewPage.ts +++ b/web/src/pages/applications/ApplicationViewPage.ts @@ -78,9 +78,9 @@ export class ApplicationViewPage extends LitElement {
${gettext("Logins over the last 24 hours")}
- ${this.application ? html` + ${this.application && html` - `: ""} + `}
diff --git a/web/src/pages/users/UserListPage.ts b/web/src/pages/users/UserListPage.ts index 1b600e380..1b0f5e14b 100644 --- a/web/src/pages/users/UserListPage.ts +++ b/web/src/pages/users/UserListPage.ts @@ -52,10 +52,10 @@ export class UserListPage extends TablePage { row(item: User): TemplateResult[] { return [ - html``, + `, html`${item.isActive ? "Yes" : "No"}`, html`${item.lastLogin?.toLocaleString()}`, html` diff --git a/web/src/pages/users/UserViewPage.ts b/web/src/pages/users/UserViewPage.ts new file mode 100644 index 000000000..64cb95369 --- /dev/null +++ b/web/src/pages/users/UserViewPage.ts @@ -0,0 +1,96 @@ +import { gettext } from "django"; +import { CSSResult, customElement, html, property, TemplateResult } from "lit-element"; + +import PFPage from "@patternfly/patternfly/components/Page/page.css"; +import PFContent from "@patternfly/patternfly/components/Content/content.css"; +import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css"; +import PFCard from "@patternfly/patternfly/components/Card/card.css"; +import PFDescriptionList from "@patternfly/patternfly/components/DescriptionList/description-list.css"; +import PFSizing from "@patternfly/patternfly/utilities/Sizing/sizing.css"; +import PFFlex from "@patternfly/patternfly/utilities/Flex/flex.css"; +import PFDisplay from "@patternfly/patternfly/utilities/Display/display.css"; +import AKGlobal from "../../authentik.css"; +import PFBase from "@patternfly/patternfly/patternfly-base.css"; + +import "../../elements/buttons/ModalButton"; +import "../../elements/buttons/SpinnerButton"; +import "../../elements/CodeMirror"; +import "../../elements/Tabs"; +import "../../elements/events/ObjectChangelog"; +import "../../elements/user/UserConsentList"; +import { Page } from "../../elements/Page"; +import { CoreApi, User } from "authentik-api"; +import { DEFAULT_CONFIG } from "../../api/Config"; + +@customElement("ak-user-view") +export class UserViewPage extends Page { + pageTitle(): string { + return gettext(`User ${this.user?.username || ""}`); + } + pageDescription(): string | undefined { + return; + } + pageIcon(): string { + return "pf-icon pf-icon-integration"; + } + + @property({ type: Number }) + set userId(id: number) { + new CoreApi(DEFAULT_CONFIG).coreUsersRead({ + id: id, + }).then((user) => { + this.user = user; + }); + } + + @property({ attribute: false }) + user?: User; + + static get styles(): CSSResult[] { + return [PFBase, PFPage, PFFlex, PFDisplay, PFGallery, PFContent, PFCard, PFDescriptionList, PFSizing, AKGlobal]; + } + + constructor() { + super(); + this.addEventListener("ak-refresh", () => { + if (!this.user?.pk) return; + this.userId = this.user?.pk; + }); + } + + renderContent(): TemplateResult { + if (!this.user) { + return html``; + } + return html` +
+
+
+
${gettext("Logins over the last 24 hours")}
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+ + +
+
+
+ `; + } +} diff --git a/web/src/routes.ts b/web/src/routes.ts index 80ee521dc..da761ce70 100644 --- a/web/src/routes.ts +++ b/web/src/routes.ts @@ -11,6 +11,7 @@ import "./pages/events/RuleListPage"; import "./pages/events/TransportListPage"; import "./pages/flows/FlowListPage"; import "./pages/flows/FlowViewPage"; +import "./pages/generic/SiteShell"; import "./pages/groups/GroupListPage"; import "./pages/LibraryPage"; import "./pages/outposts/OutpostListPage"; @@ -21,14 +22,14 @@ import "./pages/providers/ProviderListPage"; import "./pages/providers/ProviderViewPage"; import "./pages/sources/SourcesListPage"; import "./pages/sources/SourceViewPage"; -import "./pages/stages/StageListPage"; import "./pages/stages/InvitationListPage"; import "./pages/stages/PromptListPage"; +import "./pages/stages/StageListPage"; import "./pages/system-tasks/SystemTaskListPage"; import "./pages/tokens/TokenListPage"; import "./pages/users/UserListPage"; +import "./pages/users/UserViewPage"; import "./pages/users/UserSettingsPage"; -import "./pages/generic/SiteShell"; export const ROUTES: Route[] = [ // Prevent infinite Shell loops @@ -49,10 +50,14 @@ export const ROUTES: Route[] = [ new Route(new RegExp(`^/core/sources/(?${SLUG_REGEX})$`)).then((args) => { return html``; }), + new Route(new RegExp("^/core/property-mappings$"), html``), + new Route(new RegExp("^/core/tokens$"), html``), new Route(new RegExp("^/policy/policies$"), html``), new Route(new RegExp("^/identity/groups$"), html``), new Route(new RegExp("^/identity/users$"), html``), - new Route(new RegExp("^/core/tokens$"), html``), + new Route(new RegExp(`^/identity/users/(?${ID_REGEX})$`)).then((args) => { + return html``; + }), new Route(new RegExp("^/flow/stages/invitations$"), html``), new Route(new RegExp("^/flow/stages/prompts$"), html``), new Route(new RegExp("^/flow/stages$"), html``), @@ -66,7 +71,6 @@ export const ROUTES: Route[] = [ }), new Route(new RegExp("^/events/transports$"), html``), new Route(new RegExp("^/events/rules$"), html``), - new Route(new RegExp("^/core/property-mappings$"), html``), new Route(new RegExp("^/outpost/outposts$"), html``), new Route(new RegExp("^/outpost/service-connections$"), html``), new Route(new RegExp("^/crypto/certificates$"), html``),