Superpowered to do lists. No signup required.

update svelte page stores imports

+9 -9
+2 -2
src/routes/+layout.svelte
··· 1 1 <script lang="ts"> 2 2 import "../app.css"; 3 3 import { onMount } from "svelte"; 4 - import { page } from "$app/stores"; 4 + import { page } from "$app/state"; 5 5 import { goto } from "$app/navigation"; 6 6 import { fade } from "svelte/transition"; 7 7 import toast, { Toaster } from "svelte-french-toast"; ··· 24 24 } 25 25 26 26 onMount(() => { 27 - if ($page.url.pathname === "/") { 27 + if (page.url.pathname === "/") { 28 28 goto(`/${pinned_list.value}`); 29 29 } 30 30 });
+7 -7
src/routes/[id]/+page.svelte
··· 1 1 <script lang="ts"> 2 - import { page } from "$app/stores"; 2 + import { page } from "$app/state"; 3 3 import { local_lists, pinned_list, generateId, type List } from "$lib/stores.svelte"; 4 4 import { goto } from "$app/navigation"; 5 5 import toast from "svelte-french-toast"; 6 6 7 7 let is_menu_open = $state(false); 8 - let list : List | undefined = $state(local_lists.value!.find((l) => l.id === $page.params.id)); 8 + let list : List | undefined = $state(local_lists.value!.find((l) => l.id === page.params.id)); 9 9 let task_input = $state(""); 10 10 let user_lists = $derived(local_lists.value) as List[]; 11 11 ··· 56 56 } 57 57 58 58 function deleteList() { 59 - if (pinned_list.value === $page.params.id) { 59 + if (pinned_list.value === page.params.id) { 60 60 toast.error("Cannot delete pinned list"); 61 61 return; 62 62 } 63 63 64 - local_lists.value = local_lists.value!.filter((l) => l.id !== $page.params.id); 64 + local_lists.value = local_lists.value!.filter((l) => l.id !== page.params.id); 65 65 list = local_lists.value.find((l) => l.id === pinned_list.value); 66 66 goto(`/${list!.id}`); 67 67 } ··· 140 140 <input 141 141 type="text" 142 142 bind:value={task.description} 143 - class="w-full hover:underline text-ellipsis overflow-hidden bg-transparent" 143 + class={`w-full hover:underline text-ellipsis overflow-hidden bg-transparent ${task.is_completed && "text-white/50"}`} 144 144 /> 145 145 </div> 146 146 147 - <div class="flex lg:hidden group-hover:flex gap-4 w-fit"> 147 + <div class="flex gap-4 w-fit"> 148 148 <button 149 149 onclick={() => deleteTask(task.id)} 150 150 class="px-4 py-2 bg-red-500 rounded-xl text-white" ··· 155 155 </li> 156 156 {/each} 157 157 <li class="flex gap-4 w-full"> 158 + <input type="text" bind:value={task_input} class="bg-transparent pr-4 py-2 border-b w-full"/> 158 159 <button onclick={addTask} class="px-5 rounded-full bg-white text-black"> 159 160 + 160 161 </button> 161 - <input type="text" bind:value={task_input} class="bg-transparent pr-4 py-2 border-b w-full"/> 162 162 </li> 163 163 </ul> 164 164