From 1b94d9c4caeb32f42a29eb0d269e4493a3f21fde Mon Sep 17 00:00:00 2001
From: Vasilii Mikhailovskii <ti.webdev@ya.ru>
Date: Tue, 3 Dec 2024 00:34:32 +0200
Subject: [PATCH] refetch on change

---
 .../src/views/ManageDashboardView.vue         | 24 ++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/apps/frontend/src/views/ManageDashboardView.vue b/apps/frontend/src/views/ManageDashboardView.vue
index 66e3bb4..5d631a2 100644
--- a/apps/frontend/src/views/ManageDashboardView.vue
+++ b/apps/frontend/src/views/ManageDashboardView.vue
@@ -48,7 +48,10 @@
 
 <script setup lang="ts">
 import { useQuery } from '@tanstack/vue-query'
-import { qrCodeDbLocal } from '@/api/dbs'
+import { qrCodeDbLocal, qrCodeDbRemote } from '@/api/dbs'
+import { getUserUuid } from '@/utils/getUserUuid'
+import { onMounted } from 'vue'
+import type { QRCodeDocument } from '@hereconnect/types'
 
 const query = useQuery({
   queryKey: ['qrCodes'],
@@ -60,4 +63,23 @@ const query = useQuery({
     })
   },
 })
+
+let replication: PouchDB.Replication.Replication<QRCodeDocument> | null = null
+onMounted(() => {
+  replication = qrCodeDbLocal.replicate.from(qrCodeDbRemote, {
+    live: true,
+    selector: {
+      type: 'qr_code',
+      user_uuid: getUserUuid(),
+    },
+  })
+  replication.on('change', () => {
+    query.refetch()
+  })
+})
+onBeforeUnmount(() => {
+  if (replication) {
+    replication.cancel()
+  }
+})
 </script>