Skip to content

Commit 4e4b102

Browse files
GirlBossRushGirlBossRush
committed
Migrate remaining view pages to modalInvoker, add e2e coverage.
1 parent fc4f856 commit 4e4b102

15 files changed

Lines changed: 321 additions & 170 deletions

File tree

‎web/src/admin/endpoints/devices/DeviceForm.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@ import { ifDefined } from "lit/directives/if-defined.js";
2020

2121
@customElement("ak-endpoints-device-form")
2222
export class EndpointDeviceForm extends ModelForm<EndpointDevice, string> {
23+
public static override verboseName = msg("Device");
24+
public static override verboseNamePlural = msg("Devices");
2325
loadInstance(pk: string): Promise<EndpointDevice> {
2426
return new EndpointsApi(DEFAULT_CONFIG).endpointsDevicesRetrieve({
2527
deviceUuid: pk,

‎web/src/admin/endpoints/devices/DeviceListPage.ts‎

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
import "#elements/cards/AggregateCard";
22
import "#elements/forms/DeleteBulkForm";
3-
import "#admin/endpoints/devices/DeviceForm";
43
import "#admin/endpoints/devices/DeviceAddHowTo";
5-
import "#elements/forms/ModalForm";
64

75
import { DEFAULT_CONFIG } from "#common/api/config";
86

7+
import { modalInvoker } from "#elements/dialogs";
98
import { PaginatedResponse, TableColumn, Timestamp } from "#elements/table/Table";
109
import { TablePage } from "#elements/table/TablePage";
1110
import { SlottedTemplateResult } from "#elements/types";
1211

12+
import { EndpointDeviceForm } from "#admin/endpoints/devices/DeviceForm";
13+
1314
import { DeviceSummary, EndpointDevice, EndpointsApi } from "@goauthentik/api";
1415

1516
import { msg } from "@lit/localize";
@@ -132,17 +133,14 @@ export class DeviceListPage extends TablePage<EndpointDevice> {
132133
html`${item.facts.data.os?.name} ${item.facts.data.os?.version}`,
133134
html`${item.accessGroupObj?.name || "-"}`,
134135
item.facts.created ? Timestamp(item.facts.created) : html`-`,
135-
html`<ak-forms-modal>
136-
<span slot="submit">${msg("Save Changes")}</span>
137-
<span slot="header">${msg("Update Device")}</span>
138-
<ak-endpoints-device-form slot="form" .instancePk=${item.deviceUuid}>
139-
</ak-endpoints-device-form>
140-
<button slot="trigger" class="pf-c-button pf-m-plain">
141-
<pf-tooltip position="top" content=${msg("Edit")}>
142-
<i class="fas fa-edit" aria-hidden="true"></i>
143-
</pf-tooltip>
144-
</button>
145-
</ak-forms-modal>`,
136+
html`<button
137+
class="pf-c-button pf-m-plain"
138+
${modalInvoker(EndpointDeviceForm, { instancePk: item.deviceUuid })}
139+
>
140+
<pf-tooltip position="top" content=${msg("Edit")}>
141+
<i class="fas fa-edit" aria-hidden="true"></i>
142+
</pf-tooltip>
143+
</button>`,
146144
];
147145
}
148146

‎web/src/admin/endpoints/devices/DeviceViewPage.ts‎

Lines changed: 10 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -5,20 +5,20 @@ import "#admin/endpoints/devices/facts/DeviceProcessTable";
55
import "#admin/endpoints/devices/facts/DeviceUserTable";
66
import "#admin/endpoints/devices/facts/DeviceSoftwareTable";
77
import "#admin/endpoints/devices/facts/DeviceGroupTable";
8-
import "#admin/endpoints/devices/DeviceForm";
98
import "#admin/endpoints/devices/DeviceEvents";
10-
import "#elements/forms/ModalForm";
119
import "#elements/Tabs";
1210

1311
import { DEFAULT_CONFIG } from "#common/api/config";
1412
import { APIError, parseAPIResponseError } from "#common/errors/network";
1513

1614
import { AKElement } from "#elements/Base";
15+
import { modalInvoker } from "#elements/dialogs";
1716
import { Timestamp } from "#elements/table/shared";
1817

1918
import { setPageDetails } from "#components/ak-page-navbar";
2019
import renderDescriptionList, { DescriptionPair } from "#components/DescriptionList";
2120

21+
import { EndpointDeviceForm } from "#admin/endpoints/devices/DeviceForm";
2222
import { getSize, osFamilyToLabel, trySortNumerical } from "#admin/endpoints/devices/utils";
2323

2424
import { DeviceConnection, Disk, EndpointDeviceDetails, EndpointsApi } from "@goauthentik/api";
@@ -124,18 +124,14 @@ export class DeviceViewPage extends AKElement {
124124
[msg("Device access group"), this.device?.accessGroupObj?.name ?? "-"],
125125
[
126126
msg("Actions"),
127-
html`<ak-forms-modal>
128-
<span slot="submit">${msg("Save Changes")}</span>
129-
<span slot="header">${msg("Update Device")}</span>
130-
<ak-endpoints-device-form
131-
slot="form"
132-
.instancePk=${this.device?.deviceUuid}
133-
>
134-
</ak-endpoints-device-form>
135-
<button slot="trigger" class="pf-c-button pf-m-primary">
136-
${msg("Edit")}
137-
</button>
138-
</ak-forms-modal>`,
127+
html`<button
128+
class="pf-c-button pf-m-primary"
129+
${modalInvoker(EndpointDeviceForm, {
130+
instancePk: this.device?.deviceUuid,
131+
})}
132+
>
133+
${msg("Edit")}
134+
</button>`,
139135
],
140136
],
141137
{ horizontal: true },

‎web/src/admin/flows/FlowViewPage.ts‎

Lines changed: 10 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import "#admin/flows/BoundStagesList";
22
import "#admin/flows/FlowDiagram";
3-
import "#admin/flows/FlowForm";
43
import "#admin/policies/BoundPoliciesList";
54
import "#admin/rbac/ak-rbac-object-permission-page";
65
import "#admin/events/ObjectChangelog";
@@ -11,11 +10,13 @@ import { AndNext, DEFAULT_CONFIG } from "#common/api/config";
1110
import { isResponseErrorLike } from "#common/errors/network";
1211

1312
import { AKElement } from "#elements/Base";
13+
import { modalInvoker } from "#elements/dialogs";
1414
import { SlottedTemplateResult } from "#elements/types";
1515

1616
import { setPageDetails } from "#components/ak-page-navbar";
1717
import renderDescriptionList from "#components/DescriptionList";
1818

19+
import { FlowForm } from "#admin/flows/FlowForm";
1920
import { DesignationToLabel } from "#admin/flows/utils";
2021

2122
import { Flow, FlowsApi, ModelEnum } from "@goauthentik/api";
@@ -97,21 +98,14 @@ export class FlowViewPage extends AKElement {
9798
],
9899
[
99100
msg("Related actions"),
100-
html`<ak-forms-modal>
101-
<span slot="submit">${msg("Save Changes")}</span>
102-
<span slot="header"> ${msg("Update Flow")} </span>
103-
<ak-flow-form
104-
slot="form"
105-
.instancePk=${this.flow.slug}
106-
>
107-
</ak-flow-form>
108-
<button
109-
slot="trigger"
110-
class="pf-c-button pf-m-block pf-m-secondary"
111-
>
112-
${msg("Edit")}
113-
</button>
114-
</ak-forms-modal>
101+
html`<button
102+
class="pf-c-button pf-m-block pf-m-secondary"
103+
${modalInvoker(FlowForm, {
104+
instancePk: this.flow.slug,
105+
})}
106+
>
107+
${msg("Edit")}
108+
</button>
115109
<a
116110
class="pf-c-button pf-m-block pf-m-secondary"
117111
href=${this.flow.exportUrl}

‎web/src/admin/groups/GroupViewPage.ts‎

Lines changed: 11 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import "#admin/groups/ak-group-form";
21
import "#admin/groups/RelatedUserList";
32
import "#admin/rbac/ak-rbac-object-permission-page";
43
import "#admin/roles/ak-related-role-table";
@@ -10,19 +9,21 @@ import "#elements/CodeMirror";
109
import "#elements/Tabs";
1110
import "#elements/buttons/ActionButton/index";
1211
import "#elements/buttons/SpinnerButton/index";
13-
import "#elements/forms/ModalForm";
1412
import "#elements/ak-mdx/ak-mdx";
1513

1614
import { DEFAULT_CONFIG } from "#common/api/config";
1715
import { EVENT_REFRESH } from "#common/constants";
1816

1917
import { AKElement } from "#elements/Base";
18+
import { modalInvoker } from "#elements/dialogs";
2019
import { WithLicenseSummary } from "#elements/mixins/license";
2120
import { SlottedTemplateResult } from "#elements/types";
2221

2322
import { setPageDetails } from "#components/ak-page-navbar";
2423
import renderDescriptionList from "#components/DescriptionList";
2524

25+
import { GroupForm } from "#admin/groups/ak-group-form";
26+
2627
import { ContentTypeEnum, CoreApi, Group, ModelEnum } from "@goauthentik/api";
2728

2829
import { msg, str } from "@lit/localize";
@@ -150,18 +151,14 @@ export class GroupViewPage extends WithLicenseSummary(AKElement) {
150151
],
151152
[
152153
msg("Related actions"),
153-
html`<ak-forms-modal>
154-
<span slot="submit">${msg("Save Changes")}</span>
155-
<span slot="header">${msg("Update Group")}</span>
156-
<ak-group-form slot="form" .instancePk=${this.group.pk}>
157-
</ak-group-form>
158-
<button
159-
slot="trigger"
160-
class="pf-m-primary pf-c-button pf-m-block"
161-
>
162-
${msg("Edit")}
163-
</button>
164-
</ak-forms-modal>`,
154+
html`<button
155+
class="pf-c-button pf-m-primary pf-m-block"
156+
${modalInvoker(GroupForm, {
157+
instancePk: this.group.pk,
158+
})}
159+
>
160+
${msg("Edit")}
161+
</button>`,
165162
],
166163
])}
167164
</div>

‎web/src/admin/groups/RelatedGroupList.ts‎

Lines changed: 27 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
1-
import "#admin/groups/ak-group-form";
21
import "#admin/users/ak-user-group-table";
32
import "#components/ak-status-label";
43
import "#elements/buttons/SpinnerButton/index";
54
import "#elements/forms/DeleteBulkForm";
65
import "#elements/forms/HorizontalFormElement";
7-
import "#elements/forms/ModalForm";
86
import "@patternfly/elements/pf-tooltip/pf-tooltip.js";
97

108
import { DEFAULT_CONFIG } from "#common/api/config";
119

12-
import { renderModal } from "#elements/dialogs";
10+
import { modalInvoker, renderModal } from "#elements/dialogs";
1311
import { AKFormSubmitEvent, Form } from "#elements/forms/Form";
1412
import { PaginatedResponse, Table, TableColumn } from "#elements/table/Table";
1513
import { SlottedTemplateResult } from "#elements/types";
1614

15+
import { GroupForm } from "#admin/groups/ak-group-form";
16+
1717
import { CoreApi, Group, User } from "@goauthentik/api";
1818

1919
import { msg, str } from "@lit/localize";
@@ -23,6 +23,10 @@ import { ifDefined } from "lit/directives/if-defined.js";
2323

2424
@customElement("ak-group-related-add")
2525
export class RelatedGroupAdd extends Form<{ groups: string[] }> {
26+
public static override verboseName = msg("Group");
27+
public static override submitVerb = msg("Add");
28+
public static override createLabel = msg("Add");
29+
2630
@property({ attribute: false })
2731
public user?: User;
2832

@@ -151,40 +155,33 @@ export class RelatedGroupList extends Table<Group> {
151155
return [
152156
html`<a href="#/identity/groups/${item.pk}">${item.name}</a>`,
153157
html`<ak-status-label type="neutral" ?good=${item.isSuperuser}></ak-status-label>`,
154-
html` <ak-forms-modal>
155-
<span slot="submit">${msg("Save Changes")}</span>
156-
<span slot="header">${msg("Update Group")}</span>
157-
<ak-group-form slot="form" .instancePk=${item.pk}> </ak-group-form>
158-
<button slot="trigger" class="pf-c-button pf-m-plain">
159-
<pf-tooltip position="top" content=${msg("Edit")}>
160-
<i class="fas fa-edit" aria-hidden="true"></i>
161-
</pf-tooltip>
162-
</button>
163-
</ak-forms-modal>`,
158+
html`<button
159+
class="pf-c-button pf-m-plain"
160+
${modalInvoker(GroupForm, { instancePk: item.pk })}
161+
>
162+
<pf-tooltip position="top" content=${msg("Edit")}>
163+
<i class="fas fa-edit" aria-hidden="true"></i>
164+
</pf-tooltip>
165+
</button>`,
164166
];
165167
}
166168

167169
renderToolbar(): TemplateResult {
168170
return html`
169171
${this.targetUser
170-
? html`<ak-forms-modal>
171-
<span slot="submit">${msg("Add")}</span>
172-
<span slot="header">${msg("Add Group")}</span>
173-
<ak-group-related-add .user=${this.targetUser} slot="form">
174-
</ak-group-related-add>
175-
<button slot="trigger" class="pf-c-button pf-m-primary">
176-
${msg("Add to existing group")}
177-
</button>
178-
</ak-forms-modal>`
172+
? html`<button
173+
class="pf-c-button pf-m-primary"
174+
${modalInvoker(RelatedGroupAdd, { user: this.targetUser })}
175+
>
176+
${msg("Add to existing group")}
177+
</button>`
179178
: nothing}
180-
<ak-forms-modal>
181-
<span slot="submit">${msg("Create")}</span>
182-
<span slot="header">${msg("Create Group")}</span>
183-
<ak-group-form slot="form"> </ak-group-form>
184-
<button slot="trigger" class="pf-c-button pf-m-secondary">
185-
${msg("Add new group")}
186-
</button>
187-
</ak-forms-modal>
179+
<button
180+
class="pf-c-button pf-m-secondary"
181+
${modalInvoker(GroupForm)}
182+
>
183+
${msg("Add new group")}
184+
</button>
188185
${super.renderToolbar()}
189186
`;
190187
}

‎web/src/admin/providers/oauth2/OAuth2ProviderViewPage.ts‎

Lines changed: 11 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import "#admin/providers/RelatedApplicationButton";
2-
import "#admin/providers/oauth2/OAuth2ProviderForm";
32
import "#admin/events/ObjectChangelog";
43
import "#admin/rbac/ak-rbac-object-permission-page";
54
import "#admin/rbac/ObjectPermissionModal";
@@ -15,10 +14,13 @@ import { DEFAULT_CONFIG } from "#common/api/config";
1514
import { EVENT_REFRESH } from "#common/constants";
1615

1716
import { AKElement } from "#elements/Base";
17+
import { modalInvoker } from "#elements/dialogs";
1818
import { SlottedTemplateResult } from "#elements/types";
1919

2020
import renderDescriptionList from "#components/DescriptionList";
2121

22+
import { OAuth2ProviderFormPage } from "#admin/providers/oauth2/OAuth2ProviderForm";
23+
2224
import {
2325
ClientTypeEnum,
2426
CoreApi,
@@ -238,21 +240,14 @@ export class OAuth2ProviderViewPage extends AKElement {
238240
],
239241
[
240242
msg("Related actions"),
241-
html`<ak-forms-modal>
242-
<span slot="submit">${msg("Save Changes")}</span>
243-
<span slot="header">${msg("Update OAuth2 Provider")}</span>
244-
<ak-provider-oauth2-form
245-
slot="form"
246-
.instancePk=${this.provider?.pk || 0}
247-
>
248-
</ak-provider-oauth2-form>
249-
<button
250-
slot="trigger"
251-
class="pf-c-button pf-m-primary pf-m-block"
252-
>
253-
${msg("Edit")}
254-
</button>
255-
</ak-forms-modal>`,
243+
html`<button
244+
class="pf-c-button pf-m-primary pf-m-block"
245+
${modalInvoker(OAuth2ProviderFormPage, {
246+
instancePk: this.provider?.pk || 0,
247+
})}
248+
>
249+
${msg("Edit")}
250+
</button>`,
256251
],
257252
])}
258253
</div>

‎web/src/admin/providers/ssf/SSFProviderViewPage.ts‎

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import "#admin/providers/RelatedApplicationButton";
2-
import "#admin/providers/ssf/SSFProviderFormPage";
32
import "#admin/providers/ssf/StreamTable";
43
import "#admin/events/ObjectChangelog";
54
import "#admin/rbac/ObjectPermissionModal";
@@ -14,10 +13,13 @@ import { DEFAULT_CONFIG } from "#common/api/config";
1413
import { EVENT_REFRESH } from "#common/constants";
1514

1615
import { AKElement } from "#elements/Base";
16+
import { modalInvoker } from "#elements/dialogs";
1717
import { SlottedTemplateResult } from "#elements/types";
1818

1919
import renderDescriptionList from "#components/DescriptionList";
2020

21+
import { SSFProviderFormPage } from "#admin/providers/ssf/SSFProviderFormPage";
22+
2123
import { ModelEnum, ProvidersApi, SSFProvider } from "@goauthentik/api";
2224

2325
import { msg } from "@lit/localize";
@@ -155,15 +157,14 @@ export class SSFProviderViewPage extends AKElement {
155157
],
156158
[
157159
msg("Related actions"),
158-
html`<ak-forms-modal>
159-
<span slot="submit">${msg("Save Changes")}</span>
160-
<span slot="header">${msg("Update SSF Provider")}</span>
161-
<ak-provider-ssf-form slot="form" .instancePk=${this.provider.pk}>
162-
</ak-provider-ssf-form>
163-
<button slot="trigger" class="pf-c-button pf-m-primary pf-m-block">
164-
${msg("Edit")}
165-
</button>
166-
</ak-forms-modal>`,
160+
html`<button
161+
class="pf-c-button pf-m-primary pf-m-block"
162+
${modalInvoker(SSFProviderFormPage, {
163+
instancePk: this.provider.pk,
164+
})}
165+
>
166+
${msg("Edit")}
167+
</button>`,
167168
],
168169
])}
169170
</div>

0 commit comments

Comments
 (0)