web/admin: auto-prefill user path for new users based on selected path (#12070)

web/admin: auto-select user path based on selected path

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

web/src/admin/users/UserForm.ts

@@ -20,6 +20,9 @@ export class UserForm extends ModelForm<User, number> {
     @property({ attribute: false })
     group?: Group;
 
+    @property()
+    defaultPath: string = "users";
+
     static get defaultUserAttributes(): { [key: string]: unknown } {
         return {};
     }
@@ -172,7 +175,7 @@ export class UserForm extends ModelForm<User, number> {
             <ak-form-element-horizontal label=${msg("Path")} ?required=${true} name="path">
                 <input
                     type="text"
-                    value="${first(this.instance?.path, "users")}"
+                    value="${first(this.instance?.path, this.defaultPath)}"
                     class="pf-c-form-control"
                     required
                 />

web/src/admin/users/UserListPage.ts

@@ -395,7 +395,7 @@ export class UserListPage extends WithBrandConfig(WithCapabilitiesConfig(TablePa
             <ak-forms-modal>
                 <span slot="submit"> ${msg("Create")} </span>
                 <span slot="header"> ${msg("Create User")} </span>
-                <ak-user-form slot="form"> </ak-user-form>
+                <ak-user-form defaultPath=${this.activePath} slot="form"> </ak-user-form>
                 <button slot="trigger" class="pf-c-button pf-m-primary">${msg("Create")}</button>
             </ak-forms-modal>
             <ak-forms-modal .closeAfterSuccessfulSubmit=${false} .cancelText=${msg("Close")}>
@@ -417,6 +417,9 @@ export class UserListPage extends WithBrandConfig(WithCapabilitiesConfig(TablePa
                     <ak-treeview
                         .items=${this.userPaths?.paths || []}
                         activePath=${this.activePath}
+                        @ak-refresh=${(ev: CustomEvent<{ path: string }>) => {
+                            this.activePath = ev.detail.path;
+                        }}
                     ></ak-treeview>
                 </div>
             </div>

web/src/elements/TreeView.ts

@@ -89,6 +89,9 @@ export class TreeViewNode extends AKElement {
                                 new CustomEvent(EVENT_REFRESH, {
                                     bubbles: true,
                                     composed: true,
+                                    detail: {
+                                        path: this.fullPath,
+                                    },
                                 }),
                             );
                         }}