@nymphjs/tilmeld-setup 1.0.0-beta.121 → 1.0.0-beta.123

package/app/src/routes/Groups.svelte

@@ -7,7 +7,8 @@
 {:else}
   <div class="solo-search-container solo-container">
     <Fab
-      href="#/groups/edit/+"
+      href="/groups/edit/+"
+      use={[link]}
       color="primary"
       mini
       class="solo-fab"
@@ -74,27 +75,30 @@
               {#if !$clientConfig.emailUsernames}
                 <Cell
                   ><a
-                    href="#/groups/edit/{encodeURIComponent(
+                    href="/groups/edit/{encodeURIComponent(
                       curEntity.guid || '',
-                    )}">{curEntity.groupname}</a
+                    )}"
+                    use:link>{curEntity.groupname}</a
                   ></Cell
                 >
               {/if}
               {#if $clientConfig.userFields.includes('name')}
                 <Cell
                   ><a
-                    href="#/groups/edit/{encodeURIComponent(
+                    href="/groups/edit/{encodeURIComponent(
                       curEntity.guid || '',
-                    )}">{curEntity.name}</a
+                    )}"
+                    use:link>{curEntity.name}</a
                   ></Cell
                 >
               {/if}
               {#if $clientConfig.userFields.includes('email')}
                 <Cell
                   ><a
-                    href="#/groups/edit/{encodeURIComponent(
+                    href="/groups/edit/{encodeURIComponent(
                       curEntity.guid || '',
-                    )}">{curEntity.email}</a
+                    )}"
+                    use:link>{curEntity.email}</a
                   ></Cell
                 >
               {/if}
@@ -119,7 +123,8 @@
 
 <script lang="ts">
   import type { Writable } from 'svelte/store';
-  import type Navigo from 'navigo';
+  import { getContext } from 'svelte';
+  import { link, push } from 'svelte-spa-router';
   import queryParser from '@nymphjs/query-parser';
   import type {
     AdminGroupData,
@@ -138,23 +143,20 @@
   import Fab from '@smui/fab';
   import { Icon } from '@smui/common';
 
-  import { nymph, Group, User } from '../nymph';
+  import { nymph, Group, User } from '../nymph.js';
 
-  let {
-    router,
-    params,
-    clientConfig,
-    user,
-  }: {
-    router: Navigo;
-    params: { query?: string };
-    clientConfig: Writable<ClientConfig | undefined>;
-    user: Writable<(UserClass & CurrentUserData) | null | undefined>;
-  } = $props();
+  let { params }: { params: { query?: string } } = $props();
 
-  let entitySearch = $state(params.query ?? '');
+  let entitySearch = $derived(params.query ?? '');
   let failureMessage: string | undefined = $state();
 
+  const clientConfig =
+    getContext<Writable<ClientConfig | undefined>>('clientConfigStore');
+  const user =
+    getContext<Writable<(UserClass & CurrentUserData) | null | undefined>>(
+      'userStore',
+    );
+
   $effect(() => {
     if (params) {
       handleSearchParam();
@@ -192,7 +194,7 @@
   let entitiesSearching = $state(false);
   let entities: (GroupClass & AdminGroupData)[] | undefined = $state();
   async function searchEntities() {
-    router.navigate(`/groups/${encodeURIComponent(entitySearch)}`);
+    push(`/groups/${encodeURIComponent(entitySearch)}`);
   }
   function entitySearchKeyDown(event: CustomEvent | KeyboardEvent) {
     event = event as KeyboardEvent;

package/app/src/routes/UserEdit.svelte

@@ -6,10 +6,7 @@
   </section>
 {:else}
   <div style="display: flex; align-items: center; padding: 12px;">
-    <IconButton
-      title="Back"
-      onclick={() => router.navigate('', { historyAPIMethod: 'back' })}
-    >
+    <IconButton title="Back" onclick={() => pop()}>
       <Icon tag="svg" viewBox="0 0 24 24">
         <path fill="currentColor" d={mdiArrowLeft} />
       </Icon>
@@ -191,7 +188,9 @@
         {#if !$entity.group}
           No primary group
         {:else}
-          <a href="#/groups/edit/{encodeURIComponent($entity.group.guid || '')}"
+          <a
+            href="/groups/edit/{encodeURIComponent($entity.group.guid || '')}"
+            use:link
             >{$clientConfig.userFields.includes('name')
               ? $entity.group.name + ' (' + $entity.group.groupname + ')'
               : $entity.group.groupname}</a
@@ -308,27 +307,30 @@
               {#if !$clientConfig.emailUsernames}
                 <Cell
                   ><a
-                    href="#/groups/edit/{encodeURIComponent(
+                    href="/groups/edit/{encodeURIComponent(
                       curEntity.guid || '',
-                    )}">{curEntity.groupname}</a
+                    )}"
+                    use:link>{curEntity.groupname}</a
                   ></Cell
                 >
               {/if}
               {#if $clientConfig.userFields.includes('name')}
                 <Cell
                   ><a
-                    href="#/groups/edit/{encodeURIComponent(
+                    href="/groups/edit/{encodeURIComponent(
                       curEntity.guid || '',
-                    )}">{curEntity.name}</a
+                    )}"
+                    use:link>{curEntity.name}</a
                   ></Cell
                 >
               {/if}
               {#if $clientConfig.userFields.includes('email')}
                 <Cell
                   ><a
-                    href="#/groups/edit/{encodeURIComponent(
+                    href="/groups/edit/{encodeURIComponent(
                       curEntity.guid || '',
-                    )}">{curEntity.email}</a
+                    )}"
+                    use:link>{curEntity.email}</a
                   ></Cell
                 >
               {/if}
@@ -763,7 +765,8 @@
   import { onMount } from 'svelte';
   import type { Writable } from 'svelte/store';
   import { writable } from 'svelte/store';
-  import type Navigo from 'navigo';
+  import { getContext } from 'svelte';
+  import { link, pop, replace } from 'svelte-spa-router';
   import type {
     AdminGroupData,
     AdminUserData,
@@ -798,19 +801,9 @@
   import Dialog, { Title, Content, Actions } from '@smui/dialog';
   import { Icon, Label } from '@smui/common';
 
-  import { User, Group } from '../nymph';
+  import { User, Group } from '../nymph.js';
 
-  let {
-    router,
-    params,
-    clientConfig,
-    user,
-  }: {
-    router: Navigo;
-    params: { guid: string };
-    clientConfig: Writable<ClientConfig | undefined>;
-    user: Writable<(UserClass & CurrentUserData) | null | undefined>;
-  } = $props();
+  let { params }: { params: { guid: string } } = $props();
 
   let entity: Writable<UserClass & AdminUserData> = writable(
     User.factorySync(),
@@ -838,6 +831,13 @@
   let success: boolean | undefined = $state();
   let loading = $state(true);
 
+  const clientConfig =
+    getContext<Writable<ClientConfig | undefined>>('clientConfigStore');
+  const user =
+    getContext<Writable<(UserClass & CurrentUserData) | null | undefined>>(
+      'userStore',
+    );
+
   $effect(() => {
     if (params) {
       handleGuidParam();
@@ -1138,22 +1138,16 @@
     failureMessage = undefined;
     const newEntity = $entity.guid == null;
     try {
-      if (await $entity.$save()) {
-        await readyEntity();
-        success = true;
-        passwordVerify = '';
-        if (newEntity) {
-          router.navigate(
-            `/users/edit/${encodeURIComponent($entity.guid || '')}`,
-            { historyAPIMethod: 'replaceState' },
-          );
-        }
-        setTimeout(() => {
-          success = undefined;
-        }, 1000);
-      } else {
-        failureMessage = 'Error saving user.';
+      await $entity.$save();
+      await readyEntity();
+      success = true;
+      passwordVerify = '';
+      if (newEntity) {
+        replace(`/users/edit/${encodeURIComponent($entity.guid || '')}`);
       }
+      setTimeout(() => {
+        success = undefined;
+      }, 1000);
     } catch (e: any) {
       console.log('error:', e);
       failureMessage = e?.message;
@@ -1166,11 +1160,8 @@
     if (confirm('Are you sure you want to delete this?')) {
       saving = true;
       try {
-        if (await $entity.$delete()) {
-          router.navigate('', { historyAPIMethod: 'back' });
-        } else {
-          failureMessage = 'An error occurred.';
-        }
+        await $entity.$delete();
+        pop();
       } catch (e: any) {
         failureMessage = e?.message;
       }

package/app/src/routes/Users.svelte

@@ -7,7 +7,8 @@
 {:else}
   <div class="solo-search-container solo-container">
     <Fab
-      href="#/users/edit/+"
+      href="/users/edit/+"
+      use={[link]}
       color="primary"
       mini
       class="solo-fab"
@@ -74,27 +75,30 @@
               {#if !$clientConfig.emailUsernames}
                 <Cell
                   ><a
-                    href="#/users/edit/{encodeURIComponent(
+                    href="/users/edit/{encodeURIComponent(
                       curEntity.guid || '',
-                    )}">{curEntity.username}</a
+                    )}"
+                    use:link>{curEntity.username}</a
                   ></Cell
                 >
               {/if}
               {#if $clientConfig.userFields.includes('name')}
                 <Cell
                   ><a
-                    href="#/users/edit/{encodeURIComponent(
+                    href="/users/edit/{encodeURIComponent(
                       curEntity.guid || '',
-                    )}">{curEntity.name}</a
+                    )}"
+                    use:link>{curEntity.name}</a
                   ></Cell
                 >
               {/if}
               {#if $clientConfig.userFields.includes('email')}
                 <Cell
                   ><a
-                    href="#/users/edit/{encodeURIComponent(
+                    href="/users/edit/{encodeURIComponent(
                       curEntity.guid || '',
-                    )}">{curEntity.email}</a
+                    )}"
+                    use:link>{curEntity.email}</a
                   ></Cell
                 >
               {/if}
@@ -119,7 +123,8 @@
 
 <script lang="ts">
   import type { Writable } from 'svelte/store';
-  import type Navigo from 'navigo';
+  import { getContext } from 'svelte';
+  import { link, push } from 'svelte-spa-router';
   import queryParser from '@nymphjs/query-parser';
   import type {
     AdminUserData,
@@ -138,23 +143,20 @@
   import Fab from '@smui/fab';
   import { Icon } from '@smui/common';
 
-  import { nymph, User, Group } from '../nymph';
+  import { nymph, User, Group } from '../nymph.js';
 
-  let {
-    router,
-    params,
-    clientConfig,
-    user,
-  }: {
-    router: Navigo;
-    params: { query?: string };
-    clientConfig: Writable<ClientConfig | undefined>;
-    user: Writable<(UserClass & CurrentUserData) | null | undefined>;
-  } = $props();
+  let { params }: { params: { query?: string } } = $props();
 
-  let entitySearch = $state(params.query ?? '');
+  let entitySearch = $derived(params.query ?? '');
   let failureMessage: string | undefined = $state();
 
+  const clientConfig =
+    getContext<Writable<ClientConfig | undefined>>('clientConfigStore');
+  const user =
+    getContext<Writable<(UserClass & CurrentUserData) | null | undefined>>(
+      'userStore',
+    );
+
   $effect(() => {
     if (params) {
       handleSearchParam();
@@ -192,7 +194,7 @@
   let entitiesSearching = $state(false);
   let entities: (UserClass & AdminUserData)[] | undefined = $state();
   async function searchEntities() {
-    router.navigate(`/users/${encodeURIComponent(entitySearch)}`);
+    push(`/users/${encodeURIComponent(entitySearch)}`);
   }
   function entitySearchKeyDown(event: CustomEvent | KeyboardEvent) {
     event = event as KeyboardEvent;