[NEW] New sidebar layout

packages/rocketchat-i18n/i18n/en.i18n.json

@@ -189,6 +189,7 @@
   "All_users_in_the_channel_can_write_new_messages": "All users in the channel can write new messages",
   "Allow_Invalid_SelfSigned_Certs": "Allow Invalid Self-Signed Certs",
   "Allow_Invalid_SelfSigned_Certs_Description": "Allow invalid and self-signed SSL certificate's for link validation and previews.",
+  "Alphabetical": "Alphabetical",
   "Allow_switching_departments": "Allow Visitor to Switch Departments",
   "Always_open_in_new_window": "Always Open in New Window",
   "Analytics_features_enabled": "Features Enabled",
@@ -701,6 +702,7 @@
   "Facebook_Page": "Facebook Page",
   "False": "False",
   "Favorite_Rooms": "Enable Favorite Rooms",
+  "Favorite": "Favorite",
   "Favorites": "Favorites",
   "Features_Enabled": "Features Enabled",
   "Field": "Field",
@@ -799,6 +801,7 @@
   "GoogleVision_Type_Properties": "Properties (Color) Detection",
   "GoogleVision_Type_SafeSearch": "SafeSearch Detection",
   "GoogleVision_Type_Similar": "Search Similar Images",
+  "Group_by_Type": "Group by Type",
   "Group_mentions_only": "Group mentions only",
   "Guest_Pool": "Guest Pool",
   "Hash": "Hash",
@@ -1222,6 +1225,7 @@
   "Mentions": "Mentions",
   "Mentions_default": "Mentions (default)",
   "Mentions_only": "Mentions only",
+  "Merge_Channels": "Merge Channels",
   "Message": "Message",
   "Message_AllowBadWordsFilter": "Allow Message bad words filtering",
   "Message_AllowDeleting": "Allow Message Deleting",
@@ -1702,6 +1706,7 @@
   "Should_exists_a_user_with_this_username": "The user must already exist.",
   "Show_agent_email": "Show agent email",
   "Show_all": "Show All",
+  "Show_Avatars": "Show Avatars",
   "Show_counter": "Show counter",
   "Show_room_counter_on_sidebar": "Show room counter on sidebar",
   "Show_more": "Show more",
@@ -1764,7 +1769,6 @@
   "Sort_by_activity": "Sort by Activity",
   "Sound": "Sound",
   "Sound_File_mp3": "Sound File (mp3)",
-  "Split_by_categories": "Split by categories",
   "SSL": "SSL",
   "Star_Message": "Star Message",
   "Starred_Messages": "Starred Messages",
@@ -1955,6 +1959,7 @@
   "Unmute_user": "Unmute user",
   "Unnamed": "Unnamed",
   "Unpin_Message": "Unpin Message",
+  "Unread" : "Unread",
   "Unread_Count": "Unread Count",
   "Unread_Count_DM": "Unread Count for Direct Messages",
   "Unread_Messages": "Unread Messages",

packages/rocketchat-lib/lib/roomTypes/conversation.js

@@ -3,14 +3,14 @@ import { RoomTypeConfig } from '../RoomTypeConfig';
 export class ConversationRoomType extends RoomTypeConfig {
 	constructor() {
 		super({
-			identifier: 'activity',
+			identifier: 'merged',
 			order: 30,
 			label: 'Conversations'
 		});
 	}
 
 	condition() {
 		const user = Meteor.user();
-		return RocketChat.getUserPreference(user, 'roomsListExhibitionMode') === 'activity';
+		return RocketChat.getUserPreference(user, 'mergeChannels');
 	}
 }

packages/rocketchat-lib/lib/roomTypes/direct.js

@@ -62,8 +62,8 @@ export class DirectMessageRoomType extends RoomTypeConfig {
 
 	condition() {
 		const user = Meteor.user();
-		const roomsListExhibitionMode = RocketChat.getUserPreference(user, 'roomsListExhibitionMode');
-		return !roomsListExhibitionMode || ['unread', 'category'].includes(roomsListExhibitionMode) && RocketChat.authz.hasAtLeastOnePermission(['view-d-room', 'view-joined-room']);
+		const mergeChannels = RocketChat.getUserPreference(user, 'mergeChannels');
+		return !mergeChannels && RocketChat.authz.hasAtLeastOnePermission(['view-d-room', 'view-joined-room']);
 	}
 
 	getUserStatus(roomId) {

packages/rocketchat-lib/lib/roomTypes/favorite.js

@@ -10,4 +10,8 @@ export class FavoriteRoomType extends RoomTypeConfig {
 			label: 'Favorites'
 		});
 	}
+	condition() {
+		const user = Meteor.user();
+		return RocketChat.settings.get('Favorite_Rooms') && RocketChat.getUserPreference(user, 'sidebarShowFavorites');
+	}
 }

packages/rocketchat-lib/lib/roomTypes/index.js

@@ -1,4 +1,3 @@
-import { ChannelsRoomType } from './channels';
 import { ConversationRoomType } from './conversation';
 import { DirectMessageRoomType } from './direct';
 import { FavoriteRoomType } from './favorite';
@@ -7,7 +6,6 @@ import { PublicRoomType } from './public';
 import { UnreadRoomType } from './unread';
 
 export {
-	ChannelsRoomType,
 	ConversationRoomType,
 	DirectMessageRoomType,
 	FavoriteRoomType,

packages/rocketchat-lib/lib/roomTypes/private.js

@@ -44,9 +44,8 @@ export class PrivateRoomType extends RoomTypeConfig {
 
 	condition() {
 		const user = Meteor.user();
-		const roomsListExhibitionMode = RocketChat.getUserPreference(user, 'roomsListExhibitionMode');
 		const mergeChannels = RocketChat.getUserPreference(user, 'mergeChannels');
-		return !roomsListExhibitionMode || ['unread', 'category'].includes(roomsListExhibitionMode) && !mergeChannels && RocketChat.authz.hasAllPermission('view-p-room');
+		return !mergeChannels && RocketChat.authz.hasAllPermission('view-p-room');
 	}
 
 	isGroupChat() {

packages/rocketchat-lib/lib/roomTypes/public.js

@@ -42,9 +42,9 @@ export class PublicRoomType extends RoomTypeConfig {
 
 	condition() {
 		const user = Meteor.user();
-		const roomsListExhibitionMode = RocketChat.getUserPreference(user, 'roomsListExhibitionMode');
+		// const roomsListExhibitionMode = RocketChat.getUserPreference(user, 'roomsListExhibitionMode');
 		const mergeChannels = RocketChat.getUserPreference(user, 'mergeChannels');
-		return !roomsListExhibitionMode || ['unread', 'category'].includes(roomsListExhibitionMode) && !mergeChannels && (RocketChat.authz.hasAtLeastOnePermission(['view-c-room', 'view-joined-room']) || RocketChat.settings.get('Accounts_AllowAnonymousRead') === true);
+		return !mergeChannels && (RocketChat.authz.hasAtLeastOnePermission(['view-c-room', 'view-joined-room']) || RocketChat.settings.get('Accounts_AllowAnonymousRead') === true);
 	}
 
 	showJoinLink(roomId) {

packages/rocketchat-lib/lib/roomTypes/unread.js

@@ -13,6 +13,6 @@ export class UnreadRoomType extends RoomTypeConfig {
 
 	condition() {
 		const user = Meteor.user();
-		return RocketChat.getUserPreference(user, 'roomsListExhibitionMode') === 'unread';
+		return RocketChat.getUserPreference(user, 'sidebarShowUnread');
 	}
 }

packages/rocketchat-lib/package.js

@@ -43,7 +43,6 @@ Package.onUse(function(api) {
 	// ROOM TYPES
 	api.addFiles('lib/RoomTypeConfig.js');
 	api.addFiles([
-		'lib/roomTypes/channels.js',
 		'lib/roomTypes/conversation.js',
 		'lib/roomTypes/direct.js',
 		'lib/roomTypes/favorite.js',

packages/rocketchat-lib/server/models/Users.js

@@ -436,10 +436,15 @@ class ModelUsers extends RocketChat.models._Base {
 	}
 
 	setPreferences(_id, preferences) {
+		const settings = Object.assign(
+			{},
+			...Object.keys(preferences).map(key => {
+				return {[`settings.preferences.${ key }`]: preferences[key]};
+			})
+		);
+
 		const update = {
-			$set: {
-				'settings.preferences': preferences
-			}
+			$set: settings
 		};
 
 		return this.update(_id, update);

packages/rocketchat-lib/startup/defaultRoomTypes.js

@@ -1,5 +1,4 @@
 import {
-	ChannelsRoomType,
 	ConversationRoomType,
 	DirectMessageRoomType,
 	FavoriteRoomType,
@@ -11,7 +10,6 @@ import {
 RocketChat.roomTypes.add(new UnreadRoomType());
 RocketChat.roomTypes.add(new FavoriteRoomType());
 RocketChat.roomTypes.add(new ConversationRoomType());
-RocketChat.roomTypes.add(new ChannelsRoomType());
 RocketChat.roomTypes.add(new PublicRoomType());
 RocketChat.roomTypes.add(new PrivateRoomType());
 RocketChat.roomTypes.add(new DirectMessageRoomType());

packages/rocketchat-livechat/.app/client/lib/tapi18n.js

@@ -23,6 +23,6 @@ this.tr = function(key, options, ...replaces) {
 };
 
 this.isRtl = (lang) => {
-	const language = lang ? lang : localStorage.getItem('userLanguage');
+	const language = lang ? lang : localStorage.getItem('userLanguage') ? localStorage.getItem('userLanguage') : 'en-US';
 	return ['ar', 'dv', 'fa', 'he', 'ku', 'ps', 'sd', 'ug', 'ur', 'yi'].includes(language.split('-').shift().toLowerCase());
 };

packages/rocketchat-livechat/client/stylesheets/livechat.less

@@ -623,7 +623,7 @@
 }
 
 .livechat-section {
-	margin-bottom: 32px;
+	margin-bottom: 22px;
 }
 
 .livechat-status {

packages/rocketchat-livechat/client/views/sideNav/livechat.html

@@ -15,8 +15,6 @@ <h3 class="rooms-list__type {{isActive}}">
 				<ul class="rooms-list__list inquiries">
 					{{#each room in inquiries}}
 						{{> chatRoomItem room }}
-					{{else}}
-						<p class="rooms-list__empty-room">{{_ "No_livechats" }}</p>
 					{{/each}}
 				</ul>
 			{{/if}}
@@ -32,8 +30,6 @@ <h3 class="rooms-list__type {{isActive}}">
 			{{/if}}
 			{{#each room in rooms}}
 				{{> chatRoomItem room }}
-			{{else}}
-				<p class="rooms-list__empty-room">{{_ "No_livechats" }}</p>
 			{{/each}}
 		</ul>
 	</div>

packages/rocketchat-livechat/client/views/sideNav/livechatFlex.html

@@ -1,5 +1,5 @@
 <template name="livechatFlex">
-	<aside class="sidebar-light" role="navigation">
+	<aside class="sidebar-light sidebar--medium" role="navigation">
 		<header class="sidebar-flex__header">
 			<h1 class="sidebar-flex__title">{{_ "Livechat"}}</h1>
 			{{#unless embeddedVersion}}

packages/rocketchat-theme/client/imports/components/header.css

@@ -194,7 +194,7 @@
 		cursor: pointer;
 		transition: all 0.3s;
 
-		font-size: 24px;
+		font-size: 18px;
 		align-items: center;
 
 		&.active,

packages/rocketchat-theme/client/imports/components/memberlist.css

@@ -52,18 +52,12 @@
 	}
 
 	&__status {
-		width: 6px;
+		display: inline-block;
 		width: var(--sidebar-item-user-status-size);
-		height: 6px;
 		height: var(--sidebar-item-user-status-size);
-		margin: 0 10px;
-
-		-webkit-transform: translateY(-50%);
-		transform: translateY(-50%);
+		margin: 0 7px 0 3px;
 
-		border-radius: 50%;
 		border-radius: var(--sidebar-item-user-status-radius);
-		background: var(--status-invisible);
 
 		&--online {
 			background-color: var(--status-online);
@@ -83,10 +77,12 @@
 	}
 
 	&__username {
+		display: flex;
 		flex: 1 1 auto;
 
-		margin: 0 10px;
+		margin: 0 8px;
 
 		font-size: 16px;
+		align-items: center;
 	}
 }

packages/rocketchat-theme/client/imports/components/message-box.css

@@ -136,15 +136,15 @@
 		}
 
 		& .rc-input__icon-svg--plus {
-			transition: transform 0.2s linear;
+			transition: transform 0.1s linear;
 		}
 	}
 
 	&__action-menu {
 		position: relative;
 
 		&.active .rc-input__icon-svg--plus {
-			transform: rotate(135deg);
+			transform: rotate(45deg);
 		}
 	}
 

packages/rocketchat-theme/client/imports/components/popover.css

@@ -93,6 +93,9 @@
 		font-size: var(--popover-item-text-size);
 		align-items: center;
 
+		transition: all 0.3s;
+		width: 100%;
+
 		&--alert {
 			color: var(--rc-color-error);
 
@@ -101,6 +104,10 @@
 			}
 		}
 
+		&--bold {
+			font-weight: 900;
+		}
+
 		&--star-filled .rc-icon {
 			fill: currentColor;
 		}

packages/rocketchat-theme/client/imports/components/sidebar/rooms-list.css

@@ -15,15 +15,15 @@
 	}
 
 	&__list:not(:last-child) {
-		margin-bottom: 32px;
+		margin-bottom: 22px;
 	}
 
 	&__type {
 		display: flex;
 
 		flex-direction: row;
 
-		padding: 0 var(--sidebar-default-padding) 0.5rem var(--sidebar-default-padding);
+		padding: 0 var(--sidebar-default-padding) 1rem var(--sidebar-default-padding);
 
 		color: var(--rooms-list-title-color);
 
@@ -48,13 +48,10 @@
 		position: absolute;
 		z-index: 1;
 
-		bottom: var(--sidebar-footer-height);
-		left: 0;
+		left: 10px;
 
 		overflow-y: scroll;
 
-		width: 100%;
-
 		background-color: var(--sidebar-background);
 	}
 }
@@ -67,11 +64,5 @@
 		&__empty-room {
 			padding: 0 calc(var(--sidebar-small-default-padding) - 4px) 0.5rem calc(var(--sidebar-small-default-padding) - 4px);
 		}
-
-		&__toolbar-search {
-			bottom: 0;
-
-			padding: 0 var(--sidebar-small-default-padding)  var(--sidebar-small-default-padding)  var(--sidebar-small-default-padding);
-		}
 	}
 }