[FIX] View All members button now not in direct room (#14081)

* Fixed #14036

* Pass parameter from memberList to userInfo to show back button

* Set membersList title from userInfo

* Add a back button to userInfo

app/theme/client/imports/components/contextual-bar.css

@@ -83,6 +83,18 @@
 			}
 		}
 
+		&-back-btn {
+			position: absolute;
+			left: 0;
+
+			width: auto;
+			height: auto;
+			margin: 0;
+			padding: 0;
+
+			font-size: 22px;
+		}
+
 		&-title {
 
 			overflow: hidden;

app/ui-flextab/client/index.js

@@ -3,7 +3,6 @@ import './tabs/inviteUsers.html';
 import './tabs/membersList.html';
 import './tabs/uploadedFilesList.html';
 import './tabs/userEdit.html';
-import './tabs/userInfo.html';
 import './flexTabBar';
 import './tabs/inviteUsers';
 import './tabs/membersList';

app/ui-flextab/client/tabs/membersList.js

@@ -140,7 +140,8 @@ Template.membersList.helpers({
 			clear: Template.instance().clearUserDetail,
 			showAll: roomTypes.roomTypes[room.t].userDetailShowAll(room) || false,
 			hideAdminControls: roomTypes.roomTypes[room.t].userDetailShowAdmin(room) || false,
-			video: ['d'].includes(room != null ? room.t : undefined),
+			video: ['d'].includes(room && room.t),
+			showBackButton: roomTypes.roomTypes[room.t].isGroupChat(),
 		};
 	},
 	displayName() {
@@ -274,7 +275,7 @@ Template.membersList.onCreated(function() {
 	this.loading = new ReactiveVar(true);
 	this.loadingMore = new ReactiveVar(false);
 
-	this.tabBar = Template.instance().tabBar;
+	this.tabBar = this.data.tabBar;
 
 	this.autorun(() => {
 		if (this.data.rid == null) { return; }
@@ -282,18 +283,22 @@ Template.membersList.onCreated(function() {
 		return Meteor.call('getUsersOfRoom', this.data.rid, this.showAllUsers.get(), { limit: 100, skip: 0 }, (error, users) => {
 			if (error) {
 				console.error(error);
-				return this.loading.set(false);
+				this.loading.set(false);
 			}
 
 			this.users.set(users.records);
 			this.total.set(users.total);
-			return this.loading.set(false);
+			this.loading.set(false);
 		});
 	});
 
 	this.clearUserDetail = () => {
 		this.showDetail.set(false);
-		return setTimeout(() => this.clearRoomUserDetail(), 500);
+		this.tabBar.setData({
+			label: 'Members_List',
+			icon: 'team',
+		});
+		setTimeout(() => this.clearRoomUserDetail(), 100);
 	};
 
 	this.showUserDetail = (username, group) => {

app/ui-flextab/client/tabs/userInfo.html

@@ -2,6 +2,11 @@
 	{{#unless hideHeader}}
 		<header class="contextual-bar__header">
 			<div class="contextual-bar__header-data">
+				{{#if showBackButton}}
+					<button class="rc-button rc-button--nude contextual-bar__header-back-btn js-back" title="{{_ 'View_All'}}">
+						<i class="icon-angle-left"></i>
+					</button>
+				{{/if}}
 				{{> icon icon="user" block="contextual-bar__header-icon"}}
 				<h1 class="contextual-bar__header-title">{{_ "User_Info"}}</h1>
 			</div>
@@ -111,9 +116,6 @@
 							</div>
 						</div>
 					</div>
-					{{#if ../showAll}}
-						<button class="rc-button rc-button--outline js-back" title="{{_ 'View_All'}}">{{_ "View_All"}}</button>
-					{{/if}}
 				</section>
 			{{/with}}
 		{{/if}}

app/ui-flextab/client/tabs/userInfo.js

@@ -12,6 +12,7 @@ import { templateVarHandler } from '../../../utils';
 import { RoomRoles, UserRoles, Roles } from '../../../models';
 import { settings } from '../../../settings';
 import { getActions } from './userActions';
+import './userInfo.html';
 
 const more = function() {
 	return Template.instance().actions.get()
@@ -232,7 +233,6 @@ Template.userInfo.onCreated(function() {
 	this.user = new ReactiveVar;
 	this.actions = new ReactiveVar;
 
-
 	this.autorun(() => {
 		const user = this.user.get();
 		if (!user) {
@@ -250,8 +250,7 @@ Template.userInfo.onCreated(function() {
 	this.loadingUserInfo = new ReactiveVar(true);
 	this.loadedUsername = new ReactiveVar;
 	this.tabBar = Template.currentData().tabBar;
-
-	Meteor.setInterval(() => this.now.set(moment()), 30000);
+	this.nowInterval = setInterval(() => this.now.set(moment()), 30000);
 
 	this.autorun(() => {
 		const username = this.loadedUsername.get();
@@ -292,3 +291,7 @@ Template.userInfo.onCreated(function() {
 		return this.user.set(user);
 	});
 });
+
+Template.userInfo.onDestroyed(function() {
+	clearInterval(this.nowInterval);
+});