fix(chat): fix chat in nav bar (#929)

src/routes/chat/+page.svelte

@@ -27,7 +27,7 @@
     import { type MessageGroup as MessageGroupType } from "$lib/types"
     import EncryptedNotice from "$lib/components/messaging/EncryptedNotice.svelte"
     import { Store } from "$lib/state/Store"
-    import { derived, get } from "svelte/store"
+    import { derived, get, writable } from "svelte/store"
     import { goto } from "$app/navigation"
     import { UIStore } from "$lib/state/ui"
     import CreateGroup from "$lib/components/group/CreateGroup.svelte"
@@ -58,23 +58,15 @@
     import { routes } from "$lib/defaults/routes"
     import BottomNavBarMobile from "$lib/layouts/BottomNavBarMobile.svelte"
 
+    enum Permission {
+        UNDEFINED,
+        ALLOWED,
+        DENIED,
+    }
     let loading = false
     let contentAsideOpen = false
     let showBrowseFilesModal = false
-    let clipboardWrite = false
-
-    const checkClipboardPermission = async () => {
-        try {
-            let items = await navigator.clipboard.read()
-            await navigator.clipboard.write(items)
-            clipboardWrite = true
-        } catch (err) {
-            clipboardWrite = false
-        }
-    }
-    onMount(async () => {
-        await checkClipboardPermission()
-    })
+    $: clipboardWrite = writable(Permission.UNDEFINED)
 
     $: sidebarOpen = UIStore.state.sidebarOpen
     $: activeChat = Store.state.activeChat
@@ -227,7 +219,7 @@
                     copy(message.text.join("\n"))
                 },
             },
-            ...(file && file.kind === MessageAttachmentKind.Image && clipboardWrite
+            ...(file && file.kind === MessageAttachmentKind.Image && $clipboardWrite !== Permission.DENIED
                 ? [
                       {
                           id: "copy-image",
@@ -308,11 +300,16 @@
         if (attachment.kind !== MessageAttachmentKind.Image) return
         let result = await RaygunStoreInstance.getAttachmentRaw($conversation!.id, message, attachment.name, { size: attachment.size, type: "image/png" })
         result.onSuccess(async blob => {
-            await navigator.clipboard.write([
-                new ClipboardItem({
-                    [blob.type]: blob,
-                }),
-            ])
+            try {
+                await navigator.clipboard.write([
+                    new ClipboardItem({
+                        [blob.type]: blob,
+                    }),
+                ])
+                $clipboardWrite = Permission.ALLOWED
+            } catch (err) {
+                $clipboardWrite = Permission.DENIED
+            }
         })
     }