From 82dfdf6ed394c347deb06e97575524ba15e97d85 Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Sun, 10 Apr 2022 10:32:25 +0300
Subject: [PATCH 01/19] onReply show only latest messages and remove previous
 conversation

---
 src/components/Chat.vue | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/components/Chat.vue b/src/components/Chat.vue
index 0bdf05b..77a335b 100644
--- a/src/components/Chat.vue
+++ b/src/components/Chat.vue
@@ -137,7 +137,7 @@
           <div v-if="replyToEvent" class="row">
             <div class="col">
               <div class="font-weight-medium">{{ $t("message.replying_to", { user: replyToEvent.sender.name }) }}</div>
-              <div v-if="replyToContentType === 'm.text'" class="reply-text" :title="replyToEvent.getContent().body"> {{ replyToEvent.getContent().body }} </div>
+              <div v-if="replyToContentType === 'm.text'" class="reply-text" :title="replyToEvent.getContent().body"> {{ replyToEvent.getContent().body | latestReply }} </div>
               <div v-if="replyToContentType === 'm.image'"> {{ $t("message.reply_image") }} </div>
               <div v-if="replyToContentType === 'm.audio'"> {{ $t("message.reply_audio_message") }} </div>
               <div v-if="replyToContentType === 'm.video'"> {{ $t("message.reply_video") }} </div>
@@ -643,6 +643,16 @@ export default {
     };
   },
 
+  filters: {
+    latestReply(contents) {
+      const contentArr =  contents.split('\n').reverse();
+      if (contentArr[0] === '') {
+        contentArr.shift();
+      }
+      return contentArr[0].replace(/^> (<.*> )?/g, '');
+    }
+  },
+
   mounted() {
     const container = this.$refs.chatContainer;
     this.scrollPosition = new ScrollPosition(container);

From 52869784a5e955bbf446a53bfd46747cc73cd8af Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Sun, 10 Apr 2022 11:56:24 +0300
Subject: [PATCH 02/19] room details header improvement and fixes

---
 src/assets/css/_utilities.scss | 6 ++++++
 src/assets/css/chat.scss       | 4 +++-
 src/components/RoomInfo.vue    | 9 ++++-----
 3 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/assets/css/_utilities.scss b/src/assets/css/_utilities.scss
index f7c4fd3..53f4bfb 100644
--- a/src/assets/css/_utilities.scss
+++ b/src/assets/css/_utilities.scss
@@ -18,3 +18,9 @@
 .white-space-pre {
     white-space: pre;
 }
+.v-visible {
+    visibility: visible;
+}
+.v-hidden {
+    visibility: hidden;
+}
\ No newline at end of file
diff --git a/src/assets/css/chat.scss b/src/assets/css/chat.scss
index 6ea6685..f8dde87 100644
--- a/src/assets/css/chat.scss
+++ b/src/assets/css/chat.scss
@@ -818,7 +818,9 @@ $admin-fg: white;
     }
 
     .filled-button {
-        min-width: 180px !important;
+        @media #{map-get($display-breakpoints, 'sm-and-up')} {
+            min-width: 180px !important;
+        }
     }
 
     .v-card {
diff --git a/src/components/RoomInfo.vue b/src/components/RoomInfo.vue
index 4cb538b..56169cf 100644
--- a/src/components/RoomInfo.vue
+++ b/src/components/RoomInfo.vue
@@ -1,23 +1,22 @@
 <template>
   <div v-if="room" class="room-info">
     <div class="chat-header">
-      <v-container fluid>
-        <div class="room-name no-upper">{{ $t("room_info.title") }}</div>
+      <v-container fluid class="d-flex justify-space-between align-center">
         <v-btn
           id="btn-back"
           text
-          class="header-button-left"
-          v-show="$navigation && $navigation.canPop()"
+          :class="$navigation && $navigation.canPop() ? 'v-visible' : 'v-hidden'"
           @click.stop="$navigation.pop"
         >
           <v-icon>arrow_back</v-icon>
           <span>{{ $t("menu.back") }}</span>
         </v-btn>
+        <div class="room-name no-upper">{{ $t("room_info.title") }}</div>
         <v-btn
           id="btn-leave-room"
           color="black"
           depressed
-          class="header-button-right filled-button me-3"
+          class="filled-button"
           @click.stop="showLeaveConfirmation = true"
           >👋 {{ $t("room_info.leave_room") }}</v-btn
         >

From 22092ee681f4b48d4b69b880b64e8bfb34f9580e Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Sun, 10 Apr 2022 12:08:14 +0300
Subject: [PATCH 03/19] hide back text on mobile

---
 src/components/CreateRoom.vue | 2 +-
 src/components/RoomInfo.vue   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/CreateRoom.vue b/src/components/CreateRoom.vue
index 5619af9..a75836d 100644
--- a/src/components/CreateRoom.vue
+++ b/src/components/CreateRoom.vue
@@ -12,7 +12,7 @@
           :disabled="step > steps.NAME_SET"
         >
           <v-icon>arrow_back</v-icon>
-          <span>{{ $t("menu.back") }}</span>
+          <span class="d-none d-sm-block">{{ $t("menu.back") }}</span>
         </v-btn>
         <!-- <v-btn
           text
diff --git a/src/components/RoomInfo.vue b/src/components/RoomInfo.vue
index 56169cf..a08ed39 100644
--- a/src/components/RoomInfo.vue
+++ b/src/components/RoomInfo.vue
@@ -9,7 +9,7 @@
           @click.stop="$navigation.pop"
         >
           <v-icon>arrow_back</v-icon>
-          <span>{{ $t("menu.back") }}</span>
+          <span class="d-none d-sm-block">{{ $t("menu.back") }}</span>
         </v-btn>
         <div class="room-name no-upper">{{ $t("room_info.title") }}</div>
         <v-btn

From ed8fea5de204f8f1b67897456226ce3cec3eef0b Mon Sep 17 00:00:00 2001
From: N-Pex <npexdev@gmail.com>
Date: Mon, 11 Apr 2022 12:50:49 +0200
Subject: [PATCH 04/19] Add "start private chat" option to room member list

Issue #279.
---
 src/assets/css/chat.scss    |  8 ++++++++
 src/components/RoomInfo.vue | 26 ++++++++++++++++++++++++++
 2 files changed, 34 insertions(+)

diff --git a/src/assets/css/chat.scss b/src/assets/css/chat.scss
index f8dde87..91b087e 100644
--- a/src/assets/css/chat.scss
+++ b/src/assets/css/chat.scss
@@ -828,6 +828,14 @@ $admin-fg: white;
         border-radius: 20px;
     }
 
+    .member .user-name {
+        margin-left: 6px;
+    }
+
+    .member .start-private-chat {
+        margin-left: 38px;
+    }
+
     .member::after {
         content: " ";
         display: block;
diff --git a/src/components/RoomInfo.vue b/src/components/RoomInfo.vue
index a08ed39..3732bcc 100644
--- a/src/components/RoomInfo.vue
+++ b/src/components/RoomInfo.vue
@@ -142,6 +142,7 @@
               member.name.substring(0, 1).toUpperCase()
             }}</span>
           </v-avatar>
+          <span class="user-name">
           {{
             member.userId == $matrix.currentUserId
               ? $t("room_info.user_you", {
@@ -151,6 +152,8 @@
                   user: member.user ? member.user.displayName : member.name,
                 })
           }}
+          </span>
+          <div v-if="member.userId != $matrix.currentUserId && !$matrix.isDirectRoomWith(room, member.userId) && expandedMembers.includes(member)" class="start-private-chat clickable" @click="startPrivateChat(member.userId)">Start private chat</div>
           <DeviceList
             v-if="expandedMembers.includes(member)"
             :member="member"
@@ -205,6 +208,7 @@ import DeviceList from "../components/DeviceList";
 import QRCode from "qrcode";
 import roomInfoMixin from "./roomInfoMixin";
 import QRCodePopup from './QRCodePopup.vue';
+import util from "../plugins/utils";
 
 export default {
   name: "RoomInfo",
@@ -438,6 +442,28 @@ export default {
           this.updateQRCode();
         });
     },
+    startPrivateChat(userId) {
+      this.$matrix
+        .getOrCreatePrivateChat(userId)
+        .then((room) => {
+          this.$nextTick(() => {
+            this.$navigation.push(
+              {
+                name: "Chat",
+                params: {
+                  roomId: util.sanitizeRoomId(
+                    room.getCanonicalAlias() || room.roomId
+                  ),
+                },
+              },
+              -1
+            );
+          });
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
   },
 };
 </script>

From 702cf51573f3ab9a092d8f6a60817e3225707689 Mon Sep 17 00:00:00 2001
From: N Pex <npexdev@gmail.com>
Date: Mon, 11 Apr 2022 12:09:51 +0000
Subject: [PATCH 05/19] Only one audio play at a time

---
 src/components/messages/AudioPlayer.vue | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/components/messages/AudioPlayer.vue b/src/components/messages/AudioPlayer.vue
index e73c080..00157aa 100644
--- a/src/components/messages/AudioPlayer.vue
+++ b/src/components/messages/AudioPlayer.vue
@@ -45,6 +45,7 @@ export default {
     };
   },
   mounted() {
+    this.$root.$on('playback-start', this.onPlaybackStart);
     this.player = this.$refs.player;
     this.player.addEventListener("timeupdate", this.updateProgressBar);
     this.player.addEventListener("play", () => {
@@ -58,6 +59,9 @@ export default {
       this.playing = false;
     });
   },
+  beforeDestroy() {
+    this.$root.$off('playback-start', this.onPlaybackStart);
+  },
   computed: {
     currentTime() {
       return util.formatDuration(this.playTime);
@@ -80,6 +84,7 @@ export default {
   methods: {
     play() {
       if (this.player.src) {
+        this.$root.$emit("playback-start", this);
         if (this.player.paused) {
           this.player.play();
         } else if (this.player.ended) {
@@ -107,6 +112,11 @@ export default {
     updateDuration() {
       this.duration = 1000 * this.player.duration;
     },
+    onPlaybackStart(item) {
+      if (item != this && this.playing) {
+        this.pause();
+      }
+    }
   },
 };
 </script>

From b003a803ed5974b4864b4a3b0a7960489dc70d47 Mon Sep 17 00:00:00 2001
From: N Pex <npexdev@gmail.com>
Date: Tue, 12 Apr 2022 20:39:43 +0000
Subject: [PATCH 06/19] Some direct chat room tweaks

---
 src/services/matrix.service.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/services/matrix.service.js b/src/services/matrix.service.js
index 8401bf0..7031306 100644
--- a/src/services/matrix.service.js
+++ b/src/services/matrix.service.js
@@ -703,6 +703,7 @@ export default {
             const createRoomOptions = {
               visibility: "private", // Not listed!
               preset: "private_chat",
+              is_direct: true,
               initial_state: [
                 {
                   type: "m.room.encryption",
@@ -746,6 +747,7 @@ export default {
          */
         isDirectRoomWith(room, userId) {
           if (
+            room.getJoinRule() == "invite" &&
             room.selfMembership == "join" &&
             room.getInvitedAndJoinedMemberCount() == 2
           ) {

From b4d61c737c3422046f094cb9fb77547fed338e2a Mon Sep 17 00:00:00 2001
From: N Pex <npexdev@gmail.com>
Date: Wed, 13 Apr 2022 09:02:51 +0000
Subject: [PATCH 07/19] Add "invitations" notification to top of screen

---
 src/assets/css/chat.scss        |  5 +++++
 src/assets/translations/en.json |  1 +
 src/components/Chat.vue         | 13 +++++++++++++
 3 files changed, 19 insertions(+)

diff --git a/src/assets/css/chat.scss b/src/assets/css/chat.scss
index 91b087e..df5edc0 100644
--- a/src/assets/css/chat.scss
+++ b/src/assets/css/chat.scss
@@ -115,6 +115,11 @@ $admin-fg: white;
     background-color: $chat-background;
     overflow: hidden;
 
+    .chat-room-invitations {
+        padding: 10px;
+        background-color: #f2f2f2;
+    }
+      
     .chat-content {
         margin: 0;
         padding-top: $chat-standard-padding-s;
diff --git a/src/assets/translations/en.json b/src/assets/translations/en.json
index c2da38e..395e316 100644
--- a/src/assets/translations/en.json
+++ b/src/assets/translations/en.json
@@ -65,6 +65,7 @@
     "reply_video": "Video"
   },
   "room": {
+    "invitations": "You have no invitations | You have 1 invitation | You have {count} invitations",
     "members": "no members | 1 member | {count} members",
     "leave": "Leave",
     "purge_set_room_state": "Setting room state",
diff --git a/src/components/Chat.vue b/src/components/Chat.vue
index 77a335b..269f6c0 100644
--- a/src/components/Chat.vue
+++ b/src/components/Chat.vue
@@ -1,5 +1,8 @@
 <template>
   <div class="chat-root fill-height d-flex flex-column">
+    <div class="chat-room-invitations clickable" v-if="invitationCount > 0" @click.stop="onInvitationsClick">
+      {{ $tc("room.invitations", invitationCount)}}
+    </div>
     <ChatHeader
       class="chat-header flex-grow-0 flex-shrink-0"
       v-on:header-click="onHeaderClick"
@@ -760,6 +763,9 @@ export default {
     debugging() {
       return (window.location.host || "").startsWith("localhost");
     },
+    invitationCount() {
+      return this.$matrix.invites.length;
+    }
   },
 
   watch: {
@@ -1607,6 +1613,7 @@ export default {
     },
 
     startPrivateChat(e) {
+      this.loading = true;
       this.$matrix
         .getOrCreatePrivateChat(e.event.getSender())
         .then((room) => {
@@ -1626,6 +1633,9 @@ export default {
         })
         .catch((err) => {
           console.error(err);
+        })
+        .finally(() => {
+          this.loading = false;
         });
     },
 
@@ -1797,6 +1807,9 @@ export default {
       }
       this.$refs.roomInfoSheet.open();
     },
+    onInvitationsClick() {
+       this.$navigation.push({ name: "Home" }, -1);
+    }
   },
 };
 </script>

From 4de8392fc2a200fb74bd1e64a248d9b87a412e7b Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Sat, 16 Apr 2022 13:41:02 +0300
Subject: [PATCH 08/19] fix: joining-as-page-layout-width

---
 src/assets/css/join.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/assets/css/join.scss b/src/assets/css/join.scss
index c57ddac..ab1d755 100644
--- a/src/assets/css/join.scss
+++ b/src/assets/css/join.scss
@@ -161,4 +161,8 @@
     @media #{map-get($display-breakpoints, 'sm-and-down')} {
         margin: 10px;
     }
+    @media #{map-get($display-breakpoints, 'md-and-up')} {
+        width: $main-desktop-width;
+        margin: 0 auto;
+    }
 }

From 7c53c07c70b37ff17b722f80f627e2a9030fa2eb Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Wed, 20 Apr 2022 12:55:26 +0000
Subject: [PATCH 09/19] show only latest conversation instead of nested
 pervious messages

---
 src/components/messages/messageMixin.js | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/src/components/messages/messageMixin.js b/src/components/messages/messageMixin.js
index faa4351..4255022 100644
--- a/src/components/messages/messageMixin.js
+++ b/src/components/messages/messageMixin.js
@@ -88,10 +88,7 @@ export default {
         while (lines.length && !lines[0].startsWith('> ')) lines.shift();
         // Reply fallback has a blank line after it, so remove it to prevent leading newline
         if (lines[0] === '') lines.shift();
-        const text = lines
-        .map((item) => { return item.replace(/^> (<.*> )?/g, ''); })
-        .reverse()
-        .join('\n');
+        const text = lines[0].replace(/^> (<.*> )?/g, '');
         if (text) {
           return text;
         }
@@ -126,7 +123,7 @@ export default {
     /**
      * Classes to set for the message. Currently only for "messageIn", TODO: - detect messageIn or messageOut.
      */
-  
+
     messageClasses() {
       return {'messageIn':true,'from-admin':this.senderIsAdminOrModerator(this.event)}
     },

From 5882eef0dbcff636d3a1e6e18e8ddffc6b70e70b Mon Sep 17 00:00:00 2001
From: N Pex <npexdev@gmail.com>
Date: Wed, 20 Apr 2022 14:16:01 +0000
Subject: [PATCH 10/19] Make sure to reload rooms on self membership updates

---
 src/components/RoomList.vue        | 2 +-
 src/components/profileInfoMixin.js | 2 +-
 src/services/matrix.service.js     | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/RoomList.vue b/src/components/RoomList.vue
index a21f624..b78de3a 100644
--- a/src/components/RoomList.vue
+++ b/src/components/RoomList.vue
@@ -52,7 +52,7 @@
         <v-list-item-avatar size="40" color="#e0e0e0">
           <v-img :src="room.avatar" />
         </v-list-item-avatar>
-        <div class="room-list-notification-count">
+        <div class="room-list-notification-count" v-if="notificationCount(room) > 0">
           {{ notificationCount(room) }}
         </div>
         <v-list-item-content>
diff --git a/src/components/profileInfoMixin.js b/src/components/profileInfoMixin.js
index 02bd1e5..7a9dd35 100644
--- a/src/components/profileInfoMixin.js
+++ b/src/components/profileInfoMixin.js
@@ -1,7 +1,7 @@
 export default {
   computed: {
     user() {
-      if (!this.$matrix.matrixClient) {
+      if (!this.$matrix.ready) {
         return null;
       }
       return this.$matrix.matrixClient.getUser(this.$matrix.currentUserId);
diff --git a/src/services/matrix.service.js b/src/services/matrix.service.js
index 7031306..3a5b188 100644
--- a/src/services/matrix.service.js
+++ b/src/services/matrix.service.js
@@ -391,8 +391,8 @@ export default {
             // Invitation. Need to call "recalculate" to pick
             // up room name, not sure why exactly.
             room.recalculate();
-            this.reloadRooms();
           }
+          this.reloadRooms();
         },
 
         onSessionLoggedOut() {

From 5d05dfd0195db9e755eade2bbc22ae1012f204ba Mon Sep 17 00:00:00 2001
From: N-Pex <npexdev@gmail.com>
Date: Thu, 21 Apr 2022 09:48:10 +0200
Subject: [PATCH 11/19] Add translation keys for "today", "yesterday" and "x
 days ago".

---
 src/App.vue                     | 17 ++++++++++-------
 src/assets/translations/en.json |  3 ++-
 src/components/Chat.vue         |  7 ++++++-
 src/plugins/utils.js            | 18 +++++++-----------
 4 files changed, 25 insertions(+), 20 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 52ef75f..7fc49c7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -87,16 +87,19 @@ export default {
       // Assigns available language for ex 'zh_Hans' when browser header language is 'zh' or 'zh-HK'
       this.availableJsonTranslation= LocalesArr[LocalesArr.findIndex(locale => locale.includes(lang))];
 
-      if (this.$i18n.messages[this.browserLanguage]) {
-        this.$store.commit("setLanguage", this.browserLanguage);
-      } else if (this.browserLanguage.includes("-")) {
-        if (this.$i18n.messages[lang]) {
-          this.$store.commit("setLanguage", lang);
+      if (!this.$store.state.language) {
+        // Set default language if not set already
+        if (this.$i18n.messages[this.browserLanguage]) {
+          this.$store.commit("setLanguage", this.browserLanguage);
+        } else if (this.browserLanguage.includes("-")) {
+          if (this.$i18n.messages[lang]) {
+            this.$store.commit("setLanguage", lang);
+          } else {
+            this.$store.commit("setLanguage", this.availableJsonTranslation);
+          }
         } else {
           this.$store.commit("setLanguage", this.availableJsonTranslation);
         }
-      } else {
-        this.$store.commit("setLanguage", this.availableJsonTranslation);
       }
 
       // Set language
diff --git a/src/assets/translations/en.json b/src/assets/translations/en.json
index 395e316..574c776 100644
--- a/src/assets/translations/en.json
+++ b/src/assets/translations/en.json
@@ -62,7 +62,8 @@
     "user_changed_guest_access_open": "{user} allowed guests to join the room",
     "reply_image": "Image",
     "reply_audio_message": "Audio message",
-    "reply_video": "Video"
+    "reply_video": "Video",
+    "time_ago": "Today | Yesterday | {count} days ago"
   },
   "room": {
     "invitations": "You have no invitations | You have 1 invitation | You have {count} invitations",
diff --git a/src/components/Chat.vue b/src/components/Chat.vue
index 269f6c0..66bce7a 100644
--- a/src/components/Chat.vue
+++ b/src/components/Chat.vue
@@ -1738,7 +1738,12 @@ export default {
     },
 
     dayForEvent(event) {
-      return util.formatDay(event.getTs());
+      let dayDiff = util.dayDiffToday(event.getTs());
+      if (dayDiff < 7) {
+        return this.$tc("message.time_ago", dayDiff);
+      } else {
+        return util.formatDay(event.getTs());
+      }
     },
 
     showRecordingUI() {
diff --git a/src/plugins/utils.js b/src/plugins/utils.js
index ab3709f..ef40596 100644
--- a/src/plugins/utils.js
+++ b/src/plugins/utils.js
@@ -546,19 +546,15 @@ class Util {
         return t2.diff(t1, 'day');
     }
 
-    formatDay(timestamp) {
+    dayDiffToday(timestamp) {
         var then = dayjs(timestamp).endOf('day');
         var now = dayjs().endOf('day');
-        const dayDiff = now.diff(then, 'day');
-        if (dayDiff < 1) {
-            return "Today";
-        } else if (dayDiff < 2) {
-            return "Yesterday";
-        } else if (dayDiff < 7) {
-            return "" + dayDiff + " days ago";
-        } else {
-            return then.format('L');
-        }
+        return now.diff(then, 'day');
+    }
+
+    formatDay(timestamp) {
+        var then = dayjs(timestamp).endOf('day');
+        return then.format('L');
     }
 
     formatRecordDuration(ms) {

From 1410c6a23afaf907b27a201bdc1812130c117eaf Mon Sep 17 00:00:00 2001
From: N Pex <npexdev@gmail.com>
Date: Thu, 21 Apr 2022 08:06:53 +0000
Subject: [PATCH 12/19] Null current status text on language change (join page)

---
 src/components/Join.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/components/Join.vue b/src/components/Join.vue
index 268d0c6..f257320 100644
--- a/src/components/Join.vue
+++ b/src/components/Join.vue
@@ -272,6 +272,10 @@ export default {
         }
       },
     },
+    activeLanguage() {
+      // Null status on language change, we don't know what status we are in so we can't get the right string.
+      this.loadingMessage = null;
+    }
   },
   methods: {
     getRoomInfo() {

From b5df24270d2d16adb04095187980fc1b3a726575 Mon Sep 17 00:00:00 2001
From: N Pex <npexdev@gmail.com>
Date: Thu, 21 Apr 2022 08:21:11 +0000
Subject: [PATCH 13/19] Add "copy link" functionality to room welcome header.

---
 src/components/CreatedRoomWelcomeHeader.vue | 36 ++++++++++++++++++++-
 1 file changed, 35 insertions(+), 1 deletion(-)

diff --git a/src/components/CreatedRoomWelcomeHeader.vue b/src/components/CreatedRoomWelcomeHeader.vue
index 7e85763..074afd2 100644
--- a/src/components/CreatedRoomWelcomeHeader.vue
+++ b/src/components/CreatedRoomWelcomeHeader.vue
@@ -4,7 +4,18 @@
     <div class="mt-2" v-if="roomJoinRule == 'public'">
       <i18n path="room_welcome.join_public" tag="span">
         <template v-slot:link>
-          <a :href="publicRoomLink" class="text-break">{{ publicRoomLink }}</a>
+          <div style="position:relative;display:inline-block">
+            <a @click.stop="copyPublicLink" :href="publicRoomLink" class="text-break">{{ publicRoomLink }}</a>
+            <v-btn
+              v-if="publicRoomLinkCopied"
+              id="btn-copy-room-link"
+              color="#444444"
+              depressed
+              style="position:absolute;left:0;top:0"
+              class="filled-button link-copied-in-place"
+              >{{ $t("room_info.link_copied") }}</v-btn
+            >
+          </div>
         </template>
       </i18n>
     </div>
@@ -54,6 +65,29 @@ export default {
       return null;
     },
   },
+  data() {
+    return {
+      publicRoomLinkCopied: false
+    }
+  },
+  methods: {
+    copyPublicLink() {
+      const self = this;
+      this.$copyText(this.publicRoomLink).then(
+        function (ignored) {
+          // Success!
+          self.publicRoomLinkCopied = true;
+          setInterval(() => {
+            // Hide again
+            self.publicRoomLinkCopied = false;
+          }, 3000);
+        },
+        function (e) {
+          console.log(e);
+        }
+      );
+    }
+  }
 };
 </script>
 

From dc61bb2ba7e5f04d39129637071c729a527dc787 Mon Sep 17 00:00:00 2001
From: N Pex <npexdev@gmail.com>
Date: Thu, 21 Apr 2022 09:41:52 +0000
Subject: [PATCH 14/19] Wipe guest accounts on password errors

---
 src/App.vue                    |  7 +++++++
 src/components/Chat.vue        |  1 +
 src/services/matrix.service.js | 13 +++++++++++--
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 7fc49c7..3e6596f 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -63,6 +63,13 @@ export default {
         })
         .catch((error) => {
           console.log("Error creating client", error);
+          if (error.data.errcode ==='M_FORBIDDEN' && this.currentUser.is_guest) {
+            // Guest account and password don't work. We are in a strange state, probably because
+            // of server cleanup of accounts or similar. Wipe account and restart...
+            this.$store.commit("setUser", null);
+            this.$store.commit("setCurrentRoomId", null);
+            this.$navigation.push({ path: "/login" }, -1);
+          }
         })
         .finally(() => {
           this.loading = false;
diff --git a/src/components/Chat.vue b/src/components/Chat.vue
index 66bce7a..08e446a 100644
--- a/src/components/Chat.vue
+++ b/src/components/Chat.vue
@@ -787,6 +787,7 @@ export default {
         this.timelineWindow = null;
         this.typingMembers = [];
         this.initialLoadDone = false;
+        this.showCreatedRoomWelcomeHeader = false;
 
         // Stop RR timer
         this.stopRRTimer();
diff --git a/src/services/matrix.service.js b/src/services/matrix.service.js
index 3a5b188..1575a8e 100644
--- a/src/services/matrix.service.js
+++ b/src/services/matrix.service.js
@@ -409,12 +409,21 @@ export default {
           // we need to hang on to the generated password and use that to login to a new
           // session, so only wipe the token in s that case.
           // Clear the access token
-          var user = JSON.parse(this.$store.state.auth.user);
+          var user = this.$store.state.auth.user;
           if (user.is_guest) {
             delete user.access_token;
             this.$store.commit("setUser", user);
+
             // Login again
-            this.login(user);
+            this.login(user).catch(error => {
+              if (error.data.errcode ==='M_FORBIDDEN' && this.currentUser.is_guest) {
+                // Guest account and password don't work. We are in a strange state, probably because
+                // of server cleanup of accounts or similar. Wipe account and restart...
+                this.$store.commit("setUser", null);
+              }
+              this.$store.commit("setCurrentRoomId", null);
+              this.$navigation.push({ path: "/login" }, -1);
+            })
           } else {
             this.$store.commit("setUser", null);
             this.$store.commit("setCurrentRoomId", null);

From abf682b0787d7575b85c933ffa09c7a6752552e2 Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Mon, 25 Apr 2022 08:42:51 +0000
Subject: [PATCH 15/19] Room member hide/show button

---
 src/components/RoomInfo.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/RoomInfo.vue b/src/components/RoomInfo.vue
index 3732bcc..ad8dc3a 100644
--- a/src/components/RoomInfo.vue
+++ b/src/components/RoomInfo.vue
@@ -133,7 +133,7 @@
           class="member ma-2"
           v-for="(member, index) in joinedMembers"
           :key="member.userId"
-          v-show="showAllMembers || index < 5"
+          v-show="showAllMembers || index < SHOW_MEMBER_LIMIT"
           @click="toggleMemberExpanded(member)"
         >
           <v-avatar class="avatar" size="32" color="grey">
@@ -159,7 +159,7 @@
             :member="member"
           />
         </div>
-        <div class="show-all" @click="showAllMembers = !showAllMembers">
+        <div class="show-all" @click="showAllMembers = !showAllMembers" v-if="joinedMembers.length > SHOW_MEMBER_LIMIT">
           {{
             showAllMembers ? $t("room_info.hide_all") : $t("room_info.show_all")
           }}
@@ -244,6 +244,7 @@ export default {
           icon: "person_add",
         },
       ],
+      SHOW_MEMBER_LIMIT: 5
     };
   },
   mounted() {

From 2db20d506ab47c60c6e088df0f47718f3414780b Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Mon, 25 Apr 2022 08:43:27 +0000
Subject: [PATCH 16/19] Message operation alignment improvements

---
 src/components/Chat.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/Chat.vue b/src/components/Chat.vue
index 08e446a..a86caf2 100644
--- a/src/components/Chat.vue
+++ b/src/components/Chat.vue
@@ -831,8 +831,8 @@ export default {
                 this.$refs.messageOperationsStrut.getBoundingClientRect();
               var rectOps =
                 this.$refs.messageOperations.$el.getBoundingClientRect();
-              top = rectAnchor.top - rectChat.top;
-              left = rectAnchor.left - rectChat.left;
+              top = rectAnchor.top - rectChat.top - 50;
+              left = rectAnchor.left - rectChat.left - 30;
               if (left + rectOps.width >= rectChat.right) {
                 left = rectChat.right - rectOps.width - 10; // No overflow
               }
@@ -1598,7 +1598,7 @@ export default {
       const event = e.event;
       this.selectedEvent = event;
       this.updateRecentEmojis();
-      this.showContextMenu = true;
+      this.showContextMenu = !this.showContextMenu;
       this.showContextMenuAnchor = e.anchor;
     },
 

From 70d055ec2226d9ecf45764ca1376000eccb86b78 Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Mon, 25 Apr 2022 08:44:25 +0000
Subject: [PATCH 17/19] "Delete" button for roomAdmin added instead of "Leave"
 button

---
 src/components/ChatHeader.vue | 35 +++++++++++++++++++++++++++++++----
 src/components/RoomInfo.vue   | 22 ----------------------
 2 files changed, 31 insertions(+), 26 deletions(-)

diff --git a/src/components/ChatHeader.vue b/src/components/ChatHeader.vue
index 4d4c64a..6bb07e3 100644
--- a/src/components/ChatHeader.vue
+++ b/src/components/ChatHeader.vue
@@ -22,9 +22,25 @@
         <div class="num-members">{{ $tc("room.members", memberCount) }}</div>
       </v-col>
       <v-col cols="auto" class="text-end ma-0 pa-0">
-        <v-btn id="btn-leave-room" text class="leave-button" @click.stop="leaveRoom">{{
-          $t("room.leave")
-        }}</v-btn>
+        <v-btn
+          id="btn-purge-room"
+          v-if="userCanPurgeRoom"
+          color="red"
+          depressed
+          class="filled-button"
+          @click.stop="showPurgeConfirmation = true"
+        >
+          {{ $t("room_info.purge") }}
+        </v-btn>
+        <v-btn
+          id="btn-leave-room"
+          text
+          class="leave-button"
+          @click.stop="leaveRoom"
+          v-else
+        >
+          {{ $t("room.leave") }}
+        </v-btn>
       </v-col>
       <v-col cols="auto" class="text-end ma-0 pa-0 ms-2">
         <v-avatar
@@ -51,6 +67,12 @@
       :show="showProfileInfo"
       @close="showProfileInfo = false"
     />
+    <!-- PURGE ROOM POPUP -->
+    <PurgeRoomDialog
+      :show="showPurgeConfirmation"
+      :room="room"
+      @close="showPurgeConfirmation = false"
+    />
   </v-container>
 </template>
 
@@ -58,19 +80,24 @@
 import LeaveRoomDialog from "../components/LeaveRoomDialog";
 import ProfileInfoPopup from "../components/ProfileInfoPopup";
 import profileInfoMixin from "../components/profileInfoMixin";
+import PurgeRoomDialog from "../components/PurgeRoomDialog";
+
+import roomInfoMixin from "./roomInfoMixin";
 
 export default {
   name: "ChatHeader",
-  mixins: [profileInfoMixin],
+  mixins: [profileInfoMixin, roomInfoMixin],
   components: {
     LeaveRoomDialog,
     ProfileInfoPopup,
+    PurgeRoomDialog
   },
   data() {
     return {
       memberCount: null,
       showLeaveConfirmation: false,
       showProfileInfo: false,
+      showPurgeConfirmation: false
     };
   },
   mounted() {
diff --git a/src/components/RoomInfo.vue b/src/components/RoomInfo.vue
index 3732bcc..02053ff 100644
--- a/src/components/RoomInfo.vue
+++ b/src/components/RoomInfo.vue
@@ -167,19 +167,6 @@
       </v-card-text>
     </v-card>
 
-    <!-- PURGE ROOM -->
-    <div class="members ma-3 pa-3 text-center">
-      <v-btn
-        id="btn-purge-room"
-        v-if="userCanPurgeRoom"
-        color="red"
-        depressed
-        class="filled-button"
-        @click.stop="showPurgeConfirmation = true"
-        >{{ $t("room_info.purge") }}</v-btn
-      >
-    </div>
-
     <div class="build-version">
       {{ $t("room_info.version_info", { version: buildVersion }) }}
     </div>
@@ -190,12 +177,6 @@
       @close="showLeaveConfirmation = false"
     />
 
-    <PurgeRoomDialog
-      :show="showPurgeConfirmation"
-      :room="room"
-      @close="showPurgeConfirmation = false"
-    />
-
     <QRCodePopup :show="showFullScreenQR" :message="publicRoomLink" @close="showFullScreenQR = false" />
 
   </div>
@@ -203,7 +184,6 @@
 
 <script>
 import LeaveRoomDialog from "../components/LeaveRoomDialog";
-import PurgeRoomDialog from "../components/PurgeRoomDialog";
 import DeviceList from "../components/DeviceList";
 import QRCode from "qrcode";
 import roomInfoMixin from "./roomInfoMixin";
@@ -215,7 +195,6 @@ export default {
   mixins: [roomInfoMixin],
   components: {
     LeaveRoomDialog,
-    PurgeRoomDialog,
     DeviceList,
     QRCodePopup,
   },
@@ -226,7 +205,6 @@ export default {
       displayName: "",
       showAllMembers: false,
       showLeaveConfirmation: false,
-      showPurgeConfirmation: false,
       showFullScreenQR: false,
       expandedMembers: [],
       buildVersion: "",

From 80e5482d9acb4313b5987bdd56370a3306d56d95 Mon Sep 17 00:00:00 2001
From: N-Pex <npexdev@gmail.com>
Date: Tue, 26 Apr 2022 13:53:46 +0200
Subject: [PATCH 18/19] Fix dragging of bottom sheet

---
 src/components/BottomSheet.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/components/BottomSheet.vue b/src/components/BottomSheet.vue
index d6bf889..20e83ba 100644
--- a/src/components/BottomSheet.vue
+++ b/src/components/BottomSheet.vue
@@ -48,6 +48,7 @@ export default {
       mc: null,
       y: 0,
       startY: 0,
+      startYCoord: 0,
       isMove: false,
       state: this.defaultState,
       rect: {},
@@ -65,14 +66,20 @@ export default {
     const self = this;
 
     this.mc.on("panup pandown", (evt) => {
-      self.y = evt.center.y - 16;
+      self.y = self.startYCoord - (self.startY - evt.center.y);
     });
 
     this.mc.on("panstart", (evt) => {
       self.startY = evt.center.y;
+      self.startYCoord = this.calcY();
       self.isMove = true;
     });
 
+    this.mc.on("pancancel", (ignoredEvt) => {
+      self.y = self.startYCoord;
+      self.isMove = false;
+    });
+
     this.mc.on("panend", (evt) => {
       self.isMove = false;
 

From 5f26b5e94d1a7cabd63701985f2769d399d02576 Mon Sep 17 00:00:00 2001
From: N Pex <npexdev@gmail.com>
Date: Wed, 27 Apr 2022 14:24:39 +0000
Subject: [PATCH 19/19] Fix private chat handling code

---
 src/services/matrix.service.js | 37 +++++++++++++++++-----------------
 1 file changed, 18 insertions(+), 19 deletions(-)

diff --git a/src/services/matrix.service.js b/src/services/matrix.service.js
index 1575a8e..dd205ee 100644
--- a/src/services/matrix.service.js
+++ b/src/services/matrix.service.js
@@ -697,10 +697,14 @@ export default {
             for (const room of this.rooms) {
               // Is the other member the one we are looking for?
               if (this.isDirectRoomWith(room, userId)) {
-                var member = room.getMember(userId);
-                if (member && member.membership != "join") {
-                  // Resend invite
-                  this.matrixClient.invite(room.roomId, userId);
+                if (room.getMyMembership() == "invite") {
+                  this.matrixClient.joinRoom(room.roomId);
+                } else {
+                  var member = room.getMember(userId);
+                  if (member && member.membership != "join") {
+                    // Resend invite
+                    this.matrixClient.invite(room.roomId, userId);
+                  }
                 }
                 resolve(room);
                 return;
@@ -757,22 +761,17 @@ export default {
         isDirectRoomWith(room, userId) {
           if (
             room.getJoinRule() == "invite" &&
-            room.selfMembership == "join" &&
-            room.getInvitedAndJoinedMemberCount() == 2
+            room.getMembers().length == 2
           ) {
-            // Is the other member the one we are looking for?
-            if (
-              room
-                .getMembersWithMembership("join")
-                .some((item) => item.userId == userId)
-            ) {
-              return true;
-            } else if (
-              room
-                .getMembersWithMembership("invite")
-                .some((item) => item.userId == userId)
-            ) {
-              return true;
+            let other = room.getMember(userId);
+            if (other) {
+              if (room.getMyMembership() == "invite" && other.membership == "join") {
+                return true;
+              } else if (room.getMyMembership() == "join" && room.canInvite(this.currentUserId)) {
+                return true;
+              } else if (room.getMyMembership() == "join" && other.membership == "join") {
+                return true;
+              }
             }
           }
           return false;