✨ Bug fixes

src/components/chat/ChatMessage.vue

@@ -35,8 +35,8 @@
         <v-card>
           <div class="flex px-2 py-0.5">
             <v-btn icon="mdi-reply" size="x-small" variant="text" @click="replyMessage" />
-            <v-btn icon="mdi-pencil" size="x-small" variant="text" color="warning" @click="editMessage" />
+            <v-btn v-if="isOwned" icon="mdi-pencil" size="x-small" variant="text" color="warning" @click="editMessage" />
-            <v-btn icon="mdi-delete" size="x-small" variant="text" color="error" @click="deleteMessage" />
+            <v-btn v-if="isOwned" icon="mdi-delete" size="x-small" variant="text" color="error" @click="deleteMessage" />
           </div>
         </v-card>
       </div>
@@ -46,12 +46,17 @@
 
 <script setup lang="ts">
 import { useChannels } from "@/stores/channels"
+import { useUserinfo } from "@/stores/userinfo"
+import { computed } from "vue"
 import MessageAttachment from "@/components/chat/renderer/MessageAttachment.vue"
 
+const id = useUserinfo()
 const channels = useChannels()
 
 const props = defineProps<{ item: any }>()
 
+const isOwned = computed(() => props.item?.sender?.id === id.userinfo.idSet.messaging)
+
 function replyMessage() {
   channels.related.messages.reply_to = JSON.parse(JSON.stringify(props.item))
 }

src/components/chat/renderer/MessageAttachment.vue

@@ -20,10 +20,10 @@
           :alt="item.filename"
           @click="openLightbox(item, idx)"
         />
-        <video v-if="item.type === 2" controls class="w-full content-visibility-auto">
+        <video v-else-if="item.type === 2" controls class="w-full content-visibility-auto">
           <source :src="getUrl(item)" />
         </video>
-        <div v-if="item.type === 3" class="w-[480px] py-12">
+        <div v-else-if="item.type === 3" class="w-[480px] py-12">
           <div class="text-center">
             <p class="mb-1">{{ getFileName(item) }}</p>
             <audio controls :src="getUrl(item)" class="mx-auto"></audio>

src/layouts/master.vue

@@ -57,6 +57,11 @@
               </template>
 
               <v-list density="compact">
+                <v-list-item
+                  title="Sign out"
+                  prepend-icon="mdi-logout-variant"
+                  @click="signout"
+                />
                 <v-list-item
                   title="Solarpass"
                   prepend-icon="mdi-passport-biometric"
@@ -96,7 +101,7 @@
 
 <script setup lang="ts">
 import { computed, ref } from "vue"
-import { useUserinfo } from "@/stores/userinfo"
+import { useUserinfo, signout as signoutAccount } from "@/stores/userinfo"
 import { useWellKnown } from "@/stores/wellKnown"
 import { useUI } from "@/stores/ui"
 import RealmList from "@/components/realms/RealmList.vue"
@@ -143,5 +148,11 @@ meta.readWellKnown()
 
 const drawerOpen = ref(true)
 const drawerMini = ref(false)
+
+async function signout() {
+  signoutAccount().then(() => {
+    window.location.reload()
+  })
+}
 </script>
 

src/stores/userinfo.ts

@@ -29,10 +29,26 @@ export async function getRtk() {
   return (await Preferences.get({ key: "identity.refresh_token" })).value
 }
 
+export async function getIdSet() {
+  const value = (await Preferences.get({ key: "userinfo.id_set" })).value
+  if (value == null) return null
+  else return JSON.parse(value)
+}
+
+export async function setIdSet(data: any) {
+  await Preferences.set({ key: "userinfo.id_set", value: JSON.stringify(data) })
+}
+
 export async function checkLoggedIn(): Promise<boolean> {
   return (await Preferences.get({ key: "identity.access_token" })).value != null
 }
 
+export async function signout() {
+  await Preferences.remove({ key: "identity.access_token" })
+  await Preferences.remove({ key: "identity.refresh_token" })
+  await Preferences.remove({ key: "userinfo.id_set" })
+}
+
 export const useUserinfo = defineStore("userinfo", () => {
   const userinfoHooks = {
     after: [useRealms().list, useChannels().list, useChannels().connect]
@@ -54,24 +70,29 @@ export const useUserinfo = defineStore("userinfo", () => {
     }
 
     const data = await res.json()
+    let idSet = await getIdSet()
 
-    const federationResp = await Promise.all([
+    if (idSet == null) {
-      request("interactive", "/api/users/me", {
+      const federationResp = await Promise.all([
-        headers: { Authorization: `Bearer ${await getAtk()}` }
+        request("interactive", "/api/users/me", {
-      }),
+          headers: { Authorization: `Bearer ${await getAtk()}` }
-      request("messaging", "/api/users/me", {
+        }),
-        headers: { Authorization: `Bearer ${await getAtk()}` }
+        request("messaging", "/api/users/me", {
+          headers: { Authorization: `Bearer ${await getAtk()}` }
+        })
+      ])
+      await setIdSet({
+        interactive: (await federationResp[0].json())["id"],
+        messaging: (await federationResp[1].json())["id"]
       })
-    ])
+      idSet = await getIdSet()
+    }
 
     userinfo.value = {
       isReady: true,
       isLoggedIn: true,
       displayName: data["nick"],
-      idSet: {
+      idSet: idSet,
-        interactive: (await federationResp[0].json())["id"],
-        messaging: (await federationResp[1].json())["id"]
-      },
       data: data
     }