Get some typescript stuff working

src/app/state.ts

@@ -1,30 +1,57 @@
+import type {ComponentType} from 'svelte'
 import {readable, writable} from 'svelte/store'
-import type {FlyParams} from 'svelte/types'
+import type {FlyParams} from 'svelte/transition'
 import {fly as baseFly} from 'svelte/transition'
+import {randomId} from '@welshman/lib'
 import {pushState} from '$app/navigation'
 
 // Animations
 
-export const fly = (node: Element, params: FlyParams | undefined) => baseFly(node, {y: 20, ...params})
+export const fly = (node: Element, params?: FlyParams | undefined) => baseFly(node, {y: 20, ...params})
 
 // Toast
 
-export const toast = writable(null)
+export type Toast = {
+  id: number
+  message: string
+  options: ToastOptions
+}
+
+export type ToastOptions = {
+  timeout?: number
+}
+
+export const toast = writable<Toast | null>(null)
+
+export const pushToast = ({message = "", id = Math.random()}: Partial<Toast>, options: ToastOptions) => {
+  toast.set({id, message, options})
+
+  setTimeout(() => popToast(id), options.timeout || 5000)
+
+  return id
+}
+
+export const popToast = (id: number) => toast.update($t => $t?.id === id ? null : $t)
 
 // Modals
 
-// TODO: fix memory leak here by listening to history somehow
 export const modals = new Map()
 
-export const pushModal = (component, props) => {
-  const id = Math.random()
+export const pushModal = (component: ComponentType, props: Record<string, any>) => {
+  const id = randomId()
 
+  // TODO: fix memory leak here by listening to history somehow
   modals.set(id, {component, props})
   pushState('', {modal: id})
 
   return id
 }
 
+export const popModal = (id: string) => {
+  modals.delete(id)
+  history.back()
+}
+
 // App state
 
 export const spaces = readable([