add expo, massively simplify svelte and solid examples

template/apps/<@if(eq(context.project.frontend,"svelte-kit"))>web/src/routes/+page.svelte

@@ -1,11 +1,51 @@
-<script>
-  import CreateTodo from "$lib/components/CreateTodo.svelte";
-  import ListTodos from "$lib/components/ListTodos.svelte";
+<script lang="ts">
+  import { createRouter, type Todo } from "@glstack-test/rpc"
+    import type { ChangeEventHandler } from "svelte/elements";
+  const router = createRouter("http://127.0.0.1:8080");
+  let todos = $state<Todo[]>([])
+  let todoToCreateTask = $state<string>("")
+  const fetchTodos = () => {
+    router.todos.listTodos({}).then((r) => {
+      todos = r.todos;
+    })
+  }
+  $effect(() => {
+    fetchTodos()
+  })
+
+  const setTodoDone =  (id: string, task: string) => {
+    return async (event : Event & { currentTarget: HTMLInputElement }) => {
+      await router.todos.updateTodo({ todo: { id, task, done: event.currentTarget.checked } })
+      fetchTodos()
+    }
+  }
+
+  const deleteTodo = (id: string) => {
+    return async () => {
+      await router.todos.deleteTodo({ todo: { id } })
+      fetchTodos()
+    }
+  }
+
+  const createTodo = () => {
+    router.todos.createTodo({ todo: { id: crypto.randomUUID(), task: todoToCreateTask } }).then((r) => {
+      console.log(r)
+      fetchTodos()
+    }).catch((e) => {
+      console.log(e)
+    })
+  }
 </script>
 
-<main class="flex flex-col items-center gap-2 py-5">
-  <title>Todos</title>
-  <h1 class="text-5xl"> Todos </h1>
-  <CreateTodo/>
-  <ListTodos/>
-</main>
+<div>
+  <h1>Create Todo</h1>
+  <input bind:value={todoToCreateTask} type="text"/>
+  <button onclick={createTodo}> create </button>
+  {#each todos as todo (todo.id)}
+  <div>
+    {todo.task}
+    <input type='checkbox' onchange={setTodoDone(todo.id || "",todo.task)}/>
+    <button onclick={deleteTodo(todo.id || "")}>delete</button>
+  </div>
+  {/each}
+</div>