style: apply consistent formatting and spacing across multiple files

web/src/routes/+layout.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
     import '../app.css';
-    import {ModeWatcher} from "mode-watcher";
-    import {Toaster} from "$lib/components/ui/sonner/index.js";
+    import {ModeWatcher} from 'mode-watcher';
+    import {Toaster} from '$lib/components/ui/sonner/index.js';
 
     let {children} = $props();
 </script>

web/src/routes/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
-	import {goto} from "$app/navigation";
-	import {base} from "$app/paths";
+	import {goto} from '$app/navigation';
+	import {base} from '$app/paths';
 	import {onMount} from 'svelte';
 
 	onMount(() => {

web/src/routes/dashboard/+layout.server.ts

@@ -1,7 +1,7 @@
 import {env} from '$env/dynamic/public';
 import type {LayoutServerLoad} from './$types';
 import {redirect} from '@sveltejs/kit';
-import {base} from "$app/paths";
+import {base} from '$app/paths';
 
 const apiUrl = env.PUBLIC_API_URL;
 

web/src/routes/dashboard/+layout.svelte

@@ -4,14 +4,14 @@
 	import type {LayoutProps} from './$types';
 	import {setContext} from 'svelte';
 	import {goto} from '$app/navigation';
-	import {base} from "$app/paths";
-	import {toast} from "svelte-sonner";
+	import {base} from '$app/paths';
+	import {toast} from 'svelte-sonner';
 
 	let {data, children}: LayoutProps = $props();
 	console.log('Received User Data: ', data.user);
 	if (!data.user.is_verified) {
-		toast.info("Your account requires verification. Redirecting...");
-		goto(base + '/login/verify')
+		toast.info('Your account requires verification. Redirecting...');
+		goto(base + '/login/verify');
 	}
 	setContext('user', () => data.user);
 </script>

web/src/routes/dashboard/+page.svelte

@@ -2,7 +2,7 @@
 	import {Separator} from '$lib/components/ui/separator/index.js';
 	import * as Sidebar from '$lib/components/ui/sidebar/index.js';
 	import * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';
-	import {base} from "$app/paths";
+	import {base} from '$app/paths';
 </script>
 
 <header class="flex h-16 shrink-0 items-center gap-2">

web/src/routes/dashboard/tv/+page.svelte

@@ -8,8 +8,6 @@
     import {toOptimizedURL} from 'sveltekit-image-optimize/components';
     import {getFullyQualifiedShowName} from '$lib/utils';
     import logo from '$lib/images/svelte-logo.svg';
-    import {Button} from "$lib/components/ui/button";
-    import {goto} from "$app/navigation";
 
     let tvShowsPromise = page.data.tvShows;
 </script>
@@ -53,7 +51,7 @@
                     <a href={'/dashboard/tv/' + show.id}>
                         <Card.Root class="h-full ">
                             <Card.Header>
-                                <Card.Title class="truncate h-6">{getFullyQualifiedShowName(show)}</Card.Title>
+                                <Card.Title class="h-6 truncate">{getFullyQualifiedShowName(show)}</Card.Title>
                                 <Card.Description class="truncate">{show.overview}</Card.Description>
                             </Card.Header>
                             <Card.Content>
@@ -62,8 +60,8 @@
                                         src={toOptimizedURL(`${env.PUBLIC_API_URL}/static/image/${show.id}.jpg`)}
                                         alt="{getFullyQualifiedShowName(show)}'s Poster Image"
                                         on:error={(e) => {
-                                        e.target.src = logo;
-                                    }}
+										e.target.src = logo;
+									}}
                                 />
                             </Card.Content>
                         </Card.Root>

web/src/routes/dashboard/tv/[showId=uuid]/+layout.ts

@@ -7,7 +7,7 @@ export const load: LayoutLoad = async ({params, fetch}) => {
 	if (!showId) {
 		return {
 			showData: null,
-			torrentsData: null,
+			torrentsData: null
 		};
 	}
 
@@ -32,7 +32,7 @@ export const load: LayoutLoad = async ({params, fetch}) => {
 			console.error(`Failed to fetch show ${showId}: ${show.statusText}`);
 			return {
 				showData: null,
-				torrentsData: null,
+				torrentsData: null
 			};
 		}
 
@@ -43,13 +43,13 @@ export const load: LayoutLoad = async ({params, fetch}) => {
 
 		return {
 			showData: showData,
-			torrentsData: torrentsData,
+			torrentsData: torrentsData
 		};
 	} catch (error) {
 		console.error('Error fetching show:', error);
 		return {
 			showData: null,
-			torrentsData: null,
+			torrentsData: null
 		};
 	}
 };

web/src/routes/dashboard/tv/[showId=uuid]/+page.svelte

@@ -1,122 +1,124 @@
 <script lang="ts">
-    import {env} from '$env/dynamic/public';
-    import {Separator} from '$lib/components/ui/separator/index.js';
-    import * as Sidebar from '$lib/components/ui/sidebar/index.js';
-    import * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';
-    import {goto} from "$app/navigation";
-    import {ImageOff} from 'lucide-svelte';
-    import * as Table from '$lib/components/ui/table/index.js';
-    import {getContext} from 'svelte';
-    import type {RichShowTorrent, Show, User} from '$lib/types.js';
-    import {getFullyQualifiedShowName} from '$lib/utils';
-    import {toOptimizedURL} from 'sveltekit-image-optimize/components';
-    import DownloadSeasonDialog from '$lib/components/download-season-dialog.svelte';
-    import CheckmarkX from '$lib/components/checkmark-x.svelte';
-    import {page} from '$app/state';
-    import TorrentTable from '$lib/components/torrent-table.svelte';
-    import RequestSeasonDialog from '$lib/components/request-season-dialog.svelte';
+	import {env} from '$env/dynamic/public';
+	import {Separator} from '$lib/components/ui/separator/index.js';
+	import * as Sidebar from '$lib/components/ui/sidebar/index.js';
+	import * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';
+	import {goto} from '$app/navigation';
+	import {ImageOff} from 'lucide-svelte';
+	import * as Table from '$lib/components/ui/table/index.js';
+	import {getContext} from 'svelte';
+	import type {RichShowTorrent, Show, User} from '$lib/types.js';
+	import {getFullyQualifiedShowName} from '$lib/utils';
+	import {toOptimizedURL} from 'sveltekit-image-optimize/components';
+	import DownloadSeasonDialog from '$lib/components/download-season-dialog.svelte';
+	import CheckmarkX from '$lib/components/checkmark-x.svelte';
+	import {page} from '$app/state';
+	import TorrentTable from '$lib/components/torrent-table.svelte';
+	import RequestSeasonDialog from '$lib/components/request-season-dialog.svelte';
 
-    let show: Show = getContext('show');
-    let user: User = getContext('user');
-    let torrents: RichShowTorrent = page.data.torrentsData
+	let show: Show = getContext('show');
+	let user: User = getContext('user');
+	let torrents: RichShowTorrent = page.data.torrentsData;
 </script>
 
 <header class="flex h-16 shrink-0 items-center gap-2">
-    <div class="flex items-center gap-2 px-4">
-        <Sidebar.Trigger class="-ml-1"/>
-        <Separator class="mr-2 h-4" orientation="vertical"/>
-        <Breadcrumb.Root>
-            <Breadcrumb.List>
-                <Breadcrumb.Item class="hidden md:block">
-                    <Breadcrumb.Link href="/dashboard">MediaManager</Breadcrumb.Link>
-                </Breadcrumb.Item>
-                <Breadcrumb.Separator class="hidden md:block"/>
-                <Breadcrumb.Item>
-                    <Breadcrumb.Link href="/dashboard">Home</Breadcrumb.Link>
-                </Breadcrumb.Item>
-                <Breadcrumb.Separator class="hidden md:block"/>
-                <Breadcrumb.Item>
-                    <Breadcrumb.Link href="/dashboard/tv">Shows</Breadcrumb.Link>
-                </Breadcrumb.Item>
-                <Breadcrumb.Separator class="hidden md:block"/>
-                <Breadcrumb.Item>
-                    <Breadcrumb.Page>{getFullyQualifiedShowName(show())}</Breadcrumb.Page>
-                </Breadcrumb.Item>
-            </Breadcrumb.List>
-        </Breadcrumb.Root>
-    </div>
+	<div class="flex items-center gap-2 px-4">
+		<Sidebar.Trigger class="-ml-1"/>
+		<Separator class="mr-2 h-4" orientation="vertical"/>
+		<Breadcrumb.Root>
+			<Breadcrumb.List>
+				<Breadcrumb.Item class="hidden md:block">
+					<Breadcrumb.Link href="/dashboard">MediaManager</Breadcrumb.Link>
+				</Breadcrumb.Item>
+				<Breadcrumb.Separator class="hidden md:block"/>
+				<Breadcrumb.Item>
+					<Breadcrumb.Link href="/dashboard">Home</Breadcrumb.Link>
+				</Breadcrumb.Item>
+				<Breadcrumb.Separator class="hidden md:block"/>
+				<Breadcrumb.Item>
+					<Breadcrumb.Link href="/dashboard/tv">Shows</Breadcrumb.Link>
+				</Breadcrumb.Item>
+				<Breadcrumb.Separator class="hidden md:block"/>
+				<Breadcrumb.Item>
+					<Breadcrumb.Page>{getFullyQualifiedShowName(show())}</Breadcrumb.Page>
+				</Breadcrumb.Item>
+			</Breadcrumb.List>
+		</Breadcrumb.Root>
+	</div>
 </header>
 <h1 class="scroll-m-20 text-center text-4xl font-extrabold tracking-tight lg:text-5xl">
-    {getFullyQualifiedShowName(show())}
+	{getFullyQualifiedShowName(show())}
 </h1>
 <div class="flex flex-1 flex-col gap-4 p-4">
-    <div class="flex items-center gap-2">
-        <div class="max-h-50% w-1/3 max-w-sm rounded-xl bg-muted/50">
-            {#if show().id}
-                <img
-                        class="aspect-9/16 h-auto w-full rounded-lg object-cover"
-                        src={toOptimizedURL(`${env.PUBLIC_API_URL}/static/image/${show().id}.jpg`)}
-                        alt="{show().name}'s Poster Image"
-                />
-            {:else}
-                <div
-                        class="aspect-9/16 flex h-auto w-full items-center justify-center rounded-lg bg-gray-200 text-gray-500"
-                >
-                    <ImageOff size={48}/>
-                </div>
-            {/if}
-        </div>
-        <div class="h-full flex-auto rounded-xl bg-muted/50 p-4">
-            <p class="leading-7 [&:not(:first-child)]:mt-6">
-                {show().overview}
-            </p>
-        </div>
-        <div class="h-full flex-auto rounded-xl bg-muted/50 p-4 flex flex-col items-center justify-center gap-2">
-            {#if user().is_superuser}
-                <DownloadSeasonDialog show={show()}/>
-            {/if}
-            <RequestSeasonDialog show={show()}/>
-        </div>
-    </div>
-    <div class="min-h-[100vh] flex-1 rounded-xl bg-muted/50 p-4 md:min-h-min">
-        <div class="w-full overflow-x-auto">
-            <Table.Root>
-                <Table.Caption>A list of all seasons.</Table.Caption>
-                <Table.Header>
-                    <Table.Row>
-                        <Table.Head>Number</Table.Head>
-                        <Table.Head>Exists on file</Table.Head>
-                        <Table.Head>Title</Table.Head>
-                        <Table.Head>Overview</Table.Head>
-                    </Table.Row>
-                </Table.Header>
-                <Table.Body>
-                    {#if show().seasons.length > 0}
-                        {#each show().seasons as season (season.id)}
-                            <Table.Row
-                                    link={true}
-                                    onclick={() => goto('/dashboard/tv/' + show().id + '/' + season.number)}
-                            >
-                                <Table.Cell class="min-w-[10px] font-medium">{season.number}</Table.Cell>
-                                <Table.Cell class="min-w-[10px] font-medium">
-                                    <CheckmarkX state={season.downloaded}/>
-                                </Table.Cell>
-                                <Table.Cell class="min-w-[50px]">{season.name}</Table.Cell>
-                                <Table.Cell class="max-w-[300px] truncate">{season.overview}</Table.Cell>
-                            </Table.Row>
-                        {/each}
-                    {:else}
-                        <Table.Row>
-                            <Table.Cell colspan="3" class="text-center">No season data available.</Table.Cell>
-                        </Table.Row>
-                    {/if}
-                </Table.Body>
-            </Table.Root>
-        </div>
-    </div>
-    <div class="min-h-[100vh] flex-1 rounded-xl bg-muted/50 p-4 md:min-h-min">
-        <div class="w-full overflow-x-auto">
-            <TorrentTable torrents={torrents.torrents}/>
-        </div>
-    </div>
+	<div class="flex items-center gap-2">
+		<div class="max-h-50% w-1/3 max-w-sm rounded-xl bg-muted/50">
+			{#if show().id}
+				<img
+						class="aspect-9/16 h-auto w-full rounded-lg object-cover"
+						src={toOptimizedURL(`${env.PUBLIC_API_URL}/static/image/${show().id}.jpg`)}
+						alt="{show().name}'s Poster Image"
+				/>
+			{:else}
+				<div
+						class="aspect-9/16 flex h-auto w-full items-center justify-center rounded-lg bg-gray-200 text-gray-500"
+				>
+					<ImageOff size={48}/>
+				</div>
+			{/if}
+		</div>
+		<div class="h-full flex-auto rounded-xl bg-muted/50 p-4">
+			<p class="leading-7 [&:not(:first-child)]:mt-6">
+				{show().overview}
+			</p>
+		</div>
+		<div
+				class="flex h-full flex-auto flex-col items-center justify-center gap-2 rounded-xl bg-muted/50 p-4"
+		>
+			{#if user().is_superuser}
+				<DownloadSeasonDialog show={show()}/>
+			{/if}
+			<RequestSeasonDialog show={show()}/>
+		</div>
+	</div>
+	<div class="min-h-[100vh] flex-1 rounded-xl bg-muted/50 p-4 md:min-h-min">
+		<div class="w-full overflow-x-auto">
+			<Table.Root>
+				<Table.Caption>A list of all seasons.</Table.Caption>
+				<Table.Header>
+					<Table.Row>
+						<Table.Head>Number</Table.Head>
+						<Table.Head>Exists on file</Table.Head>
+						<Table.Head>Title</Table.Head>
+						<Table.Head>Overview</Table.Head>
+					</Table.Row>
+				</Table.Header>
+				<Table.Body>
+					{#if show().seasons.length > 0}
+						{#each show().seasons as season (season.id)}
+							<Table.Row
+									link={true}
+									onclick={() => goto('/dashboard/tv/' + show().id + '/' + season.number)}
+							>
+								<Table.Cell class="min-w-[10px] font-medium">{season.number}</Table.Cell>
+								<Table.Cell class="min-w-[10px] font-medium">
+									<CheckmarkX state={season.downloaded}/>
+								</Table.Cell>
+								<Table.Cell class="min-w-[50px]">{season.name}</Table.Cell>
+								<Table.Cell class="max-w-[300px] truncate">{season.overview}</Table.Cell>
+							</Table.Row>
+						{/each}
+					{:else}
+						<Table.Row>
+							<Table.Cell colspan="3" class="text-center">No season data available.</Table.Cell>
+						</Table.Row>
+					{/if}
+				</Table.Body>
+			</Table.Root>
+		</div>
+	</div>
+	<div class="min-h-[100vh] flex-1 rounded-xl bg-muted/50 p-4 md:min-h-min">
+		<div class="w-full overflow-x-auto">
+			<TorrentTable torrents={torrents.torrents}/>
+		</div>
+	</div>
 </div>

web/src/routes/dashboard/tv/[showId=uuid]/[SeasonNumber=integer]/+page.svelte

@@ -6,19 +6,19 @@
 	import * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';
 	import * as Table from '$lib/components/ui/table/index.js';
 	import {getContext} from 'svelte';
-	import type {PublicSeasonFile, RichShowTorrent, Season, Show} from '$lib/types';
+	import type {PublicSeasonFile, Season, Show} from '$lib/types';
 	import CheckmarkX from '$lib/components/checkmark-x.svelte';
-    import {getTorrentQualityString, getFullyQualifiedShowName} from "$lib/utils";
+	import {getFullyQualifiedShowName, getTorrentQualityString} from '$lib/utils';
 
 	const SeasonNumber = page.params.SeasonNumber;
 	let seasonFiles: PublicSeasonFile[] = $state(page.data.files);
 	let show: Show = getContext('show');
-	let season: Season;
+	let season: Season = $state();
 	show.seasons.forEach((item) => {
 		if (item.number === parseInt(SeasonNumber)) season = item;
 	});
 
-    console.log('loaded files', seasonFiles);
+	console.log('loaded files', seasonFiles);
 </script>
 
 <header class="flex h-16 shrink-0 items-center gap-2">
@@ -54,7 +54,7 @@
 	</div>
 </header>
 <h1 class="scroll-m-20 text-center text-4xl font-extrabold tracking-tight lg:text-5xl">
-    {getFullyQualifiedShowName(show)} Season {SeasonNumber}
+	{getFullyQualifiedShowName(show)} Season {SeasonNumber}
 </h1>
 <div class="flex flex-1 flex-col gap-4 p-4">
 	<div class="flex items-center gap-2">
@@ -65,12 +65,12 @@
 					alt="{show.name}'s Poster Image"
 			/>
 		</div>
-		<div class="h-full flex-auto rounded-xl bg-muted/50 p-4 w-1/4 ">
+		<div class="h-full w-1/4 flex-auto rounded-xl bg-muted/50 p-4">
 			<p class="leading-7 [&:not(:first-child)]:mt-6">
 				{show.overview}
 			</p>
 		</div>
-		<div class="h-full flex-auto rounded-xl bg-muted/50 p-4 w-1/3">
+		<div class="h-full w-1/3 flex-auto rounded-xl bg-muted/50 p-4">
 			<Table.Root>
 				<Table.Caption>A list of all downloaded/downloading versions of this season.</Table.Caption>
 				<Table.Header>
@@ -90,10 +90,10 @@
 								{file.file_path_suffix}
 							</Table.Cell>
 							<Table.Cell class="w-[10px] font-medium">
-                                <CheckmarkX state={file.downloaded}/>
+								<CheckmarkX state={file.downloaded}/>
 							</Table.Cell>
 						</Table.Row>
-					{:else }
+					{:else}
 						<span class="font-semibold">You haven't downloaded this season yet.</span>
 					{/each}
 				</Table.Body>

web/src/routes/dashboard/tv/[showId=uuid]/[SeasonNumber=integer]/+page.ts

@@ -4,35 +4,34 @@ import type {PageLoad} from './$types';
 const apiUrl = env.PUBLIC_API_URL;
 
 export const load: PageLoad = async ({fetch, params}) => {
-    const url = `${apiUrl}/tv/shows/${params.showId}/${params.SeasonNumber}/files`;
+	const url = `${apiUrl}/tv/shows/${params.showId}/${params.SeasonNumber}/files`;
 
-    try {
-        console.log(`Fetching data from: ${url}`);
-        const response = await fetch(url, {
-            method: 'GET',
-            credentials: 'include'
-        });
+	try {
+		console.log(`Fetching data from: ${url}`);
+		const response = await fetch(url, {
+			method: 'GET',
+			credentials: 'include'
+		});
 
-        if (!response.ok) {
-            const errorText = await response.text();
-            console.error(`API request failed with status ${response.status}: ${errorText}`);
-            return {
-                error: `Failed to load TV show files. Status: ${response.status}`,
-                files: []
-            };
-        }
+		if (!response.ok) {
+			const errorText = await response.text();
+			console.error(`API request failed with status ${response.status}: ${errorText}`);
+			return {
+				error: `Failed to load TV show files. Status: ${response.status}`,
+				files: []
+			};
+		}
 
-        const filesData = await response.json();
-        console.log("received season_files data: ", filesData);
-        return {
-            files: filesData
-        };
-
-    } catch (error) {
-        console.error('An error occurred while fetching TV show files:', error);
-        return {
-            error: `An unexpected error occurred: ${error.message || 'Unknown error'}`,
-            files: []
-        };
-    }
-};
+		const filesData = await response.json();
+		console.log('received season_files data: ', filesData);
+		return {
+			files: filesData
+		};
+	} catch (error) {
+		console.error('An error occurred while fetching TV show files:', error);
+		return {
+			error: `An unexpected error occurred: ${error.message || 'Unknown error'}`,
+			files: []
+		};
+	}
+};

web/src/routes/dashboard/tv/add-show/+page.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-	import * as Card from '$lib/components/ui/card/index.js';
 	import {env} from '$env/dynamic/public';
 	import {Separator} from '$lib/components/ui/separator/index.js';
 	import * as Sidebar from '$lib/components/ui/sidebar/index.js';
@@ -7,20 +6,16 @@
 	import {Input} from '$lib/components/ui/input';
 	import {Label} from '$lib/components/ui/label';
 	import {Button} from '$lib/components/ui/button';
-	import {ChevronDown, ImageOff} from 'lucide-svelte';
+	import {ChevronDown} from 'lucide-svelte';
 	import * as Collapsible from '$lib/components/ui/collapsible/index.js';
 	import type {MetaDataProviderShowSearchResult} from '$lib/types.js';
 	import * as RadioGroup from '$lib/components/ui/radio-group/index.js';
-	import {goto} from '$app/navigation';
-	import {base} from '$app/paths';
 	import AddShowCard from '$lib/components/add-show-card.svelte';
 	import {toast} from 'svelte-sonner';
 
 	let searchTerm: string = $state('');
 	let metadataProvider: string = $state('tmdb');
-	let results:
-			| MetaDataProviderShowSearchResult[]
-			| null = $state(null);
+	let results: MetaDataProviderShowSearchResult[] | null = $state(null);
 
 	async function search() {
 		if (searchTerm.length > 0) {
@@ -44,7 +39,8 @@
 					toast.info(`No results found for "${searchTerm}".`);
 				}
 			} catch (error) {
-				const errorMessage = error instanceof Error ? error.message : 'An unknown error occurred during search.';
+				const errorMessage =
+						error instanceof Error ? error.message : 'An unknown error occurred during search.';
 				console.error('Search error:', error);
 				toast.error(errorMessage);
 				results = null; // Clear previous results on error
@@ -54,7 +50,6 @@
 			results = null;
 		}
 	}
-
 </script>
 
 <header class="flex h-16 shrink-0 items-center gap-2">
@@ -83,7 +78,7 @@
 	</div>
 </header>
 
-<div class="flex w-full flex-1 flex-col items-center  gap-4 p-4 pt-0">
+<div class="flex w-full flex-1 flex-col items-center gap-4 p-4 pt-0">
 	<div class="grid w-full max-w-sm items-center gap-12">
 		<h1 class="scroll-m-20 text-center text-4xl font-extrabold tracking-tight lg:text-5xl">
 			Add a show
@@ -135,7 +130,7 @@
              md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5"
 			>
 				{#each results as result (result.external_id)}
-					<AddShowCard result={result}/>
+					<AddShowCard {result}/>
 				{/each}
 			</div>
 		{/if}

web/src/routes/dashboard/tv/requests/+layout.ts

@@ -1,33 +1,33 @@
 import {env} from '$env/dynamic/public';
 import type {LayoutLoad} from './$types';
 
-export const load: LayoutLoad = async ({params, fetch}) => {
-    try {
-        const requests = await fetch(`${env.PUBLIC_API_URL}/tv/seasons/requests`, {
-            method: 'GET',
-            headers: {
-                'Content-Type': 'application/json'
-            },
-            credentials: 'include'
-        });
+export const load: LayoutLoad = async ({fetch}) => {
+	try {
+		const requests = await fetch(`${env.PUBLIC_API_URL}/tv/seasons/requests`, {
+			method: 'GET',
+			headers: {
+				'Content-Type': 'application/json'
+			},
+			credentials: 'include'
+		});
 
-        if (!requests.ok) {
-            console.error(`Failed to fetch season requests ${requests.statusText}`);
-            return {
-                requestsData: null,
-            };
-        }
+		if (!requests.ok) {
+			console.error(`Failed to fetch season requests ${requests.statusText}`);
+			return {
+				requestsData: null
+			};
+		}
 
-        const requestsData = await requests.json();
-        console.log('Fetched season requests:', requestsData);
+		const requestsData = await requests.json();
+		console.log('Fetched season requests:', requestsData);
 
-        return {
-            requestsData: requestsData,
-        };
-    } catch (error) {
-        console.error('Error fetching season requests:', error);
-        return {
-            requestsData: null,
-        };
-    }
+		return {
+			requestsData: requestsData
+		};
+	} catch (error) {
+		console.error('Error fetching season requests:', error);
+		return {
+			requestsData: null
+		};
+	}
 };

web/src/routes/dashboard/tv/requests/+page.svelte

@@ -1,49 +1,44 @@
 <script lang="ts">
-    import {page} from '$app/state';
-    import {Separator} from '$lib/components/ui/separator/index.js';
-    import * as Sidebar from '$lib/components/ui/sidebar/index.js';
-    import * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';
-    import * as Table from '$lib/components/ui/table/index.js';
-    import {getTorrentQualityString, getTorrentStatusString} from '$lib/utils';
-    import type {SeasonRequest} from '$lib/types';
-    import {getFullyQualifiedShowName} from '$lib/utils';
-    import * as Accordion from '$lib/components/ui/accordion/index.js';
-    import CheckmarkX from '$lib/components/checkmark-x.svelte';
-    import * as Card from "$lib/components/ui/card/index.js";
-    import RequestsTable from "$lib/components/season-requests-table.svelte";
+	import {page} from '$app/state';
+	import {Separator} from '$lib/components/ui/separator/index.js';
+	import * as Sidebar from '$lib/components/ui/sidebar/index.js';
+	import * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';
+	import type {SeasonRequest} from '$lib/types';
+	import RequestsTable from '$lib/components/season-requests-table.svelte';
 
-    let requests: SeasonRequest[] = $state(page.data.requestsData);
+	let requests: SeasonRequest[] = $state(page.data.requestsData);
 </script>
+
 <!-- TODO: ADD DIALOGUE TO MODIFY REQUEST -->
 <header class="flex h-16 shrink-0 items-center gap-2">
-    <div class="flex items-center gap-2 px-4">
-        <Sidebar.Trigger class="-ml-1"/>
-        <Separator class="mr-2 h-4" orientation="vertical"/>
-        <Breadcrumb.Root>
-            <Breadcrumb.List>
-                <Breadcrumb.Item class="hidden md:block">
-                    <Breadcrumb.Link href="/dashboard">MediaManager</Breadcrumb.Link>
-                </Breadcrumb.Item>
-                <Breadcrumb.Separator class="hidden md:block"/>
-                <Breadcrumb.Item>
-                    <Breadcrumb.Link href="/dashboard">Home</Breadcrumb.Link>
-                </Breadcrumb.Item>
-                <Breadcrumb.Separator class="hidden md:block"/>
-                <Breadcrumb.Item>
-                    <Breadcrumb.Link href="/dashboard/tv">Shows</Breadcrumb.Link>
-                </Breadcrumb.Item>
-                <Breadcrumb.Separator class="hidden md:block"/>
-                <Breadcrumb.Item>
-                    <Breadcrumb.Page>TV Torrents</Breadcrumb.Page>
-                </Breadcrumb.Item>
-            </Breadcrumb.List>
-        </Breadcrumb.Root>
-    </div>
+	<div class="flex items-center gap-2 px-4">
+		<Sidebar.Trigger class="-ml-1"/>
+		<Separator class="mr-2 h-4" orientation="vertical"/>
+		<Breadcrumb.Root>
+			<Breadcrumb.List>
+				<Breadcrumb.Item class="hidden md:block">
+					<Breadcrumb.Link href="/dashboard">MediaManager</Breadcrumb.Link>
+				</Breadcrumb.Item>
+				<Breadcrumb.Separator class="hidden md:block"/>
+				<Breadcrumb.Item>
+					<Breadcrumb.Link href="/dashboard">Home</Breadcrumb.Link>
+				</Breadcrumb.Item>
+				<Breadcrumb.Separator class="hidden md:block"/>
+				<Breadcrumb.Item>
+					<Breadcrumb.Link href="/dashboard/tv">Shows</Breadcrumb.Link>
+				</Breadcrumb.Item>
+				<Breadcrumb.Separator class="hidden md:block"/>
+				<Breadcrumb.Item>
+					<Breadcrumb.Page>TV Torrents</Breadcrumb.Page>
+				</Breadcrumb.Item>
+			</Breadcrumb.List>
+		</Breadcrumb.Root>
+	</div>
 </header>
 
 <div class="flex w-full flex-1 flex-col items-center gap-4 p-4 pt-0">
-    <h1 class="scroll-m-20 text-center text-4xl font-extrabold tracking-tight lg:text-5xl">
-        Season Requests
-    </h1>
-    <RequestsTable bind:requests={requests}/>
+	<h1 class="scroll-m-20 text-center text-4xl font-extrabold tracking-tight lg:text-5xl">
+		Season Requests
+	</h1>
+	<RequestsTable bind:requests/>
 </div>

web/src/routes/dashboard/tv/torrents/+page.svelte

@@ -3,14 +3,11 @@
 	import {Separator} from '$lib/components/ui/separator/index.js';
 	import * as Sidebar from '$lib/components/ui/sidebar/index.js';
 	import * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';
-	import * as Table from '$lib/components/ui/table/index.js';
-	import {getTorrentQualityString, getTorrentStatusString} from '$lib/utils';
 	import type {RichShowTorrent} from '$lib/types';
 	import {getFullyQualifiedShowName} from '$lib/utils';
 	import * as Accordion from '$lib/components/ui/accordion/index.js';
-	import CheckmarkX from '$lib/components/checkmark-x.svelte';
-	import * as Card from "$lib/components/ui/card/index.js";
-	import TorrentTable from "$lib/components/torrent-table.svelte";
+	import * as Card from '$lib/components/ui/card/index.js';
+	import TorrentTable from '$lib/components/torrent-table.svelte';
 
 	let showsPromise: Promise<RichShowTorrent[]> = $state(page.data.shows);
 </script>

web/src/routes/login/+page.svelte

@@ -12,4 +12,4 @@
 
         <LoginForm/>
     </div>
-</div>
+</div>

web/src/routes/login/verify/+page.svelte

@@ -5,13 +5,14 @@
     import {handleLogout} from '$lib/utils.ts';
 </script>
 
-
-<div class="flex min-h-screen flex-col items-center justify-center bg-background px-4 py-12 sm:px-6 lg:px-8">
-    <div class="absolute top-4 left-4">
+<div
+        class="flex min-h-screen flex-col items-center justify-center bg-background px-4 py-12 sm:px-6 lg:px-8"
+>
+    <div class="absolute left-4 top-4">
         <Logo/>
     </div>
-    <div class="absolute top-4 right-4">
-        <Button onclick={()=>handleLogout()} variant="outline">Logout</Button>
+    <div class="absolute right-4 top-4">
+        <Button onclick={() => handleLogout()} variant="outline">Logout</Button>
     </div>
     <div class="mx-auto w-full max-w-md text-center">
         <div class="mb-6">
@@ -21,8 +22,7 @@
             Account Pending Activation
         </h1>
         <p class="mt-4 text-lg text-muted-foreground">
-            Your account has been successfully created, but activation by an
-            administrator is required.
+            Your account has been successfully created, but activation by an administrator is required.
         </p>
         <div class="mt-8">
             <Button href="/dashboard">Go to Dashboard</Button>
@@ -30,8 +30,8 @@
         <p class="mt-10 text-sm text-muted-foreground">
             The above button will only work once your account is verified.
         </p>
-        <p class="mt-10 text-sm text-muted-foreground end">
+        <p class="end mt-10 text-sm text-muted-foreground">
             If you have any questions, please contact an administrator.
         </p>
     </div>
-</div>
+</div>