introduce TRPC and service layer

pages/dashboard.vue

@@ -4,12 +4,13 @@
     middleware: ['auth'],
   });
 
-  const notes = await $fetch('/api/notes')  
+  const { $client } = useNuxtApp()
+  const { data: notes } = await $client.notes.useQuery({ text: 'client' })
+  
 </script>
 <template>
   <div>
-    <h3>{{ user?.user_metadata.full_name }}'s Dashboard</h3>
-    <p v-for="note in notes">{{ note.note_text }}</p><!-- TODO - wtf.. typing-->
-    <div>Stuff</div>
+    <h3>{{ user?.user_metadata.full_name }}'s Notes Dashboard</h3>
+    <p v-for="note in notes?.notes">{{ note.note_text }}</p>
   </div>
 </template>