Start to display group conversation page

assets/js/pages/conversations/conversation.js

@@ -146,7 +146,7 @@ const ConversationPageConvPart = {
 			// Apply the list of messages
 			ConversationPageConvPart.applyMessages(list)
 
-			// Automatically unregister conversations when it becoms required
+			// Automatically unregister conversations when it becomes required
 			let reg = true;
 			document.addEventListener("changeURI", async () => {
 				if(reg) {

assets/js/pages/groups/main.js

@@ -48,6 +48,7 @@ const GroupsPage = {
 
 			//Else determine which group page to open (specified after the ID of the group)
 			var groupID = page;
+			let firstArg;
 			if(!args.subfolder || args.subfolder.split("/").length < 2){
 				page = "posts";
 			}
@@ -55,6 +56,9 @@ const GroupsPage = {
 				//Extract the page to open from the URL
 				page = args.subfolder.split("/")[1];
 
+				if (args.subfolder.split("/").length == 3)
+					firstArg = args.subfolder.split("/")[2];
+
 				//Check if there is nothing after "/"
 				if(page.length < 2)
 					page = "posts";
@@ -88,7 +92,7 @@ const GroupsPage = {
 			GroupSectionHeader.display(group, target);
 
 			// Display the tabs of the group
-			await GroupTabs.show(group, target, page);
+			await GroupTabs.show(group, target, page, firstArg);
 
 			switch(page) {
 
@@ -107,6 +111,14 @@ const GroupsPage = {
 				case "settings":
 					await GroupSettingsPage.display(group.id, target);
 					return;
+				
+				case "conversation":
+					let conv = group.conversations.find(c => c.id == firstArg);
+
+					if (conv) {
+						GroupConversationPage.show(conv, target)
+						return;
+					}
 
 				default:
 					ComunicWeb.common.error.pageNotFound(null, target);

assets/js/pages/groups/pages/conversation.js

@@ -0,0 +1,19 @@
+/**
+ * Group conversation page
+ * 
+ * @author Pierre Hubert
+ */
+
+const GroupConversationPage = {
+
+    /**
+     * Show a group conversation page
+     * 
+     * @param {Conversation} conv Information about the target conversation
+     * @param {HTMLElement} target Target page
+     */
+    show: function(conv, target) {
+        ConversationPageConvPart.open(conv.id, target)
+    }
+
+}

assets/js/pages/groups/pages/settings.js

@@ -47,7 +47,7 @@ const GroupSettingsPage = {
 
 		//Create form container
 		var formContainer = createElem2({
-	//TODO : remove comment		appendTo: settingsBox,
+			appendTo: settingsBox,
 			type: "div",
 			class: "group-settings-form"
 		});

assets/js/pages/groups/sections/tabs.js

@@ -10,8 +10,9 @@ const GroupTabs = {
      * @param {AdvancedGroupInfo} group Group information
      * @param {HTMLElement} target Target
      * @param {String} activePage Current active page
+     * @param {String} firstArg First argument passed after page (if any)
      */
-    show: async function(group, target, activePage) {
+    show: async function(group, target, activePage, firstArgument) {
         // Load template
 		const tpl = await Page.loadHTMLTemplate("pages/groups/sections/GroupTabs.html");
 		const el = document.createElement("div")
@@ -24,7 +25,9 @@ const GroupTabs = {
                 return {
                     isAdmin: group.membership == "administrator",
                     canSeeMembers: group.is_members_list_public || group.membership == "administrator" || group.membership == "moderator",
-                    activePage: activePage
+                    activePage: activePage,
+                    firstArgument: firstArgument,
+                    conversations: group.conversations,
                 }
             },
 

assets/templates/pages/groups/sections/GroupTabs.html

@@ -1,12 +1,23 @@
 <!-- Group tabs section -->
-
 <div class="row group-page tabs-container">
     <div class="col-md-6">
         <div class="nav-tabs-custom">
-            <ul class="nav nav-tabs">
+            <ul class="nav nav-tabs group-page-tabs" style="display: flex; flex-wrap: wrap; justify-content: start;">
               <li v-bind:class="activePage == 'posts' ? 'active': ''"><a @click="openPage('posts')">tr("Posts")</a></li>
+
+              <!-- Group conversations -->
+              <li v-for="conv in conversations" v-bind:class="activePage == 'conversation' && firstArgument == conv.id ? 'active': ''">
+                <a @click="openPage('conversation/' + conv.id)">{{conv.name}}</a></li>
+              </li>
+
+
+              <!-- Group members -->
               <li v-bind:class="activePage == 'members' ? 'active': ''"><a @click="openPage('members')" v-if="canSeeMembers">tr("Members")</a></li>
+              
+              <!-- About the group -->
               <li v-bind:class="activePage == 'about' ? 'active': ''"><a @click="openPage('about')">tr("About")</a></li>
+
+              <!-- Group settings -->
               <li class="pull-right" v-if="isAdmin" v-bind:class="activePage == 'settings' ? 'active': ''"><a  @click="openPage('settings')" class="text-muted"><i class="fa fa-gear"></i></a></li>
             </ul>
     </div>

system/config/dev.config.php

@@ -532,6 +532,7 @@ class Dev {
 				"js/pages/groups/pages/main.js",
 				"js/pages/groups/pages/create.js",
 				"js/pages/groups/pages/posts.js",
+				"js/pages/groups/pages/conversation.js",
 				"js/pages/groups/pages/settings.js",
 				"js/pages/groups/pages/members.js",
 				"js/pages/groups/pages/forbidden.js",