Fixing update password and sign out redirect.

package.json

@@ -26,7 +26,7 @@
 	},
 	"devDependencies": {
 		"@melt-ui/pp": "^0.3.0",
-		"@melt-ui/svelte": "^0.74.3",
+		"@melt-ui/svelte": "^0.74.4",
 		"@playwright/test": "^1.42.0",
 		"@resvg/resvg-js": "^2.6.0",
 		"@sveltejs/adapter-auto": "^3.1.1",
@@ -38,7 +38,7 @@
 		"@types/pg": "^8.11.2",
 		"@typescript-eslint/eslint-plugin": "^6.21.0",
 		"@typescript-eslint/parser": "^6.21.0",
-		"autoprefixer": "^10.4.17",
+		"autoprefixer": "^10.4.18",
 		"dotenv": "^16.4.5",
 		"drizzle-kit": "^0.20.14",
 		"eslint": "^8.57.0",
@@ -93,7 +93,7 @@
 		"@sveltejs/adapter-vercel": "^5.1.0",
 		"@types/feather-icons": "^4.29.4",
 		"@vercel/og": "^0.5.20",
-		"bits-ui": "^0.18.4",
+		"bits-ui": "^0.18.6",
 		"boardgamegeekclient": "^1.9.1",
 		"class-variance-authority": "^0.7.0",
 		"clsx": "^2.1.0",
@@ -106,7 +106,7 @@
 		"just-kebab-case": "^4.2.0",
 		"loader": "^2.1.1",
 		"lucia": "3.0.1",
-		"lucide-svelte": "^0.343.0",
+		"lucide-svelte": "^0.344.0",
 		"mysql2": "^3.9.2",
 		"nanoid": "^5.0.6",
 		"open-props": "^1.6.20",

pnpm-lock.yaml

@@ -48,8 +48,8 @@ dependencies:
     specifier: ^0.5.20
     version: 0.5.20
   bits-ui:
-    specifier: ^0.18.4
+    specifier: ^0.18.6
-    version: 0.18.4(svelte@4.2.12)
+    version: 0.18.6(svelte@4.2.12)
   boardgamegeekclient:
     specifier: ^1.9.1
     version: 1.9.1
@@ -87,8 +87,8 @@ dependencies:
     specifier: 3.0.1
     version: 3.0.1
   lucide-svelte:
-    specifier: ^0.343.0
+    specifier: ^0.344.0
-    version: 0.343.0(svelte@4.2.12)
+    version: 0.344.0(svelte@4.2.12)
   mysql2:
     specifier: ^3.9.2
     version: 3.9.2
@@ -132,10 +132,10 @@ dependencies:
 devDependencies:
   '@melt-ui/pp':
     specifier: ^0.3.0
-    version: 0.3.0(@melt-ui/svelte@0.74.3)(svelte@4.2.12)
+    version: 0.3.0(@melt-ui/svelte@0.74.4)(svelte@4.2.12)
   '@melt-ui/svelte':
-    specifier: ^0.74.3
+    specifier: ^0.74.4
-    version: 0.74.3(svelte@4.2.12)
+    version: 0.74.4(svelte@4.2.12)
   '@playwright/test':
     specifier: ^1.42.0
     version: 1.42.0
@@ -170,8 +170,8 @@ devDependencies:
     specifier: ^6.21.0
     version: 6.21.0(eslint@8.57.0)(typescript@5.3.3)
   autoprefixer:
-    specifier: ^10.4.17
+    specifier: ^10.4.18
-    version: 10.4.17(postcss@8.4.35)
+    version: 10.4.18(postcss@8.4.35)
   dotenv:
     specifier: ^16.4.5
     version: 16.4.5
@@ -1975,21 +1975,21 @@ packages:
       - supports-color
     dev: false
 
-  /@melt-ui/pp@0.3.0(@melt-ui/svelte@0.74.3)(svelte@4.2.12):
+  /@melt-ui/pp@0.3.0(@melt-ui/svelte@0.74.4)(svelte@4.2.12):
     resolution: {integrity: sha512-b07Bdh8l2KcwKVCXOY+SoBw1dk9eWvQfMSi6SoacpRVyVmmfpi0kV4oGt3HYF0tUCB3sEmVicxse50ZzZxEzEA==}
     engines: {pnpm: '>=8.6.3'}
     peerDependencies:
       '@melt-ui/svelte': '>= 0.29.0'
       svelte: ^3.55.0 || ^4.0.0 || ^5.0.0-next.1
     dependencies:
-      '@melt-ui/svelte': 0.74.3(svelte@4.2.12)
+      '@melt-ui/svelte': 0.74.4(svelte@4.2.12)
       estree-walker: 3.0.3
       magic-string: 0.30.5
       svelte: 4.2.12
     dev: true
 
-  /@melt-ui/svelte@0.74.2(svelte@4.2.12):
+  /@melt-ui/svelte@0.74.4(svelte@4.2.12):
-    resolution: {integrity: sha512-bIfZakPK4h6mOeoeqFnpksUGxkGp5JO2xtfhv/eXjG2rTogsSeVZRPe8eTtE7HoCbokP1+mVM9LqWxipsYTjUA==}
+    resolution: {integrity: sha512-EeDP3C1grK+bPTezJQXKid2k4RRGZakyHTghD/zg//fM6Gqe4JykVtV0Yih4QJs+yGTgJq/EaNQMQ6JkTnvHxg==}
     peerDependencies:
       svelte: '>=3 <5'
     dependencies:
@@ -2000,21 +2000,6 @@ packages:
       focus-trap: 7.5.4
       nanoid: 5.0.6
       svelte: 4.2.12
-    dev: false
-
-  /@melt-ui/svelte@0.74.3(svelte@4.2.12):
-    resolution: {integrity: sha512-eA2Jz3Pf276BdxDumC24mDdpnFuiepfJQSkKWqRSGmSxut0HNVD/kcOAuWfJGDrUfAGPo+aOGJD70P3YIqALVQ==}
-    peerDependencies:
-      svelte: '>=3 <5'
-    dependencies:
-      '@floating-ui/core': 1.6.0
-      '@floating-ui/dom': 1.6.3
-      '@internationalized/date': 3.5.2
-      dequal: 2.0.3
-      focus-trap: 7.5.4
-      nanoid: 5.0.6
-      svelte: 4.2.12
-    dev: true
 
   /@napi-rs/wasm-runtime@0.1.1:
     resolution: {integrity: sha512-ATj9ua659JgrkICjJscaeZdmPr44cb/KFjNWuD0N6pux0SpzaM7+iOuuK11mAnQM2N9q0DT4REu6NkL8ZEhopw==}
@@ -3197,8 +3182,8 @@ packages:
     resolution: {integrity: sha512-+Fj43pSMwJs4KRrH/938Uf+uAELIgVBmQzg/q1YG10djyfA3TnrU8N8XzqCh/okZdszqBQTZf96idMfE5lnwTA==}
     dev: true
 
-  /@sinclair/typebox@0.32.14:
+  /@sinclair/typebox@0.32.15:
-    resolution: {integrity: sha512-EC77Mw8huT2z9YlYbWfpIQgN6shZE1tH4NP4/Trig8UBel9FZNMZRJ42ubJI8PLor2uIU+waLml1dce5ReCOPg==}
+    resolution: {integrity: sha512-5Lrwo7VOiWEBJBhHmqNmf3TPB9ll8gcEshvYJyAIJyCZ2PF48MFOtiDHJNj8+FsNcqImaQYmxVkKBCBlyAa/wg==}
     requiresBuild: true
     optional: true
 
@@ -3743,15 +3728,15 @@ packages:
     resolution: {integrity: sha512-tLRNUXati5MFePdAk8dw7Qt7DpxPB60ofAgn8WRhW6a2rcimZnYBP9oxHiv0OHy+Wz7kPMG+t4LGdt31+4EmGg==}
     dev: false
 
-  /autoprefixer@10.4.17(postcss@8.4.35):
+  /autoprefixer@10.4.18(postcss@8.4.35):
-    resolution: {integrity: sha512-/cpVNRLSfhOtcGflT13P2794gVSgmPgTR+erw5ifnMLZb0UnSlkK4tquLmkd3BhA+nLo5tX8Cu0upUsGKvKbmg==}
+    resolution: {integrity: sha512-1DKbDfsr6KUElM6wg+0zRNkB/Q7WcKYAaK+pzXn+Xqmszm/5Xa9coeNdtP88Vi+dPzZnMjhge8GIV49ZQkDa+g==}
     engines: {node: ^10 || ^12 || >=14}
     hasBin: true
     peerDependencies:
       postcss: ^8.1.0
     dependencies:
-      browserslist: 4.22.2
+      browserslist: 4.23.0
-      caniuse-lite: 1.0.30001579
+      caniuse-lite: 1.0.30001591
       fraction.js: 4.3.7
       normalize-range: 0.1.2
       picocolors: 1.0.0
@@ -3786,13 +3771,13 @@ packages:
       file-uri-to-path: 1.0.0
     dev: false
 
-  /bits-ui@0.18.4(svelte@4.2.12):
+  /bits-ui@0.18.6(svelte@4.2.12):
-    resolution: {integrity: sha512-Xw0DdjT21rJ1ICTy3CHXAKy6is3phXRqjpNwRZldC3A316thRCJn+viEtTifgh4kI+qCm5VutzBqsrimFd+CSA==}
+    resolution: {integrity: sha512-UbBFuyG7qEM+VA1rA/7GRy94rXRFCW+B1LfK7uiBd6fZiPZtPmPPW1RjTblGaJjCW2E6e/ruxbuKjxW2oXDP7g==}
     peerDependencies:
       svelte: ^4.0.0
     dependencies:
       '@internationalized/date': 3.5.2
-      '@melt-ui/svelte': 0.74.2(svelte@4.2.12)
+      '@melt-ui/svelte': 0.74.4(svelte@4.2.12)
       nanoid: 5.0.6
       svelte: 4.2.12
     dev: false
@@ -3825,17 +3810,6 @@ packages:
     dependencies:
       fill-range: 7.0.1
 
-  /browserslist@4.22.2:
-    resolution: {integrity: sha512-0UgcrvQmBDvZHFGdYUehrCNIazki7/lUP3kkoi/r3YB2amZbFM9J43ZRkJTXBUZK4gmx56+Sqk9+Vs9mwZx9+A==}
-    engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
-    hasBin: true
-    dependencies:
-      caniuse-lite: 1.0.30001579
-      electron-to-chromium: 1.4.638
-      node-releases: 2.0.14
-      update-browserslist-db: 1.0.13(browserslist@4.22.2)
-    dev: true
-
   /browserslist@4.23.0:
     resolution: {integrity: sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==}
     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
@@ -3894,14 +3868,14 @@ packages:
   /camelize@1.0.1:
     resolution: {integrity: sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ==}
 
-  /caniuse-lite@1.0.30001579:
-    resolution: {integrity: sha512-u5AUVkixruKHJjw/pj9wISlcMpgFWzSrczLZbrqBSxukQixmg0SJ5sZTpvaFvxU0HoQKd4yoyAogyrAz9pzJnA==}
-    dev: true
-
   /caniuse-lite@1.0.30001588:
     resolution: {integrity: sha512-+hVY9jE44uKLkH0SrUTqxjxqNTOWHsbnQDIKjwkZ3lNTzUUVdBLBGXtj/q5Mp5u98r3droaZAewQuEDzjQdZlQ==}
     dev: true
 
+  /caniuse-lite@1.0.30001591:
+    resolution: {integrity: sha512-PCzRMei/vXjJyL5mJtzNiUCKP59dm8Apqc3PH8gJkMnMXZGox93RbE76jHsmLwmIo6/3nsYIpJtx0O7u5PqFuQ==}
+    dev: true
+
   /chai@4.4.1:
     resolution: {integrity: sha512-13sOfMv2+DWduEU+/xbun3LScLoqN17nBeTLUsmDfKdoiC1fr0n9PU4guu4AhRcOVFk/sW8LyZWHuhWtQZiF+g==}
     engines: {node: '>=4'}
@@ -4374,10 +4348,6 @@ packages:
       postgres: 3.4.3
     dev: false
 
-  /electron-to-chromium@1.4.638:
-    resolution: {integrity: sha512-gpmbAG2LbfPKcDaL5m9IKutKjUx4ZRkvGNkgL/8nKqxkXsBVYykVULboWlqCrHsh3razucgDJDuKoWJmGPdItA==}
-    dev: true
-
   /electron-to-chromium@1.4.677:
     resolution: {integrity: sha512-erDa3CaDzwJOpyvfKhOiJjBVNnMM0qxHq47RheVVwsSQrgBA9ZSGV9kdaOfZDPXcHzhG7lBxhj6A7KvfLJBd6Q==}
     dev: true
@@ -5494,8 +5464,8 @@ packages:
       oslo: 1.0.1
     dev: false
 
-  /lucide-svelte@0.343.0(svelte@4.2.12):
+  /lucide-svelte@0.344.0(svelte@4.2.12):
-    resolution: {integrity: sha512-TkNQBnKU2+4gJFKZJtYmYt+uSIzqwCJf3x/MemMJyv/1WGW+1sej2aYuxoiIwqy5+0txw+OcGeNJF5sbHd6nxA==}
+    resolution: {integrity: sha512-OB/iazftjl2w+vpH7WJqbhHONoMqUT6aaeYvu1BQSgvc7+CKXByu4xvbI7RMOJykaiF/u3LAhyd2ucYBj+rEZQ==}
     peerDependencies:
       svelte: ^3 || ^4 || ^5.0.0-next.42
     dependencies:
@@ -6448,7 +6418,7 @@ packages:
       '@csstools/postcss-text-decoration-shorthand': 3.0.4(postcss@8.4.35)
       '@csstools/postcss-trigonometric-functions': 3.0.5(postcss@8.4.35)
       '@csstools/postcss-unset-value': 3.0.1(postcss@8.4.35)
-      autoprefixer: 10.4.17(postcss@8.4.35)
+      autoprefixer: 10.4.18(postcss@8.4.35)
       browserslist: 4.23.0
       css-blank-pseudo: 6.0.1(postcss@8.4.35)
       css-has-pseudo: 6.0.2(postcss@8.4.35)
@@ -7308,7 +7278,7 @@ packages:
       ts-deepmerge: 7.0.0
     optionalDependencies:
       '@gcornut/valibot-json-schema': 0.0.22(@types/json-schema@7.0.15)(esbuild-runner@2.2.2)(esbuild@0.20.1)(valibot@0.28.1)
-      '@sinclair/typebox': 0.32.14
+      '@sinclair/typebox': 0.32.15
       '@sodaru/yup-to-json-schema': 2.0.1
       '@vinejs/vine': 1.7.1
       arktype: 1.0.29-alpha
@@ -7605,17 +7575,6 @@ packages:
       webpack-virtual-modules: 0.5.0
     dev: false
 
-  /update-browserslist-db@1.0.13(browserslist@4.22.2):
-    resolution: {integrity: sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==}
-    hasBin: true
-    peerDependencies:
-      browserslist: '>= 4.21.0'
-    dependencies:
-      browserslist: 4.22.2
-      escalade: 3.1.1
-      picocolors: 1.0.0
-    dev: true
-
   /update-browserslist-db@1.0.13(browserslist@4.23.0):
     resolution: {integrity: sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==}
     hasBin: true

src/routes/(app)/(protected)/password/change/+page.server.ts

@@ -10,6 +10,7 @@ import { lucia } from '$lib/server/auth.js';
 import type { PageServerLoad } from "./$types";
 import { users } from "../../../../../schema";
 import { notSignedInMessage } from "$lib/flashMessages";
+import type { Cookie } from "lucia";
 
 export const load: PageServerLoad = async (event) => {
 	const form = await superValidate(event, zod(changeUserPasswordSchema));
@@ -44,6 +45,10 @@ export const actions: Actions = {
 		  redirect(302, '/login', notSignedInMessage, event);
 		}
 
+		if (!event.locals.session) {
+			return fail(401);
+		}
+
 		const user = event.locals.user;
 
 		const dbUser = await db.query.users.findFirst({
@@ -65,9 +70,9 @@ export const actions: Actions = {
 		if (!currentPasswordVerified) {
 			return setError(form, 'current_password', 'Your password is incorrect');
 		}
-
+		if (user?.username) {
-		try {
+			let sessionCookie: Cookie;
-			if (user?.username) {
+			try {
 				if (form.data.password !== form.data.confirm_password) {
 					return setError(form, 'Password and confirm password do not match');
 				}
@@ -79,37 +84,29 @@ export const actions: Actions = {
 				const session = await lucia.createSession(user.id, {
 					country: event.locals.session?.ip,
 				});
-				const sessionCookie = lucia.createSessionCookie(session.id);
+				sessionCookie = lucia.createBlankSessionCookie();
-				redirect({
+			} catch (e) {
-					status: 302,
+				console.error(e);
-					location: '/login',
+				form.data.password = '';
-					message: {
+				form.data.confirm_password = '';
-						type: 'success',
+				form.data.current_password = '';
-						text: 'Password changed successfully'
+				return setError(form, 'current_password', 'Your password is incorrect.');
-					},
-					event: sessionCookie.serialize()
-				});
-				// return new Response(null, {
-				// 	status: 302,
-				// 	headers: {
-				// 		Location: '/login',
-				// 		'Set-Cookie': sessionCookie.serialize()
-				// 	}
-				// });
-			} else {
-				return setError(
-					form,
-					'Error occurred. Please try again or contact support if you need further help.'
-				);
 			}
-		} catch (e) {
+			event.cookies.set(sessionCookie.name, sessionCookie.value, {
-			console.error(e);
+				path: ".",
-			form.data.password = '';
+				...sessionCookie.attributes
-			form.data.confirm_password = '';
+			});
-			form.data.current_password = '';
-			return setError(form, 'current_password', 'Your password is incorrect.');
-		}
 
+			const message = {
+				type: 'success',
+				message: 'Password Updated. Please sign in.'
+			} as const;
+			redirect(302, '/login', message, event);
+		}
+		return setError(
+			form,
+			'Error occurred. Please try again or contact support if you need further help.'
+		);
 		// TODO: Add toast instead?
 		// form.data.password = '';
 		// form.data.confirm_password = '';

src/routes/(app)/(protected)/password/change/+page.svelte

@@ -2,10 +2,12 @@
 	import { zodClient } from 'sveltekit-superforms/adapters';
 	import { superForm } from 'sveltekit-superforms/client';
 	import * as flashModule from 'sveltekit-flash-message/client';
+	import * as Alert from "$lib/components/ui/alert";
 	import { changeUserPasswordSchema } from '$lib/validations/account';
 	import { Label } from '$components/ui/label';
 	import { Input } from '$components/ui/input';
 	import { Button } from '$components/ui/button';
+	import { AlertTriangle } from 'lucide-svelte';
 	export let data;
 
 	const { form, errors, enhance, delayed, message } = superForm(data.form, {
@@ -17,6 +19,7 @@
 		flashMessage: {
 			module: flashModule,
 			onError: ({ result }) => {
+				console.log('result', result);
 				const errorMessage = result.error.message
 				message.set({ type: 'error', message: errorMessage });
 			}
@@ -28,6 +31,13 @@
 	<!--<SuperDebug data={$form} />-->
 	<h3>Change Password</h3>
 	<hr class="!border-t-2 mt-2 mb-6" />
+	<Alert.Root variant="destructive">
+		<AlertTriangle class="h-4 w-4" />
+		<Alert.Title>Heads up!</Alert.Title>
+		<Alert.Description>
+			Changing your password will log you out of all devices.
+		</Alert.Description>
+	</Alert.Root>
 	{#if $message}
 		<aside class="alert variant-filled-success mt-6">
 			<!-- Message -->

src/routes/(auth)/login/+page.server.ts

@@ -3,9 +3,9 @@ import { eq } from 'drizzle-orm';
 import { zod } from 'sveltekit-superforms/adapters';
 import { setError, superValidate } from 'sveltekit-superforms/server';
 import { redirect } from 'sveltekit-flash-message/server';
-import { lucia } from '$lib/server/auth';
 import { Argon2id } from 'oslo/password';
 import db from '$lib/drizzle';
+import { lucia } from '$lib/server/auth';
 import { signInSchema } from '$lib/validations/auth'
 import { collections, users, wishlists } from '../../../schema';
 import type { PageServerLoad } from './$types';
@@ -15,7 +15,7 @@ export const load: PageServerLoad = async (event) => {
 
 	console.log('login load event', event);
 	if (event.locals.user) {
-		const message = { type: 'info', message: 'You are already signed in' } as const;
+		const message = { type: 'success', message: 'You are already signed in' } as const;
 		throw redirect('/', message, event);
 	}
 
@@ -93,8 +93,7 @@ export const actions: Actions = {
 
 		form.data.username = '';
 		form.data.password = '';
-		const message = { type: 'success', message: 'Signed In!' };
+		const message = { type: 'success', message: 'Signed In!' } as const;
-		// return { form, message };
+		redirect('/', message, event);
-		throw redirect('/', message, event);
 	}
 };