fix support form

5 files changed, 16 insertions, 8 deletions

diff --git a/src/components/AppHeader.svelte b/src/components/AppHeader.svelte
index ec0f5174..728b025a 100644
--- a/src/components/AppHeader.svelte
+++ b/src/components/AppHeader.svelte
@@ -17,7 +17,7 @@
 		menuButtons = [
 			{ key: 'nav.profile', icon: 'profile', href: `/${user.username}` },
 			{ key: 'nav.settings', icon: 'settings', href: `/${user.username}/settings` },
-			{ key: 'nav.support', icon: 'support', href: `/${user.username}/support` },
+			{ key: 'nav.support', icon: 'support', href: `/support` },
 			{ key: 'nav.signOut', icon: 'logout', href: `/logout` }
 		];
 
@@ -80,7 +80,7 @@
 						class="bg-white p-2 rounded-full w-12 h-12 drop-shadow-xl border border-black/10 {$page
 							.url.pathname === `/${user.username}` ||
 						$page.url.pathname === `/${user.username}/settings` ||
-						$page.url.pathname === `/${user.username}/support`
+						$page.url.pathname === `/support`
 							? 'opacity-100'
 							: `opacity-70 hover:opacity-80 ${showMenu ? 'opacity-80' : ''}`}"
 						on:click={() => (showMenu = !showMenu)}
diff --git a/src/components/Footer.svelte b/src/components/Footer.svelte
index 5e0aeb4a..0b0a2b72 100644
--- a/src/components/Footer.svelte
+++ b/src/components/Footer.svelte
@@ -10,7 +10,7 @@
 
 	const companyLinks = [
 		{ url: '/news', titleID: 'news' },
-		{ url: 'mailto:[email protected]', titleID: 'support' },
+		{ url: '/support', titleID: 'support' },
 		{ url: '/jobs', titleID: 'jobs' }
 	];
 </script>
diff --git a/src/lib/utils.js b/src/lib/utils.js
index c3960487..2bf6b800 100644
--- a/src/lib/utils.js
+++ b/src/lib/utils.js
@@ -70,7 +70,7 @@ export function reverseFormat(val, locale) {
 	return Number.isNaN(reversedVal) ? 0 : +reversedVal;
 }
 
-export let protectedRoutes = [/customers/, /dashboard/, /settings/, /transactions/, /support/];
+export let protectedRoutes = [/customers/, /dashboard/, /settings/, /transactions/];
 
 export const success = (m) => {
 	toast.pop();
diff --git a/src/routes/(app)/[username]/support/+page.server.js b/src/routes/(app)/support/+page.server.js
index a335ec96..78c640e3 100644
--- a/src/routes/(app)/[username]/support/+page.server.js
+++ b/src/routes/(app)/support/+page.server.js
@@ -1,3 +1,6 @@
+import { post } from "$lib/utils";
+import { invalid } from '@sveltejs/kit';
+
 export const actions = {
 	default: async ({ cookies, request }) => {
 		let form = Object.fromEntries(await request.formData());
@@ -5,7 +8,7 @@ export const actions = {
 		try {
 			await post('/email', form);
 		} catch (e) {
-			return invalid(400, { failed: true });
+			return invalid(400, { error: e.message });
 		}
 
 		return { success: true };
diff --git a/src/routes/(app)/[username]/support/+page.svelte b/src/routes/(app)/support/+page.svelte
index cd1cc69f..9181f701 100644
--- a/src/routes/(app)/[username]/support/+page.svelte
+++ b/src/routes/(app)/support/+page.svelte
@@ -11,12 +11,18 @@
 	let message;
 </script>
 
+{#if form?.error}
+	<div class="text-red-600 text-center">
+		{form.error}
+	</div>
+{/if}
+
 <div class="container px-4 max-w-lg mx-auto mt-20">
 	{#if form?.success}
 		<h1 class="text-center text-3xl md:text-4xl font-semibold mb-8">Thank you!</h1>
 		<p class="text-center mb-8">Someone will be in touch shortly.</p>
 
-		<a href={`/${user.username}/dashboard`}>
+		<a href={user ? `/${user.username}/dashboard` : '/'}>
 			<button class="rounded-full border py-2 px-5 font-bold hover:opacity-80 w-full mb-2"
 				>Done</button
 			>
@@ -33,8 +39,7 @@
 					type="text"
 					name="account"
 					required
-					disabled
-					value={user.username}
+					value={user?.username || ''}
 				/>
 			</div>