Improve members list to get only not offline users

packages/rocketchat-ui-flextab/flex-tab/tabs/membersList.coffee

@@ -42,13 +42,13 @@ Template.membersList.helpers
 
 		users = _.first(users, Template.instance().usersLimit.get())
 
-		totalUsers = roomUsernames.length
 		totalShowing = users.length
 
 		ret =
 			_id: this.rid
-			total: totalUsers
+			total: Template.instance().total.get()
 			totalShowing: totalShowing
+			loading: Template.instance().loading.get()
 			users: users
 			hasMore: hasMore
 
@@ -123,10 +123,16 @@ Template.membersList.onCreated ->
 	@userDetail = new ReactiveVar
 	@showDetail = new ReactiveVar false
 
-	@users = new ReactiveVar [];
+	@users = new ReactiveVar []
+	@total = new ReactiveVar
+	@loading = new ReactiveVar true
 
-	Meteor.call 'getUsersOfRoom', this.data.rid, (error, users) =>
-		@users.set users
+	Tracker.autorun =>
+		@loading.set true
+		Meteor.call 'getUsersOfRoom', this.data.rid, this.showAllUsers.get(), (error, users) =>
+			@users.set users.records
+			@total.set users.total
+			@loading.set false
 
 	@clearUserDetail = =>
 		@showDetail.set(false)

packages/rocketchat-ui-flextab/flex-tab/tabs/membersList.html

@@ -6,10 +6,6 @@
 				{{#with roomUsers}}
 					<div class="title">
 						<h2>{{_ "Members_List"}}</h2>
-						<p>
-							{{{_ "Showing_online_users" total_showing=totalShowing total=total}}}
-							<button class="see-all">{{seeAll}}</button>
-						</p>
 						{{> videoButtons}}
 						{{#if canAddUser}}
 							<div class="control">
@@ -21,16 +17,26 @@
 								</div>
 							</div>
 						{{/if}}
+						<p>
+							{{#unless loading}}
+								{{{_ "Showing_online_users" total_showing=totalShowing total=total}}}
+								<button class="see-all">{{seeAll}}</button>
+							{{/unless}}
+						</p>
 					</div>
 					<ul class='list clearfix lines'>
-						{{#each users}}
-							<li class='user-image user-card-room status-{{status}}'>
-								<button data-username="{{username}}" tabindex="0" title="{{username}}">
-									{{> avatar username=username}}
-									<p>{{username}} {{utcOffset}}</p>
-								</button>
-							</li>
-						{{/each}}
+						{{#if loading}}
+							{{> loading}}
+						{{else}}
+							{{#each users}}
+								<li class='user-image user-card-room status-{{status}}'>
+									<button data-username="{{username}}" tabindex="0" title="{{username}}">
+										{{> avatar username=username}}
+										<p>{{username}} {{utcOffset}}</p>
+									</button>
+								</li>
+							{{/each}}
+						{{/if}}
 					</ul>
 					{{#if hasMore}}
 						<button class="button show-more-users">{{_ "Show_more"}}</button>

server/methods/getUsersOfRoom.js

@@ -1,5 +1,5 @@
 Meteor.methods({
-	getUsersOfRoom(roomId) {
+	getUsersOfRoom(roomId, showAll) {
 		if (!Meteor.userId()) {
 			throw new Meteor.Error('error-invalid-user', 'Invalid user', { method: 'getUsersOfRoom' });
 		}
@@ -9,6 +9,28 @@ Meteor.methods({
 			throw new Meteor.Error('error-invalid-room', 'Invalid room', { method: 'getUsersOfRoom' });
 		}
 
-		return RocketChat.cache.Rooms.findByIndex('_id', roomId).fetch().usernames;
+		const filter = (record) => {
+			if (!record._user) {
+				console.log('Subscription without user', record._id);
+				return false;
+			}
+
+			if (showAll === true) {
+				return true;
+			}
+
+			return record._user.status !== 'offline';
+		}
+
+		const map = (record) => {
+			return record._user.username;
+		}
+
+		const records = RocketChat.cache.Subscriptions.findByIndex('rid', roomId).fetch();
+
+		return {
+			total: records.length,
+			records: records.filter(filter).map(map)
+		};
 	}
 });