web/admin: fix policy/stage wizard label, fix connector create wizard, cleanup (#21781)

* update labels

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

* remove unused app wizard hint

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

* connector wizard should use grid

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

---------

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

web/src/admin/applications/ApplicationListPage.ts

@@ -7,7 +7,6 @@ import "#elements/forms/DeleteBulkForm";
 import "#elements/forms/ModalForm";
 import "#elements/dialogs/ak-modal";
 import "#admin/applications/ApplicationForm";
-import "#admin/applications/ApplicationWizardHint";
 
 import { DEFAULT_CONFIG } from "#common/api/config";
 

web/src/admin/applications/ApplicationWizardHint.ts

@@ -1,134 +0,0 @@
-import "#admin/applications/wizard/ak-application-wizard";
-import "#components/ak-hint/ak-hint";
-import "#components/ak-hint/ak-hint-body";
-import "#elements/Label";
-import "#elements/buttons/ActionButton/ak-action-button";
-
-import { AKElement } from "#elements/Base";
-import { getURLParam } from "#elements/router/RouteMatch";
-
-import { ShowHintController, ShowHintControllerHost } from "#components/ak-hint/ShowHintController";
-
-import { msg } from "@lit/localize";
-import { css, html } from "lit";
-import { customElement, property, state } from "lit/decorators.js";
-import { styleMap } from "lit/directives/style-map.js";
-
-import PFButton from "@patternfly/patternfly/components/Button/button.css";
-import PFLabel from "@patternfly/patternfly/components/Label/label.css";
-import PFPage from "@patternfly/patternfly/components/Page/page.css";
-
-const closeButtonIcon = html`<svg
-    fill="currentColor"
-    height="1em"
-    width="1em"
-    viewBox="0 0 352 512"
-    aria-hidden="true"
-    role="img"
-    style="vertical-align: -0.125em;"
->
-    <path
-        d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
-    ></path>
-</svg>`;
-
-@customElement("ak-application-wizard-hint")
-export class AkApplicationWizardHint extends AKElement implements ShowHintControllerHost {
-    static styles = [
-        PFButton,
-        PFPage,
-        PFLabel,
-        css`
-            .pf-c-page__main-section {
-                padding-bottom: 0;
-            }
-            .ak-hint-text {
-                padding-bottom: var(--pf-global--spacer--md);
-            }
-        `,
-    ];
-
-    @property({ type: Boolean, attribute: "show-hint" })
-    forceHint: boolean = false;
-
-    @state()
-    showHint: boolean = true;
-
-    showHintController: ShowHintController;
-
-    constructor() {
-        super();
-        this.showHintController = new ShowHintController(
-            this,
-            "202310-application-wizard-announcement",
-        );
-    }
-
-    renderReminder() {
-        const sectionStyles = {
-            paddingBottom: "0",
-            marginBottom: "-0.5rem",
-            marginRight: "0.0625rem",
-            textAlign: "right",
-        };
-        const textStyle = { maxWidth: "60ch" };
-
-        return html`<section
-            class="pf-c-page__main-section pf-m-no-padding-mobile"
-            style="${styleMap(sectionStyles)}"
-        >
-            <span class="pf-c-label">
-                <a class="pf-c-label__content" @click=${this.showHintController.show}>
-                    <span class="pf-c-label__text" style="${styleMap(textStyle)}">
-                        ${msg("One hint, 'New Application Wizard', is currently hidden")}
-                    </span>
-                    <button
-                        aria-disabled="false"
-                        aria-label=${msg("Restore Application Wizard Hint")}
-                        class="pf-c-button pf-m-plain"
-                        type="button"
-                        data-ouia-safe="true"
-                    >
-                        ${closeButtonIcon}
-                    </button>
-                </a>
-            </span>
-        </section>`;
-    }
-
-    renderHint() {
-        return html` <section class="pf-c-page__main-section pf-m-no-padding-mobile">
-            <ak-hint>
-                <ak-hint-body>
-                    <p class="ak-hint-text">
-                        You can now configure both an application and its authentication provider at
-                        the same time with our new Application Wizard.
-                        <!-- <a href="(link to docs)">Learn more about the wizard here.</a> -->
-                    </p>
-                    <ak-application-wizard .open=${getURLParam("createWizard", false)}>
-                        <button
-                            slot="trigger"
-                            class="pf-c-button pf-m-primary"
-                            data-ouia-component-id="start-application-wizard"
-                        >
-                            ${msg("Create with wizard")}
-                        </button>
-                    </ak-application-wizard>
-                </ak-hint-body>
-                ${this.showHintController.render()}
-            </ak-hint>
-        </section>`;
-    }
-
-    render() {
-        return this.showHint || this.forceHint ? this.renderHint() : this.renderReminder();
-    }
-}
-
-export default AkApplicationWizardHint;
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ak-application-wizard-hint": AkApplicationWizardHint;
-    }
-}

web/src/admin/endpoints/connectors/ConnectorWizard.ts

@@ -10,6 +10,7 @@ import { DEFAULT_CONFIG } from "#common/api/config";
 
 import { SlottedTemplateResult } from "#elements/types";
 import { CreateWizard } from "#elements/wizard/CreateWizard";
+import { TypeCreateWizardPageLayouts } from "#elements/wizard/TypeCreateWizardPage";
 
 import { EndpointsApi, TypeCreate } from "@goauthentik/api";
 
@@ -23,6 +24,8 @@ export class AKEndpointConnectorWizard extends CreateWizard {
     public static override verboseName = msg("Endpoint Connector");
     public static override verboseNamePlural = msg("Endpoint Connectors");
 
+    public override layout = TypeCreateWizardPageLayouts.grid;
+
     protected apiEndpoint = (requestInit?: RequestInit): Promise<TypeCreate[]> => {
         return this.#api.endpointsConnectorsTypesList(requestInit);
     };

web/src/admin/flows/BoundStagesList.ts

@@ -123,7 +123,7 @@ export class BoundStagesList extends Table<FlowStageBinding> {
                 bindingTarget: this.target,
             })}
         >
-            ${msg("Bind...")}
+            ${msg("Create or bind...")}
         </button>`;
     }
 

web/src/admin/policies/BoundPoliciesList.ts

@@ -184,7 +184,7 @@ export class BoundPoliciesList<T extends PolicyBinding = PolicyBinding> extends
                 bindingTarget: this.target,
             })}
         >
-            ${msg("Bind...")}
+            ${msg("Create or bind...")}
         </button>`;
     }
 

web/src/admin/providers/ProviderListPage.ts

@@ -1,4 +1,3 @@
-import "#admin/applications/ApplicationWizardHint";
 import "#admin/providers/ak-provider-wizard";
 import "#admin/providers/google_workspace/GoogleWorkspaceProviderForm";
 import "#admin/providers/ldap/LDAPProviderForm";