is_done my own data

src/pages/ItemsPage.vue

@@ -6,7 +6,7 @@
                     <q-card class="my-card text-white bg-teal-9 text-h6">
                         <q-card-section>
                             <q-toggle :false-value="false" :label="item.nombre" :true-value="true" color="red"
-                                v-model="item.is_done" />
+                                v-model="item.is_done" @click="updateItemDone(item)" />
                             <q-icon name="edit" class="cursor-pointer q-ml-xs" />
                             <q-icon name="delete" class="cursor-pointer float-right q-mt-md text-red" />
                             <q-item-label caption class="q-ml-md"><span class="blue text-h6">
@@ -29,20 +29,38 @@
 </template>
 
 <script setup>
-import { onMounted, watch, computed } from 'vue'
+import { onMounted } from 'vue'
 import { useRoute } from 'vue-router'
 import { supabaseStore } from '../stores/supabaseStore'
 import useSupabase from '../boot/supabase'
+import { useQuasar } from 'quasar'
 
 const { supabase } = useSupabase()
 const store = supabaseStore()
 const route = useRoute()
+const $q = useQuasar()
 
-watch((computed(() => store.items)), (newItems, oldItems) => {
-    console.log(newItems, oldItems)
-
-}, { deep: true })
-
+//TODO los items de listas compartidas falta policy update
+const updateItemDone = async (item) => {
+    console.log(item)
+    try {
+        const { data, error } = await supabase
+            .from('items')
+            .update({ is_done: item.is_done })
+            .eq('id', item.id)
+            .select()
+        if (error) throw error
+        store.items = store.items.filter(i => i.id !== item.id)
+        store.items.push(data[0])
+    } catch (error) {
+        if (error instanceof Error) {
+            $q.notify({
+                type: 'negative',
+                message: error.message
+            })
+        }
+    }
+}
 
 const onLoad = (index, done) => {
     setTimeout(() => {
@@ -51,7 +69,6 @@ const onLoad = (index, done) => {
     }, 1000)
 }
 const getItems = async () => {
-    console.log('getItems', route.params.id)
     let { data: items, error } = await supabase
         .from('items')
         .select('*')