Merge pull request #100 from sandikodev/main

resolve confusing types
icflorescu · Jan 27, 2024 · 27b5746 · 27b5746
2 parents 4504df8 + f88adff
commit 27b5746
Show file tree

Hide file tree

Showing 8 changed files with 33 additions and 11 deletions.
diff --git a/examples/bookstall/.gitignore b/examples/bookstall/.gitignore
@@ -11,3 +11,9 @@ node_modules
 # !.env.example
 
 vite.config.ts.timestamp-*.*
+
+# LOCK
+bun.lockb
+
+# PRISMA
+prisma/*.db
diff --git a/examples/bookstall/src/lib/components/AuthorizationAlert.svelte b/examples/bookstall/src/lib/components/AuthorizationAlert.svelte
@@ -4,7 +4,7 @@
 
   export let visible = false;
 
-  const dispatch = createEventDispatcher<{ close: never }>();
+  const dispatch = createEventDispatcher();
 
   const handleClose = () => {
     dispatch('close');

diff --git a/examples/bookstall/src/lib/components/DataTable.svelte b/examples/bookstall/src/lib/components/DataTable.svelte
@@ -25,7 +25,11 @@
     accessor: ((record: T) => string | number) | keyof T;
   }[];
 
-  const dispatch = createEventDispatcher<{ add: never; edit: string; delete: string }>();
+  const dispatch = createEventDispatcher<{
+    add?: never;
+    edit: string;
+    delete: string;
+  }>();
 
   const filter = debounce((q: string) => {
     goto(`${location.pathname}${q ? `?q=${q}` : ''}`, { keepFocus: true });
@@ -46,14 +50,18 @@
         on:input={(e) => filter(e.currentTarget.value)}
       />
       <!-- svelte-ignore a11y-click-events-have-key-events -->
+      <!-- svelte-ignore a11y-no-static-element-interactions -->
       <div
         class="clear-filter"
         title="Clear filter"
         on:click={() => goto(location.pathname, { keepFocus: true })}
       />
     </div>
     <!-- svelte-ignore a11y-click-events-have-key-events -->
-    <div class="icon-button" title="Add" on:click={() => dispatch('add')}><IconAdd /></div>
+    <!-- svelte-ignore a11y-no-static-element-interactions -->
+    <div class="icon-button" title="Add" on:click={() => dispatch('add')}>
+      <IconAdd />
+    </div>
   </div>
   <figure>
     <table>
@@ -92,6 +100,7 @@
               <td class="align-right nowrap">{dayjs(item.updatedAt).fromNow()}</td>
               <td class="align-right nowrap">
                 <!-- svelte-ignore a11y-click-events-have-key-events -->
+                <!-- svelte-ignore a11y-no-static-element-interactions -->
                 <div
                   class="icon-button row"
                   title="Edit"
@@ -100,6 +109,7 @@
                   <IconPencil />
                 </div>
                 <!-- svelte-ignore a11y-click-events-have-key-events -->
+                <!-- svelte-ignore a11y-no-static-element-interactions -->
                 <div
                   class="icon-button row delete"
                   title="Delete"

diff --git a/examples/bookstall/src/lib/components/HeaderNavLink.svelte b/examples/bookstall/src/lib/components/HeaderNavLink.svelte
@@ -5,7 +5,7 @@
   export let to: string | undefined = undefined;
   export let title: string;
 
-  const dispatch = createEventDispatcher<{ click: never }>();
+  const dispatch = createEventDispatcher();
 
   const handleClick = (e: MouseEvent) => {
     if (!to) {

diff --git a/examples/bookstall/src/lib/components/ModalEditor.svelte b/examples/bookstall/src/lib/components/ModalEditor.svelte
@@ -17,7 +17,7 @@
   export let busy = false;
   export let arrayFields: string[] | undefined = undefined;
 
-  const dispatch = createEventDispatcher<{ cancel: never; save: T }>();
+  const dispatch = createEventDispatcher<{ cancel?: never; save: T }>();
 
   const handleCancel = () => {
     dispatch('cancel');

diff --git a/examples/bookstall/src/lib/components/inputs/TextInput.svelte b/examples/bookstall/src/lib/components/inputs/TextInput.svelte
@@ -9,6 +9,7 @@
   export let item: Record<string, unknown> | null;
   export let errors: { message: string; path: string[] }[] | null = null;
 
+  $: value = item?.[name];
   $: error = errors?.find((e) => e.path.includes(name));
 </script>
 
@@ -20,7 +21,7 @@
     {name}
     {placeholder}
     {required}
-    value={item?.[name] || ''}
+    {value}
     aria-invalid={error ? 'true' : undefined}
   />
   {#if error}

diff --git a/examples/bookstall/src/lib/components/inputs/TextareaInput.svelte b/examples/bookstall/src/lib/components/inputs/TextareaInput.svelte
@@ -25,6 +25,7 @@
   };
 
   $: item?.[name], autosize();
+  $: value = item?.[name] as string;
 </script>
 
 <label>
@@ -34,7 +35,7 @@
     {name}
     {placeholder}
     {required}
-    value={item?.[name]}
+    {value}
     on:input={autosize}
     aria-invalid={error ? 'true' : undefined}
   />

diff --git a/examples/bookstall/src/routes/authors/+page.svelte b/examples/bookstall/src/routes/authors/+page.svelte
@@ -14,7 +14,7 @@
   export let data: PageData;
 
   let busy = false;
-  let item: RouterInputs['authors']['save'] | null = null; // 👈 we're using a helper type
+  let item: RouterInputs['authors']['save'] | null; // 👈 we're using a helper type
   let errors: { message: string; path: string[] }[] | null = null;
   let needsAuthorization = false;
 
@@ -55,15 +55,15 @@
     errors = null;
   };
 
-  const handleSave = async (e: { detail: RouterInputs['authors']['save'] }) => {
+  const handleSave = async (e: CustomEvent<RouterInputs['authors']['save']>) => {
     if (!data.isAuthenticated) {
       needsAuthorization = true;
       return;
     }
 
     busy = true;
     try {
-      await trpc().authors.save.mutate(savable(e.detail));
+      await trpc().authors.save.mutate(e.detail);
       item = null;
       await invalidateAll();
     } catch (err) {
@@ -92,7 +92,11 @@
       grow: true,
       accessor: ({ firstName, lastName }) => `${firstName} ${lastName}`
     },
-    { title: 'Books', align: 'right', accessor: (author) => author._count.books }
+    {
+      title: 'Books',
+      align: 'right',
+      accessor: (author) => author._count.books
+    }
   ]}
   on:add={handleAdd}
   on:edit={handleEdit}