Extract client Superforms utilities into $lib/validate

Author: Heliodex

Site/src/lib/validate.ts

@@ -0,0 +1,3 @@
+// client version of $lib/server/validate
+
+export { superForm } from "sveltekit-superforms/client"

Site/src/routes/(legal)/report/+page.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
-	import { superForm } from "sveltekit-superforms/client"
 	import Form from "$components/forms/Form.svelte"
 	import Select from "$components/forms/Select.svelte"
 	import Textarea from "$components/forms/Textarea.svelte"
 	import Head from "$components/Head.svelte"
+	import { superForm } from "$lib/validate"
 	import reports from "./reports"
 
 	const { data } = $props()

Site/src/routes/(main)/admin/accounts/+page.svelte

@@ -1,20 +1,24 @@
 <script lang="ts">
-	import { superForm } from "sveltekit-superforms/client"
 	import Form from "$components/forms/Form.svelte"
 	import Input from "$components/forms/Input.svelte"
 	import Head from "$components/Head.svelte"
 	import SidebarShell from "$components/SidebarShell.svelte"
 	import Tab from "$components/Tab.svelte"
 	import TabData from "$components/TabData"
 	import User from "$components/User.svelte"
+	import { superForm } from "$lib/validate"
 
 	const { data } = $props()
 
 	let formData = $derived(superForm(data.form))
 	export const snapshot = formData
 
 	let tabData = $state(
-		TabData(data.url, ["Change user password", "Users"], ["fa-key", "fa-user"])
+		TabData(
+			data.url,
+			["Change user password", "Users"],
+			["fa-key", "fa-user"]
+		)
 	)
 </script>
 
@@ -48,7 +52,7 @@
 			<tbody>
 				{#each data.users as user}
 					<tr>
-						<td><User {user} full thin bg="accent"/></td>
+						<td><User {user} full thin bg="accent" /></td>
 					</tr>
 				{/each}
 			</tbody>
@@ -61,4 +65,3 @@
 		background: var(--darker);
 	}
 </style>
-

Site/src/routes/(main)/admin/banners/+page.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-	import { superForm } from "sveltekit-superforms/client"
 	import { enhance } from "$app/forms"
 	import { invalidate } from "$app/navigation"
 	import { page } from "$app/state"
@@ -11,6 +10,7 @@
 	import Tab from "$components/Tab.svelte"
 	import TabData from "$components/TabData"
 	import User from "$components/User.svelte"
+	import { superForm } from "$lib/validate"
 
 	const { data } = $props()
 

Site/src/routes/(main)/admin/create/+page.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-	import { superForm } from "sveltekit-superforms/client"
 	import Form from "$components/forms/Form.svelte"
 	import Input from "$components/forms/Input.svelte"
 	import Select from "$components/forms/Select.svelte"
@@ -9,6 +8,7 @@
 	import Tab from "$components/Tab.svelte"
 	import TabData from "$components/TabData"
 	import types from "$lib/assetTypes"
+	import { superForm } from "$lib/validate"
 
 	const { data } = $props()
 

Site/src/routes/(main)/admin/moderation/+page.svelte

@@ -1,7 +1,6 @@
 <script lang="ts">
 	// TODO: doesn't work without clientside JS because of the date input, fix
 
-	import { superForm } from "sveltekit-superforms/client"
 	import Form from "$components/forms/Form.svelte"
 	import Input from "$components/forms/Input.svelte"
 	import Select from "$components/forms/Select.svelte"
@@ -11,6 +10,7 @@
 	import Tab from "$components/Tab.svelte"
 	import TabData from "$components/TabData"
 	import fade from "$lib/fade"
+	import { superForm } from "$lib/validate"
 	import moderationOptions from "./moderationOptions"
 
 	const { data } = $props()

Site/src/routes/(main)/admin/regkeys/+page.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-	import { superForm } from "sveltekit-superforms/client"
 	import { enhance } from "$app/forms"
 	import Form from "$components/forms/Form.svelte"
 	import Input from "$components/forms/Input.svelte"
@@ -9,6 +8,7 @@
 	import TabData from "$components/TabData"
 	import User from "$components/User.svelte"
 	import fade from "$lib/fade"
+	import { superForm } from "$lib/validate"
 
 	const { data } = $props()
 

Site/src/routes/(main)/catalog/[id=asset]/[name]/+page.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-	import { superForm } from "sveltekit-superforms/client"
 	import { applyAction, enhance } from "$app/forms"
 	import { invalidateAll } from "$app/navigation"
 	import Comment from "$components/Comment.svelte"
@@ -10,6 +9,7 @@
 	import TabNav from "$components/TabNav.svelte"
 	import User from "$components/User.svelte"
 	import types from "$lib/assetTypes"
+	import { superForm } from "$lib/validate"
 
 	let replyingTo = $state("")
 	let commentsCollapsed = $state({})

Site/src/routes/(main)/catalog/[id=asset]/[name]/settings/+page.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
 	import { get } from "svelte/store"
-	import { superForm } from "sveltekit-superforms/client"
 	import Form from "$components/forms/Form.svelte"
 	import Input from "$components/forms/Input.svelte"
 	import Textarea from "$components/forms/Textarea.svelte"
 	import Head from "$components/Head.svelte"
+	import { superForm } from "$lib/validate"
 
 	const { data } = $props()
 

Site/src/routes/(main)/develop/create/+page.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
-	import { superForm } from "sveltekit-superforms/client"
 	import Form from "$components/forms/Form.svelte"
 	import Input from "$components/forms/Input.svelte"
 	import Select from "$components/forms/Select.svelte"
 	import Textarea from "$components/forms/Textarea.svelte"
 	import Head from "$components/Head.svelte"
 	import beautifyCurrency from "$lib/beautifyCurrency"
+	import { superForm } from "$lib/validate"
 	import assetTypes from "./assetTypes"
 
 	const { data } = $props()