@functionalcms/svelte-components 5.17.0 → 5.18.1

package/dist/components/layouts/MenuLayout.svelte

@@ -36,8 +36,10 @@
 	let container: HTMLElement | undefined = undefined;
 	const helpers = uiHelpers();
 	let isCollapsed = $state(false);
-	let icon = $derived(isCollapsed ? OutlinedIcons.ChevronDoubleRight : OutlinedIcons.ChevronDoubleLeft);
-	
+	let icon = $derived(
+		isCollapsed ? OutlinedIcons.ChevronDoubleRight : OutlinedIcons.ChevronDoubleLeft
+	);
+
 	afterNavigate(() => {
 		window.scrollTo({ top: 0, behavior: 'instant' });
 	});
@@ -63,11 +65,11 @@
 					class="rounded-lg p-2 hover:bg-gray-100 dark:hover:bg-gray-700"
 					title={isCollapsed ? 'Expand menu' : 'Collapse menu'}
 				>
-					<Icon icon={icon} />
+					<Icon {icon} />
 				</button>
 			</div>
-			{#if !isCollapsed}
-				{#each menuItems as item}
+			{#each menuItems as item}
+				{#if !isCollapsed}
 					{#if 'items' in item}
 						<SidebarDropdownWrapper label={item.label}>
 							{#each item.items as subItem}
@@ -81,21 +83,22 @@
 							{/snippet}
 						</SidebarItem>
 					{/if}
-				{/each}
-			{:else}
-				{#each menuItems as item}
-					{#if !('items' in item)}
-						<SidebarItem label="" href={item.href} class="justify-center" title={item.label}>
-							{#snippet icon()}
-								<Icon icon={item.icon} />
-							{/snippet}
-						</SidebarItem>
-					{/if}
-				{/each}
-			{/if}
+				{:else}
+					<SidebarItem label="" href={item.href} class="justify-center" title={item.label}>
+						{#snippet icon()}
+							<Icon icon={item.icon} />
+						{/snippet}
+					</SidebarItem>
+				{/if}
+			{/each}
 		</SidebarGroup>
 	</Sidebar>
-	<div class="content h-full overflow-auto px-4 transition-all duration-300 {isCollapsed ? 'md:ml-16' : 'md:ml-64'}" style:flex="1">
+	<div
+		class="content h-full overflow-auto px-4 transition-all duration-300 {isCollapsed
+			? 'md:ml-16'
+			: 'md:ml-64'}"
+		style:flex="1"
+	>
 		{@render children?.()}
 	</div>
 </main>

package/dist/server-side/handlers/sessionStorageHandler.d.ts

@@ -1,3 +1,4 @@
 import { type Handle } from '@sveltejs/kit';
-export declare const sessionStorageHandler: (url: string, token: string, contentName: string) => Handle;
+import { Redis } from '@upstash/redis';
+export declare const sessionStorageHandler: (redis: Redis, contentName: string) => Handle;
 export default sessionStorageHandler;

package/dist/server-side/handlers/sessionStorageHandler.js

@@ -1,15 +1,11 @@
 import {} from '@sveltejs/kit';
 import { Redis } from '@upstash/redis';
-export const sessionStorageHandler = (url, token, contentName) => {
-    const redis = new Redis({
-        url: url,
-        token: token
-    });
+export const sessionStorageHandler = (redis, contentName) => {
     return async ({ event, resolve }) => {
         try {
             const user = event.locals?.user;
-            const uniqueKey = `${user?.id}_${contentName}`;
             if (user) {
+                const uniqueKey = `${user?.id}_${contentName}`;
                 const itemContent = await redis.get(uniqueKey);
                 if (itemContent != ''
                     && (Array.isArray(itemContent) != [] && itemContent.length > 0)

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@functionalcms/svelte-components",
-	"version": "5.17.0",
+	"version": "5.18.1",
 	"license": "MIT",
 	"watch": {
 		"build": {

package/src/pages/auth/setup/[email]/+page.server.ts

@@ -0,0 +1,20 @@
+import { DOMAIN } from '$env/static/private';
+import { getUsersService } from '@functionalcms/svelte-components/index-server.js';
+import { fail } from '@sveltejs/kit';
+
+/** @type {import('./$types').PageServerLoad} */
+export async function load({ params }) {
+  const code = params.email;
+
+  return { code };
+}
+
+export const actions = {
+  setup: async ({ request, locals, params }) => {
+    const userService = getUsersService(locals);
+
+    const result = await userService.setup(DOMAIN, params.email);
+
+    return { success: true };
+  },
+};

package/src/pages/auth/setup/[email]/+page.svelte

@@ -0,0 +1,56 @@
+<script lang="ts">
+  import { Button, Input, Label } from "@functionalcms/svelte-components";
+  import * as m from "$lib/paraglide/messages.js";
+  import { goto } from "$app/navigation";
+  import { deserialize } from "$app/forms";
+
+  interface Props {
+    data: {
+      code: string | null;
+    };
+  }
+
+  let { data } = $props();
+
+  let password = $state("");
+  let confirmPassword = $state("");
+  let submitError = $state(false);
+
+  async function resetPassword() {
+    submitError = false;
+
+    const response = await fetch("?/setup", {
+      method: "POST",
+      body: "",
+    });
+
+    const result = deserialize(await response.text());
+
+    if (result.type === "success") {
+      goto("/auth/login");
+    } else {
+      submitError = true;
+    }
+  }
+</script>
+
+<article>
+  <main class="flex flex-col justify-around items-center gap-4 w-full m-auto p-4">
+    <h1>{m.auth_setup_title()}</h1>
+
+    {#if !data.code}
+      <p>{m.auth_setup_missing_code()}</p>
+    {:else}
+      <Button onclick={resetPassword}>
+        {m.auth_setup_submit()}
+      </Button>
+
+      {#if submitError}
+        <p class="text-red-600">{m.auth_setup_error()}</p>
+      {/if}
+    {/if}
+  </main>
+</article>
+
+<style>
+</style>