web_lib

commit b8a92514d62e6dd7a5b40b81f068ff2f1da17d8e
parent 900828609b79b0b7ad5b689438bc0c4fe88b1ea0
Author: triesap <137732411+triesap@users.noreply.github.com>
Date:   Sat,  7 Dec 2024 22:58:43 +0000

apps-lib: edit page header add routable label. edit utils

Diffstat:
M
apps-lib/src/lib/components/page_header.svelte
 | 
45
+++++++++++++++++++++++++++++++++++++++------
M
apps-lib/src/lib/utils/client.ts
 | 
1
-

2 files changed, 39 insertions(+), 7 deletions(-)
diff --git a/apps-lib/src/lib/components/page_header.svelte b/apps-lib/src/lib/components/page_header.svelte
@@ -1,16 +1,49 @@
 <script lang="ts">
+    import {
+        route,
+        type NavigationParamTuple,
+        type NavigationRoute,
+    } from "$lib";
+
     export let basis: {
-        label: string;
+        label:
+            | string
+            | [
+                  string,
+                  {
+                      route: NavigationRoute;
+                      route_param?: NavigationParamTuple[];
+                  },
+              ];
     };
 </script>
 
 <div class={`flex flex-row w-full py-4 px-6 justify-between items-center`}>
     <div class={`flex flex-row justify-start items-center`}>
-        <p
-            class={`font-sansd font-[600] text-2xl text-layer-0-glyph capitalize`}
-        >
-            {basis.label}
-        </p>
+        {#if typeof basis.label === `string`}
+            <p
+                class={`font-sansd font-[600] text-2xl text-layer-0-glyph capitalize`}
+            >
+                {basis.label || ``}
+            </p>
+        {:else}
+            <button
+                class={`flex flex-row gap-1 justify-center items-center`}
+                on:click={async () => {
+                    if (typeof basis.label !== `string`)
+                        await route(
+                            basis.label[1].route,
+                            basis.label[1].route_param || undefined,
+                        );
+                }}
+            >
+                <p
+                    class={`font-sansd font-[600] text-2xl text-layer-0-glyph capitalize`}
+                >
+                    {basis.label[0] || ``}
+                </p>
+            </button>
+        {/if}
     </div>
     <slot name="option" />
 </div>
diff --git a/apps-lib/src/lib/utils/client.ts b/apps-lib/src/lib/utils/client.ts
@@ -144,7 +144,6 @@ export const view_effect = <T extends string>(view: T): void => {
         );
 };
 
-
 export const init_toast = (): void => {
     app_toast.set(false);
 };