feat: make it so that the push notif doesnt refresh page if has client js

src/lib/pushnotif.ts

@@ -0,0 +1,12 @@
+import { env } from '$env/dynamic/private';
+
+export const pushNotification = (_content: string) => {
+	const content = encodeURIComponent(_content);
+	try {
+		fetch(
+			`https://api.day.app/${env.BARK_DEVICE_ID}/gaze.systems/${content}?icon=https://gaze.systems/icons/gaze_site.webp`
+		);
+	} catch (err) {
+		console.log(`failed to push notification: ${err}`);
+	}
+};

src/routes/+page.server.ts

@@ -2,7 +2,7 @@ import { getLastPosts } from '$lib/bluesky.js';
 import { getNowPlaying } from '$lib/lastfm';
 import { getLastGame } from '$lib/steam';
 import { noteFromBskyPost } from '../components/note.svelte';
-import { env } from '$env/dynamic/private';
+import { pushNotification } from '$lib/pushnotif';
 
 export const load = async () => {
 	const lastTrack = getNowPlaying();
@@ -18,16 +18,10 @@ export const load = async () => {
 };
 
 export const actions = {
-	pushnotif: async ({ request }: RequestEvent) => {
+	default: async ({ request }: RequestEvent) => {
 		const form = await request.formData();
-		const content = encodeURIComponent(form.get('content')?.toString().substring(0, 100));
-		try {
-			fetch(
-				`https://api.day.app/${env.BARK_DEVICE_ID}/gaze.systems/${content}?icon=https://gaze.systems/icons/gaze_site.webp`
-			);
-		} catch (err) {
-			console.log(`failed to push notification: ${err}`);
-		}
+		const content = form.get('content')?.toString().substring(0, 100);
+		pushNotification(content);
 	}
 };
 

src/routes/+page.svelte

@@ -119,7 +119,20 @@
 			{/if}
 		</Window>
 		<Window title="notify me">
-			<form class="flex flex-row gap-1" method="post">
+			<form
+				class="flex flex-row gap-1"
+				method="post"
+				onsubmit={(event) => {
+					event.preventDefault();
+					const data = new FormData(event.currentTarget);
+					try {
+						fetch(`${PUBLIC_BASE_URL}/pushnotif/?content=${data.get('content')}`);
+					} catch (err) {
+						console.log(`failed to send notif: ${err}`);
+					}
+					event.currentTarget.reset();
+				}}
+			>
 				<input
 					type="text"
 					class="entry text-lg p-1 m-0 bg-transparent resize-none text-shadow-white placeholder-shown:[text-shadow:none] border-none"
@@ -131,7 +144,6 @@
 				<input
 					type="submit"
 					value="send!!"
-					formaction="?/pushnotif"
 					class="entry text-ralsei-green-light leading-none hover:underline motion-safe:hover:animate-squiggle p-1 z-50"
 				/>
 			</form>

src/routes/pushnotif/+server.ts

@@ -0,0 +1,8 @@
+import { pushNotification } from '$lib/pushnotif';
+
+export const GET = async ({ url }) => {
+	const content = url.searchParams.get('content');
+	if (content === null) return new Response();
+	pushNotification(content);
+	return new Response();
+};