web: separated the "with Title" and "without Title" stories.

goauthentik · Oct 9, 2023 · 5d9a3ce · 5d9a3ce
1 parent 26740e8
commit 5d9a3ce
Showing 1 changed file with 27 additions and 0 deletions.
diff --git a/web/src/components/ak-hint/ak-hint.stories.ts b/web/src/components/ak-hint/ak-hint.stories.ts
@@ -46,6 +46,33 @@ const container = (testItem: TemplateResult) =>
     </div>`;
 
 export const Default = () => {
+    return container(
+        html` <section class="pf-c-page__main-section pf-m-no-padding-mobile">
+            <ak-hint>
+                <ak-hint-body>
+                    <p style="padding-bottom: 1rem;">
+                        Authentik has a new Application Wizard that can configure both an
+                        application and its authentication provider at the same time.
+                        <a href="(link to docs)">Learn more about the wizard here.</a>
+                    </p>
+                    <ak-action-button
+                        class="pf-m-secondary"
+                        .apiRequest=${() => {
+                            showMessage({
+                                message: "This would have shown the wizard",
+                                level: MessageLevel.success,
+                            });
+                        }}
+                        >Create with Wizard</ak-action-button
+                    ></ak-hint-body
+                >
+            </ak-hint>
+        </section>`,
+    );
+};
+
+
+export const WithTitle = () => {
     return container(
         html` <section class="pf-c-page__main-section pf-m-no-padding-mobile">
             <ak-hint>