Re-deploying Svelte 5 upgrade (#99)

TravisSpomer · Feb 6, 2025 · 7f00b34 · 7f00b34
1 parent 5ac9024
commit 7f00b34
Show file tree

Hide file tree

Showing 14 changed files with 1,634 additions and 1,456 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,40 +1,40 @@
 {
 	"name": "ivorytower",
-	"version": "3.0.0-beta",
+	"version": "3.0.0",
 	"private": true,
 	"license": "UNLICENSED",
 	"dependencies": {
-		"@tiptap/extension-color": "^2.10.3",
-		"@tiptap/extension-font-family": "^2.10.3",
-		"@tiptap/extension-image": "^2.10.3",
-		"@tiptap/extension-link": "^2.10.3",
-		"@tiptap/extension-list-item": "^2.10.3",
-		"@tiptap/extension-ordered-list": "^2.10.3",
-		"@tiptap/extension-placeholder": "^2.10.3",
-		"@tiptap/extension-table": "^2.10.3",
-		"@tiptap/extension-table-cell": "^2.10.3",
-		"@tiptap/extension-table-header": "^2.10.3",
-		"@tiptap/extension-table-row": "^2.10.3",
-		"@tiptap/extension-text-style": "^2.10.3",
-		"@tiptap/extension-typography": "^2.10.3",
-		"@tiptap/pm": "^2.10.3",
-		"@tiptap/starter-kit": "^2.10.3",
+		"@tiptap/extension-color": "^2.11.3",
+		"@tiptap/extension-font-family": "^2.11.3",
+		"@tiptap/extension-image": "^2.11.3",
+		"@tiptap/extension-link": "^2.11.3",
+		"@tiptap/extension-list-item": "^2.11.3",
+		"@tiptap/extension-ordered-list": "^2.11.3",
+		"@tiptap/extension-placeholder": "^2.11.3",
+		"@tiptap/extension-table": "^2.11.3",
+		"@tiptap/extension-table-cell": "^2.11.3",
+		"@tiptap/extension-table-header": "^2.11.3",
+		"@tiptap/extension-table-row": "^2.11.3",
+		"@tiptap/extension-text-style": "^2.11.3",
+		"@tiptap/extension-typography": "^2.11.3",
+		"@tiptap/pm": "^2.11.3",
+		"@tiptap/starter-kit": "^2.11.3",
 		"@travisspomer/tidbits": "^1.0.9"
 	},
 	"devDependencies": {
-		"@sveltejs/adapter-static": "^2.0.3",
-		"@sveltejs/kit": "^1.25.2",
+		"@sveltejs/adapter-static": "^3.0.8",
+		"@sveltejs/kit": "^2.16.1",
+		"@sveltejs/vite-plugin-svelte": "^4.0.0",
 		"@types/html-minifier": "^4.0.2",
 		"@typescript-eslint/eslint-plugin": "^6.7.0",
 		"@typescript-eslint/parser": "^6.7.0",
 		"eslint": "^8.49.0",
-		"eslint-plugin-svelte": "^2.33.1",
+		"eslint-plugin-svelte": "^2.45.1",
 		"html-minifier": "^4.0.0",
 		"sass": "^1.66.1",
-		"svelte": "^4.2.1",
-		"svelte-preprocess": "^5.0.4",
+		"svelte": "^5.0.0",
 		"tslib": "^2.6.2",
-		"typescript": "^5.2.2"
+		"typescript": "^5.5.0"
 	},
 	"type": "module",
 	"engines": {

diff --git a/src/app.html b/src/app.html
@@ -13,12 +13,8 @@
 	<link rel="apple-touch-icon" href="/images/app/logo180.png" />
 	<link rel="manifest" href="/app.webmanifest" />
 	<noscript><meta http-equiv="refresh" content="0; url=/noscript" /></noscript>
-	<style>@keyframes loaderror{0%{opacity:0}100%{opacity:1}}.loaderror{color:#dd0737;margin:auto;opacity:0;animation:loaderror 200ms ease 5s forwards running;}</style>
 </head>
 <body>
-<div style="display: contents;">
-	<div class="loaderror">IvoryTower failed to load. Womp womp.</div>
-	%sveltekit.body%
-</div>
+%sveltekit.body%
 </body>
 </html>
diff --git a/src/lib/components/HoverLink.svelte b/src/lib/components/HoverLink.svelte
@@ -2,17 +2,17 @@
 	/** The destination of the link. */
 	export let href: string
 	/** Optionally, child elements to render. */
-	export let children: NodeList | undefined = undefined
+	export let childNodes: NodeList | undefined = undefined
 	/** If false, the link won't actually navigate to the link on click. */
 	export let navigate: boolean = true
 
 	let element: Readonly<HTMLAnchorElement>
 	let childrenCopy: Node[] | undefined
 
-	$: if (element && children)
+	$: if (element && childNodes)
 	{
 		// Important: A NodeList won't survive hot reloads, so you need to reload the whole page each time you change this component's code.
-		childrenCopy = Array.from(children)
+		childrenCopy = Array.from(childNodes)
 		childrenCopy.forEach(child => element.appendChild(child))
 	}
 </script>
@@ -43,10 +43,10 @@
 
 {#if navigate}
 	<a bind:this={element} {href} on:click>
-		{#if element && !children}<slot>{href}</slot>{/if}
+		{#if element && !childNodes}<slot>{href}</slot>{/if}
 	</a>
 {:else}
 	<a bind:this={element} {href} on:click|preventDefault>
-		{#if element && !children}<slot>{href}</slot>{/if}
+		{#if element && !childNodes}<slot>{href}</slot>{/if}
 	</a>
 {/if}
diff --git a/src/lib/components/Popup.svelte b/src/lib/components/Popup.svelte
@@ -11,7 +11,7 @@
 	/** If true, the popup can be closed by clicking anywhere outside of its bounds. */
 	export let lightDismiss: boolean = false
 	/** Optionally, explicitly specify the anchor as an unrelated element rather than the child with slot="anchor". */
-	export let anchor: HTMLElement | undefined = undefined
+	export let anchorElement: HTMLElement | undefined = undefined
 
 	let internalAnchor: HTMLElement
 	let lastExplicitAnchor: HTMLElement | undefined
@@ -27,27 +27,27 @@
 		setTimeout(reposition)
 	}
 
-	$: if (lastExplicitAnchor && (!anchor || anchor !== lastExplicitAnchor || !onHover))
+	$: if (lastExplicitAnchor && (!anchorElement || anchorElement !== lastExplicitAnchor || !onHover))
 	{
 		lastExplicitAnchor.removeEventListener("mouseenter", onAnchorEnter)
 		lastExplicitAnchor.removeEventListener("mouseleave", onAnchorLeave)
 		lastExplicitAnchor.removeEventListener("focus", onAnchorFocus)
 		lastExplicitAnchor.removeEventListener("blur", onAnchorBlur)
 		lastExplicitAnchor = undefined
 	}
-	$: if (anchor && onHover)
+	$: if (anchorElement && onHover)
 	{
-		anchor.addEventListener("mouseenter", onAnchorEnter)
-		anchor.addEventListener("mouseleave", onAnchorLeave)
-		anchor.addEventListener("focus", onAnchorFocus)
-		anchor.addEventListener("blur", onAnchorBlur)
-		lastExplicitAnchor = anchor
+		anchorElement.addEventListener("mouseenter", onAnchorEnter)
+		anchorElement.addEventListener("mouseleave", onAnchorLeave)
+		anchorElement.addEventListener("focus", onAnchorFocus)
+		anchorElement.addEventListener("blur", onAnchorBlur)
+		lastExplicitAnchor = anchorElement
 	}
 
 	function currentAnchor(): HTMLElement
 	{
 		// If they manually specified an anchor, just use that.
-		if (anchor) return anchor
+		if (anchorElement) return anchorElement
 
 		// If they are using the anchor slot, we want to actually get the rendered *child*, because
 		// it might be absolutely positioned.
@@ -61,10 +61,10 @@
 	{
 		if (!browser || !popup) return
 
-		const anchorElement = currentAnchor()
-		if (anchorElement)
+		const anchor = currentAnchor()
+		if (anchor)
 		{
-			const anchorPos = currentAnchor().getBoundingClientRect()
+			const anchorPos = anchor.getBoundingClientRect()
 			const popupPos = popup.getBoundingClientRect()
 
 			x = anchorPos.x
@@ -178,7 +178,7 @@
 <FocusWithin visibleOnly
 		on:mouseenter={onAnchorEnter} on:mouseleave={onAnchorLeave}
 		on:focuswithin={onAnchorFocus} on:focusoutside={onAnchorBlur}
-	>{#if !anchor && $$slots.anchor}<span bind:this={internalAnchor}><slot name="anchor" /></span>{/if}{#if isOpen}<div
+	>{#if !anchorElement && $$slots.anchor}<span bind:this={internalAnchor}><slot name="anchor" /></span>{/if}{#if isOpen}<div
 		bind:this={popup}
 		on:mouseenter={onPopupEnter} on:mouseleave={onPopupLeave}
 		style={`position: fixed; z-index: 999999; user-select: none; left: ${x}px; top: ${y}px;`}

diff --git a/src/lib/components/PostLink.svelte b/src/lib/components/PostLink.svelte
@@ -56,7 +56,7 @@
 
 {#if browser}
 	<Popup onHover={!errorLoading && !lockedOpen} bind:isOpen={isPopupOpen}>
-		<HoverLink slot="anchor" href={`/threads/${threadID}#Post${postIndex}`} {children} navigate={false} on:click={onClick} />
+		<HoverLink slot="anchor" href={`/threads/${threadID}#Post${postIndex}`} childNodes={children} navigate={false} on:click={onClick} />
 		<PopupFrame style="HoverLink">
 			{#if post}
 				<PostView {post} readonly compact scrollIntoView={false} />

diff --git a/src/lib/components/Upload.svelte b/src/lib/components/Upload.svelte
@@ -25,7 +25,7 @@
 	// TODO: Pull the drag tracking bits out into its own Action to be used without any visuals
 
 	let root: HTMLElement
-	let curtain: HTMLElement
+	let curtainElement: HTMLElement
 	let filePicker: HTMLInputElement
 	let files: FileList | null = null
 	let dragging: boolean = false
@@ -82,9 +82,9 @@
 
 	function onDragLeave(ev: DragEvent)
 	{
-		if (ev.target !== curtain) return
+		if (ev.target !== curtainElement) return
 		dragging = false
-	
+
 		ev.preventDefault()
 		ev.stopPropagation()
 	}
@@ -149,7 +149,7 @@
 
 .curtain
 {
-	position: absolute; 
+	position: absolute;
 	left: 0;
 	top: 0;
 	width: 100%;
@@ -198,7 +198,7 @@
 
 	</slot>
 	{#if dragging}
-		<div bind:this={curtain} class:curtain={true}>
+		<div bind:this={curtainElement} class:curtain={true}>
 			<slot name="curtain">
 				<div class:curtain-default={true}></div>
 			</slot>

diff --git a/src/routes/ForumThread.aspx/+page.ts b/src/routes/ForumThread.aspx/+page.ts
@@ -6,5 +6,5 @@ type LoadOutput = Promise<ReturnType<PageLoad>>
 
 export async function load({ url }: LoadEvent): Promise<LoadOutput>
 {
-	throw redirect(301, `/threads/${url.searchParams.get("Thread")}${url.hash}`)
+	redirect(301, `/threads/${url.searchParams.get("Thread")}${url.hash}`);
 }
diff --git a/src/routes/MessageSend.aspx/+page.ts b/src/routes/MessageSend.aspx/+page.ts
@@ -7,7 +7,7 @@ type LoadOutput = Promise<ReturnType<PageLoad>>
 export async function load({ url }: LoadEvent): Promise<LoadOutput>
 {
 	const name = url.searchParams.get("name")
-	if (name !== "csmolinsky") throw error(404)
+	if (name !== "csmolinsky") error(404);
 
 	return {}
 }
diff --git a/src/routes/_NavBar.svelte b/src/routes/_NavBar.svelte
@@ -1,10 +1,9 @@
 <script lang="ts">
 	import { browser } from "$app/environment"
-	import { goto } from "$app/navigation"
 	import { phone } from "$lib/utils/settings"
 	import { Badge, LightDismiss, Logo, Popup, SearchBox } from "$lib/components"
 	import { currentUser, loginState, LoginState, logout, unreadThreads } from "$lib/data"
-	
+
 	/** If true, only the essential elements are shown. */
 	export let minimal: boolean = false
 
@@ -23,7 +22,7 @@
 	function onSearch(e: CustomEvent<{value: string}>): void
 	{
 		if (e.detail.value === "") return
-		goto(`https://old.ivorytower.com/Search.aspx?For=${e.detail.value}`)
+		location.href = `https://old.ivorytower.com/Search.aspx?For=${e.detail.value}`
 	}
 
 	$: if (browser)
@@ -132,7 +131,7 @@
 				align-items: flex-start;
 			}
 		}
-		
+
 		li
 		{
 			display: inline-block;
@@ -143,14 +142,14 @@
 				margin-bottom: 8px;
 			}
 		}
-		
+
 		li > *:first-child
 		{
 			display: inline-block;
 			margin: 0 12px;
 			padding: 0 8px;
 		}
-		
+
 		.expander
 		{
 			position: absolute;
@@ -204,7 +203,7 @@
 		text-decoration: none;
 		@include caps;
 	}
-	
+
 	a:hover, a:focus
 	{
 		text-decoration: underline;

diff --git a/src/routes/forums/[...id]/+page.ts b/src/routes/forums/[...id]/+page.ts
@@ -7,7 +7,7 @@ export async function load({ params }: PageLoadEvent): Promise<PageLoadOutput>
 {
 	const { id } = params
 	const forumID = id ? parseInt(id, 10) : null
-	if (forumID !== null && isNaN(forumID)) throw error(404, `There's no forum "${forumID}".`)
+	if (forumID !== null && isNaN(forumID)) error(404, `There's no forum "${forumID}".`);
 
 	return { id: forumID }
 }
diff --git a/src/routes/threads/[id]/+page.ts b/src/routes/threads/[id]/+page.ts
@@ -10,7 +10,7 @@ export async function load({ params }: LoadEvent): Promise<LoadOutput>
 {
 	const { id } = params
 	const threadID = Number.parseInt(id, 10)
-	if (isNaN(threadID)) throw error(404, `There's no thread "${id}".`)
+	if (isNaN(threadID)) error(404, `There's no thread "${id}".`);
 	const clip = browser && !location.hash.match(/^#Post\d+$/)
 
 	return { id: threadID, clip: clip, lastReload: new Date() }

diff --git a/src/routes/threads/new/+page.ts b/src/routes/threads/new/+page.ts
@@ -7,7 +7,7 @@ export async function load({ url }: PageLoadEvent): PageLoadOutput
 {
 	const id = url.searchParams.get("forum")
 	const forumID = id ? Number.parseInt(id, 10) : NaN
-	if (isNaN(forumID)) throw error(404, `There's no forum "${forumID}".`)
+	if (isNaN(forumID)) error(404, `There's no forum "${forumID}".`);
 
 	return { forumID }
 }
diff --git a/svelte.config.js b/svelte.config.js
@@ -1,11 +1,11 @@
-import sveltePreprocess from "svelte-preprocess"
 import adapterStatic from "@sveltejs/adapter-static"
+import { vitePreprocess } from "@sveltejs/vite-plugin-svelte"
 
 /** @type {import('@sveltejs/kit').Config} */
 export default {
 
 	preprocess: [
-		sveltePreprocess(),
+		vitePreprocess(),
 	],
 
 	kit: {