feat(frontend): title everywhere

frontend/src/app.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="@sveltejs/kit" />
+
+// See https://kit.svelte.dev/docs/types#app
+// for information about these interfaces
+declare namespace App {
+    interface Stuff {
+        title: string?
+    }
+}

frontend/src/app.html

@@ -5,7 +5,6 @@
 	<meta charset="utf-8" />
 	<link rel="icon" href="/logo.svg" />
 	<meta name="viewport" content="width=device-width, initial-scale=1" />
-	<title>windmill.dev</title>
 	%sveltekit.head%
 </head>
 

frontend/src/lib/components/ScriptPicker.svelte

@@ -12,7 +12,7 @@
 	import { python, typescript } from 'svelte-highlight/languages'
 
 	import github from 'svelte-highlight/styles/github'
-	import { getScript, getScriptByPath } from '$lib/utils'
+	import { getScriptByPath } from '$lib/utils'
 
 	export let scriptPath: string | undefined = undefined
 	export let allowFlow = false

frontend/src/routes/__layout-none.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+	import { page } from '$app/stores'
+
 	import { SvelteToast } from '@zerodevx/svelte-toast'
 
 	// Default toast options
@@ -14,6 +16,10 @@
 	}
 </script>
 
+<svelte:head>
+	<title>{$page.stuff.title ? `${$page.stuff.title} | ` : ''}Windmill</title>
+</svelte:head>
+
 <slot />
 <SvelteToast options={toastOptions} />
 

frontend/src/routes/audit_logs.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Audit Logs' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { AuditService, AuditLog, UserService } from '$lib/gen'
 	import type { ActionKind } from '$lib/common'

frontend/src/routes/flows.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Flows' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import Fuse from 'fuse.js'
 	import { FlowService, type OpenFlow } from '$lib/gen'

frontend/src/routes/flows/add.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: `New Flow` }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { page } from '$app/stores'
 

frontend/src/routes/flows/edit/[...path].svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load({ params }) {
+		return {
+			stuff: { title: `Edit Flow ${params.path}` }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { FlowService, type Flow } from '$lib/gen'
 

frontend/src/routes/flows/get/[...path].svelte

@@ -1,7 +1,15 @@
+<script context="module">
+	export function load({ params }) {
+		return {
+			stuff: { title: `Flow ${params.path}` }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { page } from '$app/stores'
 	import { FlowService, type Flow } from '$lib/gen'
-	import { sendUserToast, displayDaysAgo, canWrite } from '$lib/utils'
+	import { displayDaysAgo, canWrite } from '$lib/utils'
 	import Icon from 'svelte-awesome'
 	import {
 		faPlay,
@@ -17,7 +25,6 @@
 	import { userStore, workspaceStore } from '$lib/stores'
 	import SharedBadge from '$lib/components/SharedBadge.svelte'
 	import SvelteMarkdown from 'svelte-markdown'
-	import SchemaViewer from '$lib/components/SchemaViewer.svelte'
 	import Dropdown from '$lib/components/Dropdown.svelte'
 	import CenteredPage from '$lib/components/CenteredPage.svelte'
 	import FlowViewer from '$lib/components/FlowViewer.svelte'

frontend/src/routes/flows/run/[...path].svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load({ params }) {
+		return {
+			stuff: { title: `Run Flow ${params.path}` }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { page } from '$app/stores'
 	import { sendUserToast } from '$lib/utils'

frontend/src/routes/groups.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Groups' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { canWrite } from '$lib/utils'
 	import { GroupService } from '$lib/gen'

frontend/src/routes/resources.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Resources' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { canWrite, emptySchema, sendUserToast } from '$lib/utils'
 	import { ResourceService, VariableService } from '$lib/gen'

frontend/src/routes/run/[...run].svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load({ params }) {
+		return {
+			stuff: { title: `Run ${params.run}` }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { page } from '$app/stores'
 	import { JobService, Job } from '$lib/gen'

frontend/src/routes/runs/[...path].svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Runs' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { onDestroy } from 'svelte'
 	import { JobService, Job, CompletedJob } from '$lib/gen'

frontend/src/routes/schedule/add.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'New Schedule' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { page } from '$app/stores'
 	import { sendUserToast, displayDate } from '$lib/utils'

frontend/src/routes/schedules.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Schedules' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { sendUserToast, displayDate, canWrite } from '$lib/utils'
 	import { type Schedule, ScheduleService } from '$lib/gen'

frontend/src/routes/scripts.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Scripts' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import {
 		faArchive,

frontend/src/routes/scripts/add.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: `New Script` }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { Script, ScriptService } from '$lib/gen'
 

frontend/src/routes/scripts/edit/[...hash].svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load({ params }) {
+		return {
+			stuff: { title: `Edit Script ${params.hash}` }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { ScriptService, type Script } from '$lib/gen'
 

frontend/src/routes/scripts/get/[...hash].svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load({ params }) {
+		return {
+			stuff: { title: `Script ${params.hash}` }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { page } from '$app/stores'
 	import { ScriptService, type Script } from '$lib/gen'

frontend/src/routes/scripts/run/[...hash].svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load({ params }) {
+		return {
+			stuff: { title: `Run Script ${params.hash}` }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { page } from '$app/stores'
 	import { emptySchema, sendUserToast } from '$lib/utils'

frontend/src/routes/user/login@user.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Login' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { goto } from '$app/navigation'
 	import { page } from '$app/stores'

frontend/src/routes/user/workspaces@user.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Workspace Selection' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { goto } from '$app/navigation'
 	import { page } from '$app/stores'

frontend/src/routes/variables.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Variables' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { canWrite, sendUserToast } from '$lib/utils'
 	import { OauthService, VariableService } from '$lib/gen'

frontend/src/routes/workers.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Workers' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import { WorkerService, type WorkerPing } from '$lib/gen'
 	import { onDestroy, onMount } from 'svelte'

frontend/src/routes/workspace_settings.svelte

@@ -1,3 +1,11 @@
+<script context="module">
+	export function load() {
+		return {
+			stuff: { title: 'Workspace Settings' }
+		}
+	}
+</script>
+
 <script lang="ts">
 	import Fuse from 'fuse.js'
 	import { UserService, type WorkspaceInvite, WorkspaceService, OauthService } from '$lib/gen'