From 6608f0c8ce331908024fb234546a5f7b7132ba9c Mon Sep 17 00:00:00 2001
From: N-Pex <npexdev@gmail.com>
Date: Tue, 12 Jan 2021 11:26:01 +0100
Subject: [PATCH] Expose room id in navigation

So rooms can be bookmarked, issue #26.
---
 src/components/Chat.vue       |  5 ++++-
 src/components/ChatHeader.vue |  2 +-
 src/components/Join.vue       |  6 +++---
 src/components/Login.vue      |  4 ++--
 src/components/RoomList.vue   |  2 +-
 src/plugins/utils.js          |  7 +++++++
 src/router/index.js           | 10 ++++++----
 7 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/src/components/Chat.vue b/src/components/Chat.vue
index b28a78e..04d1577 100644
--- a/src/components/Chat.vue
+++ b/src/components/Chat.vue
@@ -337,7 +337,10 @@ export default {
   watch: {
     room: {
       immediate: true,
-      handler(room, ignoredOldVal) {
+      handler(room, oldRoom) {
+        if (room == oldRoom) {
+          return; // No change.
+        }
         console.log("Chat: Current room changed");
 
         // Clear old events
diff --git a/src/components/ChatHeader.vue b/src/components/ChatHeader.vue
index ee026ca..598be84 100644
--- a/src/components/ChatHeader.vue
+++ b/src/components/ChatHeader.vue
@@ -106,7 +106,7 @@ export default {
       .then(() => {
         console.log("Left room");
         this.$matrix.matrixClient.store.removeRoom(roomId);
-        this.$matrix.setCurrentRoomId(null);
+        this.$navigation.push({name:'Chat'}, -1);
       })
       .catch(err => {
         console.log("Error leaving", err);
diff --git a/src/components/Join.vue b/src/components/Join.vue
index 57edbe9..3a30669 100644
--- a/src/components/Join.vue
+++ b/src/components/Join.vue
@@ -62,6 +62,7 @@
 
 <script>
 import User from "../models/user";
+import util from "../plugins/utils";
 
 export default {
   name: "Join",
@@ -92,7 +93,7 @@ export default {
             const room = self.$matrix.getRoom(self.roomId);
             if (room && room.hasMembershipState(self.currentUser.user_id, "join")) {
               // Yes, go to room
-              self.$navigation.push({ name: "Chat" }, -1);
+              self.$navigation.push({ name: 'Chat', params: { roomId: util.sanitizeRoomId(self.roomId) }}, -1);
               return;
           }
           this.waitingForMembership = false;
@@ -144,11 +145,10 @@ export default {
           return this.$matrix.matrixClient.joinRoom(this.roomId);
         })
         .then((room) => {
-          this.$matrix.setCurrentRoomId(room.roomId);
           this.loading = false;
           this.loadingMessage = null;
           this.$nextTick(() => {
-            this.$navigation.push({ name: "Chat" }, -1);
+            this.$navigation.push({ name: "Chat", params: { roomId: room.roomId }}, -1);
           });
         })
         .catch((err) => {
diff --git a/src/components/Login.vue b/src/components/Login.vue
index c3603c0..402a1c6 100644
--- a/src/components/Login.vue
+++ b/src/components/Login.vue
@@ -75,7 +75,7 @@ export default {
   },
   created() {
     if (this.loggedIn) {
-      this.$navigation.push({name: "Chat"}, -1);
+      this.$navigation.push({name: "Chat", params: { roomId: null }}, -1);
     }
   },
   watch: {
@@ -114,7 +114,7 @@ export default {
         this.loading = true;
         this.$store.dispatch("auth/login", this.user).then(
           () => {
-            this.$navigation.push({name: "Chat"}, -1);
+            this.$navigation.push({name: "Chat", params: { roomId: null }}, -1);
           },
           (error) => {
             this.loading = false;
diff --git a/src/components/RoomList.vue b/src/components/RoomList.vue
index 5b90f9d..55b53cb 100644
--- a/src/components/RoomList.vue
+++ b/src/components/RoomList.vue
@@ -26,7 +26,7 @@ export default {
   watch: {
     currentRoomId() {
       this.$emit("close");
-      this.$matrix.setCurrentRoomId(this.currentRoomId);
+      this.$navigation.push({name: 'Chat', params: { roomId: this.currentRoomId }}, -1);
     },
   },
 };
diff --git a/src/plugins/utils.js b/src/plugins/utils.js
index e0afaa8..c4946be 100644
--- a/src/plugins/utils.js
+++ b/src/plugins/utils.js
@@ -333,6 +333,13 @@ class Util {
         }
         return result;
     }
+
+    sanitizeRoomId(roomId) {
+        if (roomId && roomId.match(/^(!|#).+$/)) {
+            return roomId;
+        }
+        return null;
+    }
 }
 export default new Util();
 
diff --git a/src/router/index.js b/src/router/index.js
index 17f4ab0..d444525 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -3,6 +3,7 @@ import VueRouter from 'vue-router'
 //import Home from '../components/Home.vue'
 import Chat from '../components/Chat.vue'
 import Login from '../components/Login.vue'
+import util from '../plugins/utils'
 
 Vue.use(VueRouter)
 
@@ -13,7 +14,7 @@ const routes = [
     component: Chat
   },
   {
-    path: '/room/',
+    path: '/room/:roomId',
     name: 'Chat',
     component: Chat
   },
@@ -46,10 +47,11 @@ router.beforeEach((to, from, next) => {
   var authRequired = !publicPages.includes(to.path) && !to.path.startsWith('/join');
   const loggedIn = localStorage.getItem('user');
 
-  if (to.path.startsWith('/room/')) {
-    if (to.hash && to.hash.startsWith('#')) {
+  if (to.name == 'Chat') {
+    const roomId = util.sanitizeRoomId(to.params.roomId);
+    router.app.$matrix.setCurrentRoomId(roomId);
+    if (roomId && roomId.startsWith('#')) {
       //Invite to public room
-      router.app.$matrix.setCurrentRoomId(to.hash);
       authRequired = false;
     }
   }