Remove global "auto_join_rooms" flag and use optional "/join" segments in invite links

Generated for channels, not for "normal" rooms.

README.md

@@ -53,7 +53,6 @@ The app loads runtime configutation from the server at "./config.json" and merge
 * **accentColor**   -   The accent color of the app UI. Use a HTML-style color value string, like "#ff0080".
 * **show_status_messages**  -   Whether to show only user joins/leaves and display name updates, or the full range of room status updates. Possible values are "never" (only the above), "moderators" (moderators will see all status updates) or "always" (everyone will see all status updates). Defaults to "always".
 * **maxSizeAutoDownloads** -    Attachments smaller than this will be auto downloaded. Default is 10Mb.
-* **auto_join_rooms** -     Whether to show the normal "join" screen or just auto join the user to the room link. Default to false.
 
 ### Sticker short codes - To enable sticker short codes, follow these steps:
 * Run the "create sticker config" script using "npm run create-sticker-config <path-to-sticker-packs>"

src/components/Chat.vue

@@ -1055,7 +1055,7 @@ export default {
       this.$navigation.push(
         {
           name: "Join",
-          params: { roomId: util.sanitizeRoomId(this.roomAliasOrId) },
+          params: { roomId: util.sanitizeRoomId(this.roomAliasOrId), join: this.$route.params.join },
         },
         0
       );

src/components/Join.vue

@@ -306,7 +306,7 @@ export default {
       return roomName ? roomName : "";
     },
     getRoomInfo() {
-      if (this.$config.auto_join_rooms) {
+      if (this.$route.params.join) {
         // Auto-join room
         this.waitingForRoomCreation = true;
         this.$nextTick(() => {

src/components/messages/ContactJoin.vue

@@ -1,14 +1,6 @@
 <template>
-  <div v-if="$config.auto_join_rooms && !roomCreatedByYou() && event.getSender() == $matrix.currentUserId" class="created-room-welcome-header" style="white-space: pre-line;">
-    {{ $t('room_welcome.info_auto_join',{room: room ? room.name : "",you: $matrix.currentUserDisplayName}) }}
-    <div class="ma-0">
-      <a href="#" text @click.prevent="viewProfile">
-        {{ $t("room_welcome.change") }}
-      </a>
-    </div>
-  </div>
   <!-- Contact joined the chat -->
-  <div v-else class="messageJoin">
+  <div class="messageJoin">
     {{ $t('message.user_joined',{user: eventSenderDisplayName(event)}) }}
   </div>
 </template>
@@ -18,19 +10,6 @@ import messageMixin from "./messageMixin";
 
 export default {
   mixins: [messageMixin],
-  methods: {
-    viewProfile() {
-      this.$navigation.push({ name: "Profile" }, 1);
-    },
-    roomCreatedByYou() {
-      const createEvent = this.room && this.room.currentState.getStateEvents("m.room.create", "");
-      if (createEvent) {
-        const creatorId = createEvent.getContent().creator;
-        return (creatorId == this.$matrix.currentUserId);
-      }
-      return false;
-    },
-  }
 };
 </script>
 

src/components/roomInfoMixin.js

@@ -1,4 +1,4 @@
-import utils from "../plugins/utils";
+import utils, { ROOM_TYPE_CHANNEL } from "../plugins/utils";
 import roomTypeMixin from "./roomTypeMixin";
 
 export default {
@@ -96,7 +96,8 @@ export default {
           this.room.getCanonicalAlias(),
           this.room.roomId,
           this.room.name,
-          utils.roomDisplayTypeToQueryParam(this.room, this.roomDisplayType)
+          utils.roomDisplayTypeToQueryParam(this.room, this.roomDisplayType),
+          this.roomDisplayType == ROOM_TYPE_CHANNEL /* Auto join for channels */
         );
       }
       return null;

src/components/welcome_headers/WelcomeHeaderChannelUser.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="created-room-welcome-header">
-    <div v-if="$config.auto_join_rooms" style="white-space: pre-line;">
+    <div style="white-space: pre-line;">
     {{ $t('room_welcome.info_auto_join',{room: room ? room.name : "",you: $matrix.currentUserDisplayName}) }}
       <a href="#" text @click.prevent="viewProfile">
         {{ $t("room_welcome.change") }}

src/router/index.js

@@ -20,13 +20,13 @@ const routes = [
     component: Home
   },
   {
-    path: '/room/:roomId?',
+    path: '/room/:join(join/)?:roomId?',
     name: 'Chat',
     component: Chat,
     meta: {
       includeRoom: true,
       includeFavicon: true
-    }
+    },
   },
   {
     path: '/info',
@@ -73,7 +73,7 @@ const routes = [
     props: true
   },
   {
-    path: '/join/:roomId?',
+    path: '/join/:join(join/)?:roomId?',
     name: 'Join',
     component: Join
   },
@@ -170,7 +170,7 @@ router.beforeEach((to, from, next) => {
   }
 });
 
-router.getRoomLink = function (alias, roomId, roomName, mode) {
+router.getRoomLink = function (alias, roomId, roomName, mode, autojoin) {
   let params = {};
   if ((!alias || roomName.replace(/\s/g, "").toLowerCase() !== util.getRoomNameFromAlias(alias)) && roomName) {
     // There is no longer a correlation between alias and room name, probably because room name has
@@ -181,13 +181,14 @@ router.getRoomLink = function (alias, roomId, roomName, mode) {
     // Optional mode given, append as "m" query param
     params["m"] = mode;
   }
+  const autoJoinSegment = autojoin ? "join/" : "";
   if (Object.entries(params).length > 0) {
     const queryString = Object.entries(params)
       .map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
       .join('&')
-    return window.location.origin + window.location.pathname + "?" + queryString + "#/room/" + encodeURIComponent(util.sanitizeRoomId(alias || roomId));
+    return window.location.origin + window.location.pathname + "?" + queryString + "#/room/" + autoJoinSegment + encodeURIComponent(util.sanitizeRoomId(alias || roomId));
   }
-  return window.location.origin + window.location.pathname + "#/room/" + encodeURIComponent(util.sanitizeRoomId(alias || roomId));
+  return window.location.origin + window.location.pathname + "#/room/" + autoJoinSegment + encodeURIComponent(util.sanitizeRoomId(alias || roomId));
 }
 
 router.getDMLink = function (user, config) {