Run format and ignore pocketbase

.prettierignore

@@ -2,3 +2,4 @@
 pnpm-lock.yaml
 package-lock.json
 yarn.lock
+pocketbase

README.md

@@ -50,7 +50,7 @@ After everything is set up, you shall have a directory named **AliasWebBased** i
 npm run dev -- --open
 ```
 
-A new browser window should open with the application preseting.
+A new browser window should open with the application presenting.
 
 ## Notes
 

src/lib/components/ResultModal.svelte

@@ -2,21 +2,22 @@
 	import { getModalStore } from '@skeletonlabs/skeleton';
 	import { CircleX } from 'lucide-svelte';
 	const modalStore = getModalStore();
-	const baseCss : string = "flex w-1/2 justify-center h-full card"
-	let result : string = "";
-	let team1Css : string = baseCss, team2Css : string = baseCss;
-	if($modalStore[0]) {
-		if($modalStore[0].meta.team1_score > $modalStore[0].meta.team2_score) {
-			team1Css += " variant-ghost-success";
-			team2Css += " variant-ghost-error";
-			result = "Team " + $modalStore[0].meta.team1 + " wins!";
-		} else if($modalStore[0].meta.team1_score < $modalStore[0].meta.team2_score) {
-			team1Css += " variant-ghost-error";
-			team2Css += " variant-ghost-success";
-			result = "Team " + $modalStore[0].meta.team2 + " wins!";
+	const baseCss: string = 'flex w-1/2 justify-center h-full card';
+	let result: string = '';
+	let team1Css: string = baseCss,
+		team2Css: string = baseCss;
+	if ($modalStore[0]) {
+		if ($modalStore[0].meta.team1_score > $modalStore[0].meta.team2_score) {
+			team1Css += ' variant-ghost-success';
+			team2Css += ' variant-ghost-error';
+			result = 'Team ' + $modalStore[0].meta.team1 + ' wins!';
+		} else if ($modalStore[0].meta.team1_score < $modalStore[0].meta.team2_score) {
+			team1Css += ' variant-ghost-error';
+			team2Css += ' variant-ghost-success';
+			result = 'Team ' + $modalStore[0].meta.team2 + ' wins!';
 		} else {
-			team1Css += " variant-ghost-surface";
-			team2Css += " variant-ghost-surface";
+			team1Css += ' variant-ghost-surface';
+			team2Css += ' variant-ghost-surface';
 			result = "It's a tie!";
 		}
 	}
@@ -28,7 +29,7 @@
 			<h3 class="h3 my-2 mx-4">Game result: {result}</h3>
 			<button class="my-2 mx-4" on:click={() => modalStore.clear()}><CircleX /></button>
 		</div>
-		<hr/>
+		<hr />
 		<div class="flex w-full h-full divide-x-2F">
 			<div class={team1Css}>
 				<p class="m-10 text-center">

src/lib/helpers/common.ts

@@ -27,11 +27,21 @@ export function validateGame(game: Game): string[] {
 		erroneousMessages.push('Game ID is invalid');
 	}
 
-	if (!game.team1 || typeof game.team1 !== 'string' || game.team1 === '' || game.team1.length > 16) {
+	if (
+		!game.team1 ||
+		typeof game.team1 !== 'string' ||
+		game.team1 === '' ||
+		game.team1.length > 16
+	) {
 		erroneousMessages.push('Name of team 1 is invalid');
 	}
 
-	if (!game.team2 || typeof game.team2 !== 'string' || game.team2 === '' || game.team2.length > 16) {
+	if (
+		!game.team2 ||
+		typeof game.team2 !== 'string' ||
+		game.team2 === '' ||
+		game.team2.length > 16
+	) {
 		erroneousMessages.push('Name of team 2 is invalid');
 	}
 

src/routes/+layout.svelte

@@ -57,7 +57,7 @@
 <Toast />
 
 <!-- Singleton Modal -->
-<Modal components={modalRegistry}/>
+<Modal components={modalRegistry} />
 <!-- App Bar -->
 <AppBar>
 	<svelte:fragment slot="lead">

src/routes/create/+page.svelte

@@ -91,13 +91,27 @@
 </svelte:head>
 
 {#if form?.success}
-<!-- Game was created successfully, let's show users how to share the game -->
-<h1 class="h1 text-center mt-12 mx-4 md:mt-20 font-bold">Copy game URL</h1>
-<h3 class="h3 text-center mt-12 mx-4 md:mt-20 font-bold">Copy and share the game URL to play with friends</h3> 
-<div class="w-4/5 md:w-1/2 relative top-[15%] left-1/2 -translate-x-1/2 -translate-y-1/2 text-token card variant-soft p-4 flex items-center gap-4">
-	<input title="Game URL" class="input" type="text" readonly={true} value="{browser ? window.location.origin : ''}/game/{form?.gameId}" data-clipboard="gameURL" />
-	<button title="Copy game URL" use:clipboard={{ input: 'gameURL' }} class="btn variant-filled"><p class="font-bold">Copy</p><Clipboard/></button>
-</div>
+	<!-- Game was created successfully, let's show users how to share the game -->
+	<h1 class="h1 text-center mt-12 mx-4 md:mt-20 font-bold">Copy game URL</h1>
+	<h3 class="h3 text-center mt-12 mx-4 md:mt-20 font-bold">
+		Copy and share the game URL to play with friends
+	</h3>
+	<div
+		class="w-4/5 md:w-1/2 relative top-[15%] left-1/2 -translate-x-1/2 -translate-y-1/2 text-token card variant-soft p-4 flex items-center gap-4"
+	>
+		<input
+			title="Game URL"
+			class="input"
+			type="text"
+			readonly={true}
+			value="{browser ? window.location.origin : ''}/game/{form?.gameId}"
+			data-clipboard="gameURL"
+		/>
+		<button title="Copy game URL" use:clipboard={{ input: 'gameURL' }} class="btn variant-filled"
+			><p class="font-bold">Copy</p>
+			<Clipboard /></button
+		>
+	</div>
 {:else}
 	<h1 class="h1 text-center mt-12 md:mt-20 font-bold">Create a new game</h1>
 	<form

src/routes/game/[gameid]/+page.svelte

@@ -119,7 +119,7 @@
 			})
 			.catch((err) => {
 				console.error(err);
-				const toast : ToastSettings = {
+				const toast: ToastSettings = {
 					message: `Failed to fetch game result. Error: ${err}`,
 					timeout: 4000,
 					background: 'variant-filled-error'