web/admin: add UI to copy invitation link
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
		| @ -2086,6 +2086,10 @@ msgstr "Link to a user with identical email address. Can have security implicati | ||||
| msgid "Link to a user with identical username address. Can have security implications when a username is used with another source." | ||||
| msgstr "Link to a user with identical username address. Can have security implications when a username is used with another source." | ||||
|  | ||||
| #: src/pages/stages/invitation/InvitationListLink.ts | ||||
| msgid "Link to use the invitation." | ||||
| msgstr "Link to use the invitation." | ||||
|  | ||||
| #: src/pages/sources/oauth/OAuthSourceForm.ts | ||||
| #: src/pages/sources/plex/PlexSourceForm.ts | ||||
| msgid "Link users on unique identifier" | ||||
| @ -2174,6 +2178,7 @@ msgstr "Loading" | ||||
| #: src/pages/stages/identification/IdentificationStageForm.ts | ||||
| #: src/pages/stages/identification/IdentificationStageForm.ts | ||||
| #: src/pages/stages/identification/IdentificationStageForm.ts | ||||
| #: src/pages/stages/invitation/InvitationListLink.ts | ||||
| #: src/pages/stages/password/PasswordStageForm.ts | ||||
| #: src/pages/stages/prompt/PromptStageForm.ts | ||||
| #: src/pages/stages/prompt/PromptStageForm.ts | ||||
| @ -3274,6 +3279,10 @@ msgstr "Select a provider that this application should use. Alternatively, creat | ||||
| msgid "Select all rows" | ||||
| msgstr "Select all rows" | ||||
|  | ||||
| #: src/pages/stages/invitation/InvitationListLink.ts | ||||
| msgid "Select an enrollment flow" | ||||
| msgstr "Select an enrollment flow" | ||||
|  | ||||
| #: src/flows/stages/authenticator_validate/AuthenticatorValidateStage.ts | ||||
| msgid "Select an identification method." | ||||
| msgstr "Select an identification method." | ||||
|  | ||||
| @ -2078,6 +2078,10 @@ msgstr "" | ||||
| msgid "Link to a user with identical username address. Can have security implications when a username is used with another source." | ||||
| msgstr "" | ||||
|  | ||||
| #: src/pages/stages/invitation/InvitationListLink.ts | ||||
| msgid "Link to use the invitation." | ||||
| msgstr "" | ||||
|  | ||||
| #: src/pages/sources/oauth/OAuthSourceForm.ts | ||||
| #: src/pages/sources/plex/PlexSourceForm.ts | ||||
| msgid "Link users on unique identifier" | ||||
| @ -2166,6 +2170,7 @@ msgstr "" | ||||
| #: src/pages/stages/identification/IdentificationStageForm.ts | ||||
| #: src/pages/stages/identification/IdentificationStageForm.ts | ||||
| #: src/pages/stages/identification/IdentificationStageForm.ts | ||||
| #: src/pages/stages/invitation/InvitationListLink.ts | ||||
| #: src/pages/stages/password/PasswordStageForm.ts | ||||
| #: src/pages/stages/prompt/PromptStageForm.ts | ||||
| #: src/pages/stages/prompt/PromptStageForm.ts | ||||
| @ -3266,6 +3271,10 @@ msgstr "" | ||||
| msgid "Select all rows" | ||||
| msgstr "" | ||||
|  | ||||
| #: src/pages/stages/invitation/InvitationListLink.ts | ||||
| msgid "Select an enrollment flow" | ||||
| msgstr "" | ||||
|  | ||||
| #: src/flows/stages/authenticator_validate/AuthenticatorValidateStage.ts | ||||
| msgid "Select an identification method." | ||||
| msgstr "" | ||||
|  | ||||
							
								
								
									
										67
									
								
								web/src/pages/stages/invitation/InvitationListLink.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										67
									
								
								web/src/pages/stages/invitation/InvitationListLink.ts
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,67 @@ | ||||
| import { t } from "@lingui/macro"; | ||||
| import { CSSResult, customElement, html, LitElement, property, TemplateResult } from "lit-element"; | ||||
| import { until } from "lit-html/directives/until"; | ||||
| import PFForm from "@patternfly/patternfly/components/Form/form.css"; | ||||
| import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css"; | ||||
| import AKGlobal from "../../../authentik.css"; | ||||
| import PFBase from "@patternfly/patternfly/patternfly-base.css"; | ||||
| import PFFlex from "@patternfly/patternfly/layouts/Flex/flex.css"; | ||||
| import { FlowsApi, FlowsInstancesListDesignationEnum } from "authentik-api"; | ||||
| import { DEFAULT_CONFIG } from "../../../api/Config"; | ||||
| import PFDescriptionList from "@patternfly/patternfly/components/DescriptionList/description-list.css"; | ||||
|  | ||||
| @customElement("ak-stage-invitation-list-link") | ||||
| export class InvitationListLink extends LitElement { | ||||
|  | ||||
|     @property() | ||||
|     invitation?: string | ||||
|  | ||||
|     @property() | ||||
|     selectedFlow?: string; | ||||
|  | ||||
|     static get styles(): CSSResult[] { | ||||
|         return [PFBase, PFForm, PFFormControl, PFFlex, PFDescriptionList, AKGlobal]; | ||||
|     } | ||||
|  | ||||
|     renderLink(): string { | ||||
|         return `${window.location.protocol}//${window.location.host}/if/flow/${this.selectedFlow}/?token=${this.invitation}`; | ||||
|     } | ||||
|  | ||||
|     render(): TemplateResult { | ||||
|         return html`<dl class="pf-c-description-list pf-m-horizontal"> | ||||
|             <div class="pf-c-description-list__group"> | ||||
|                 <dt class="pf-c-description-list__term"> | ||||
|                     <span class="pf-c-description-list__text">${t`Select an enrollment flow`}</span> | ||||
|                 </dt> | ||||
|                 <dd class="pf-c-description-list__description"> | ||||
|                     <div class="pf-c-description-list__text"> | ||||
|                         <select class="pf-c-form-control" @change=${(ev: Event) => { | ||||
|                             const current = (ev.target as HTMLInputElement).value; | ||||
|                             this.selectedFlow = current; | ||||
|                         }}> | ||||
|                             ${until(new FlowsApi(DEFAULT_CONFIG).flowsInstancesList({ | ||||
|                                 ordering: "pk", | ||||
|                                 designation: FlowsInstancesListDesignationEnum.Enrollment, | ||||
|                             }).then(flows => { | ||||
|                                 return flows.results.map(flow => { | ||||
|                                     return html`<option value=${flow.slug} ?selected=${flow.slug === this.selectedFlow}>${flow.slug}</option>`; | ||||
|                                 }); | ||||
|                             }), html`<option>${t`Loading...`}</option>`)} | ||||
|                         </select> | ||||
|                     </div> | ||||
|                 </dd> | ||||
|             </div> | ||||
|             <div class="pf-c-description-list__group"> | ||||
|                 <dt class="pf-c-description-list__term"> | ||||
|                     <span class="pf-c-description-list__text">${t`Link to use the invitation.`}</span> | ||||
|                 </dt> | ||||
|                 <dd class="pf-c-description-list__description"> | ||||
|                     <div class="pf-c-description-list__text"> | ||||
|                         <input class="pf-c-form-control" readonly type="text" value=${this.renderLink()} /> | ||||
|                     </div> | ||||
|                 </dd> | ||||
|             </div> | ||||
|         </dl>`; | ||||
|     } | ||||
|  | ||||
| } | ||||
| @ -8,6 +8,7 @@ import "../../../elements/buttons/SpinnerButton"; | ||||
| import "../../../elements/forms/DeleteForm"; | ||||
| import "../../../elements/forms/ModalForm"; | ||||
| import "./InvitationForm"; | ||||
| import "./InvitationListLink"; | ||||
| import { TableColumn } from "../../../elements/table/Table"; | ||||
| import { PAGE_SIZE } from "../../../constants"; | ||||
| import { Invitation, StagesApi } from "authentik-api"; | ||||
| @ -15,6 +16,8 @@ import { DEFAULT_CONFIG } from "../../../api/Config"; | ||||
|  | ||||
| @customElement("ak-stage-invitation-list") | ||||
| export class InvitationListPage extends TablePage<Invitation> { | ||||
|     expandable = true; | ||||
|  | ||||
|     searchEnabled(): boolean { | ||||
|         return true; | ||||
|     } | ||||
| @ -75,6 +78,18 @@ export class InvitationListPage extends TablePage<Invitation> { | ||||
|         ]; | ||||
|     } | ||||
|  | ||||
|     renderExpanded(item: Invitation): TemplateResult { | ||||
|         return html` | ||||
|         <td role="cell" colspan="3"> | ||||
|             <div class="pf-c-table__expandable-row-content"> | ||||
|                 <ak-stage-invitation-list-link invitation=${item.pk}></ak-stage-invitation-list-link> | ||||
|             </div> | ||||
|         </td> | ||||
|         <td></td> | ||||
|         <td></td> | ||||
|         <td></td>`; | ||||
|     } | ||||
|  | ||||
|     renderToolbar(): TemplateResult { | ||||
|         return html` | ||||
|         <ak-forms-modal> | ||||
|  | ||||
		Reference in New Issue
	
	Block a user
	 Jens Langhammer
					Jens Langhammer