From 47ed90ac47b9fa2f2099c4cfded354fb48cdf807 Mon Sep 17 00:00:00 2001
From: Gabriel Engel <gabriel.engel@gmail.com>
Date: Sat, 30 Sep 2017 02:04:25 -0300
Subject: [PATCH] Merge pull request #8358 from RocketChat/remove-accountBox

[FIX] remove accountBox from admin menu
---
 .../client/startup.js                         |  1 +
 .../client/admin/startup.js                   |  1 +
 .../rocketchat-emoji-custom/admin/startup.js  |  1 +
 .../rocketchat-integrations/client/startup.js |  1 +
 .../client/views/sideNav/livechatFlex.html    | 15 +++++------
 .../client/views/sideNav/livechatFlex.js      |  2 +-
 packages/rocketchat-logger/client/viewLogs.js |  3 ++-
 packages/rocketchat-mailer/client/startup.js  |  1 +
 .../admin/client/startup.js                   |  1 +
 .../components/sidebar/sidebar-flex.css       | 17 +++++++-----
 .../client/accountFlex.html                   | 15 +++++------
 .../client/accountFlex.js                     |  2 +-
 .../rocketchat-ui-admin/client/adminFlex.html | 26 +++++++++----------
 .../rocketchat-ui-admin/client/adminFlex.js   |  2 +-
 .../rocketchat-ui-master/public/icons.svg     |  6 ++++-
 .../client/sidebarItem.html                   | 14 +++++-----
 tests/pageobjects/side-nav.page.js            |  2 +-
 17 files changed, 61 insertions(+), 49 deletions(-)

diff --git a/packages/rocketchat-authorization/client/startup.js b/packages/rocketchat-authorization/client/startup.js
index c4ef2b2deaf5..fc62cafc60db 100644
--- a/packages/rocketchat-authorization/client/startup.js
+++ b/packages/rocketchat-authorization/client/startup.js
@@ -3,6 +3,7 @@ Meteor.subscribe('roles');
 RocketChat.AdminBox.addOption({
 	href: 'admin-permissions',
 	i18nLabel: 'Permissions',
+	icon: 'lock',
 	permissionGranted() {
 		return RocketChat.authz.hasAllPermission('access-permissions');
 	}
diff --git a/packages/rocketchat-custom-sounds/client/admin/startup.js b/packages/rocketchat-custom-sounds/client/admin/startup.js
index d5d5fed7d3c5..20ca6ef93175 100644
--- a/packages/rocketchat-custom-sounds/client/admin/startup.js
+++ b/packages/rocketchat-custom-sounds/client/admin/startup.js
@@ -1,6 +1,7 @@
 RocketChat.AdminBox.addOption({
 	href: 'custom-sounds',
 	i18nLabel: 'Custom_Sounds',
+	icon: 'volume',
 	permissionGranted() {
 		return RocketChat.authz.hasAtLeastOnePermission(['manage-sounds']);
 	}
diff --git a/packages/rocketchat-emoji-custom/admin/startup.js b/packages/rocketchat-emoji-custom/admin/startup.js
index 3cfaa4b825ad..71f27f95ec42 100644
--- a/packages/rocketchat-emoji-custom/admin/startup.js
+++ b/packages/rocketchat-emoji-custom/admin/startup.js
@@ -1,6 +1,7 @@
 RocketChat.AdminBox.addOption({
 	href: 'emoji-custom',
 	i18nLabel: 'Custom_Emoji',
+	icon: 'emoji',
 	permissionGranted() {
 		return RocketChat.authz.hasAtLeastOnePermission(['manage-emoji']);
 	}
diff --git a/packages/rocketchat-integrations/client/startup.js b/packages/rocketchat-integrations/client/startup.js
index 8462e3d4cb21..1f9e4e0bce11 100644
--- a/packages/rocketchat-integrations/client/startup.js
+++ b/packages/rocketchat-integrations/client/startup.js
@@ -1,5 +1,6 @@
 RocketChat.AdminBox.addOption({
 	href: 'admin-integrations',
 	i18nLabel: 'Integrations',
+	icon: 'code',
 	permissionGranted: () => RocketChat.authz.hasAtLeastOnePermission(['manage-integrations', 'manage-own-integrations'])
 });
diff --git a/packages/rocketchat-livechat/client/views/sideNav/livechatFlex.html b/packages/rocketchat-livechat/client/views/sideNav/livechatFlex.html
index db39a88c72f7..f81dc4b5ef76 100644
--- a/packages/rocketchat-livechat/client/views/sideNav/livechatFlex.html
+++ b/packages/rocketchat-livechat/client/views/sideNav/livechatFlex.html
@@ -1,14 +1,13 @@
 <template name="livechatFlex">
 	<aside class="sidebar-light" role="navigation">
-		{{#unless embeddedVersion}}
-			<header class="sidebar__header">
-				{{> accountBox lighten=true modifier="--livechat"}}
-				<button class="sidebar-flex__back-button" data-action="back">
-					{{> icon block="sidebar-flex__back-icon" icon="back"}}
-					<span>{{_ "Back_to_chat"}}</span>
+		<header class="sidebar-flex__header">
+			<h1 class="sidebar-flex__title">{{_ "Livechat"}}</h1>
+			{{#unless embeddedVersion}}
+				<button class="sidebar-flex__close-button" data-action="close">
+					{{> icon block="sidebar-flex__close-icon" icon="cross"}}
 				</button>
-			</header>
-		{{/unless}}
+			{{/unless}}
+		</header>
 		<div class="rooms-list {{#if embeddedVersion}}rooms-list--embedded{{/if}}">
 			<ul class="rooms-list__list">
 				{{> sidebarItem menuItem "Current_Chats" false "livechat-current-chats" }}
diff --git a/packages/rocketchat-livechat/client/views/sideNav/livechatFlex.js b/packages/rocketchat-livechat/client/views/sideNav/livechatFlex.js
index 4106d41ea44a..2eff33e7bd22 100644
--- a/packages/rocketchat-livechat/client/views/sideNav/livechatFlex.js
+++ b/packages/rocketchat-livechat/client/views/sideNav/livechatFlex.js
@@ -13,7 +13,7 @@ Template.livechatFlex.helpers({
 });
 
 Template.livechatFlex.events({
-	'click [data-action="back"]'() {
+	'click [data-action="close"]'() {
 		SideNav.closeFlex();
 	}
 });
diff --git a/packages/rocketchat-logger/client/viewLogs.js b/packages/rocketchat-logger/client/viewLogs.js
index 680ff3813fd8..a1d20726232a 100644
--- a/packages/rocketchat-logger/client/viewLogs.js
+++ b/packages/rocketchat-logger/client/viewLogs.js
@@ -2,9 +2,10 @@
 this.stdout = new Mongo.Collection('stdout');
 
 Meteor.startup(function() {
-	return RocketChat.AdminBox.addOption({
+	RocketChat.AdminBox.addOption({
 		href: 'admin-view-logs',
 		i18nLabel: 'View_Logs',
+		icon: 'post',
 		permissionGranted() {
 			return RocketChat.authz.hasAllPermission('view-logs');
 		}
diff --git a/packages/rocketchat-mailer/client/startup.js b/packages/rocketchat-mailer/client/startup.js
index 728ebddf8c10..33726ff23121 100644
--- a/packages/rocketchat-mailer/client/startup.js
+++ b/packages/rocketchat-mailer/client/startup.js
@@ -1,6 +1,7 @@
 RocketChat.AdminBox.addOption({
 	href: 'mailer',
 	i18nLabel: 'Mailer',
+	icon: 'mail',
 	permissionGranted() {
 		return RocketChat.authz.hasAllPermission('access-mailer');
 	}
diff --git a/packages/rocketchat-oauth2-server-config/admin/client/startup.js b/packages/rocketchat-oauth2-server-config/admin/client/startup.js
index 27cee4bd5597..930647bb526e 100644
--- a/packages/rocketchat-oauth2-server-config/admin/client/startup.js
+++ b/packages/rocketchat-oauth2-server-config/admin/client/startup.js
@@ -1,6 +1,7 @@
 RocketChat.AdminBox.addOption({
 	href: 'admin-oauth-apps',
 	i18nLabel: 'OAuth Apps',
+	icon: 'discover',
 	permissionGranted() {
 		return RocketChat.authz.hasAllPermission('manage-oauth-apps');
 	}
diff --git a/packages/rocketchat-theme/client/imports/components/sidebar/sidebar-flex.css b/packages/rocketchat-theme/client/imports/components/sidebar/sidebar-flex.css
index a2d4dc87c28e..cb2061465f4a 100644
--- a/packages/rocketchat-theme/client/imports/components/sidebar/sidebar-flex.css
+++ b/packages/rocketchat-theme/client/imports/components/sidebar/sidebar-flex.css
@@ -1,16 +1,19 @@
 .sidebar-flex {
-	&__back-button {
-		margin-left: 0.25rem;
+	&__header {
+		padding: var(--sidebar-default-padding);
 
-		padding: 1rem var(--sidebar-default-padding) 1.5rem;
-
-		color: var(--sidebar-flex-back-button-color);
+		display: flex;
+	}
 
+	&__title {
 		font-size: 1rem;
+		font-weight: 400;
+		
+		flex: 1;
 	}
 
-	&__back-icon {
-		font-size: 1.25rem;
+	&__close-button {
+		font-size: 18px;
 	}
 
 	&__search {
diff --git a/packages/rocketchat-ui-account/client/accountFlex.html b/packages/rocketchat-ui-account/client/accountFlex.html
index f0829b5eae28..a3df570e97d6 100644
--- a/packages/rocketchat-ui-account/client/accountFlex.html
+++ b/packages/rocketchat-ui-account/client/accountFlex.html
@@ -1,14 +1,13 @@
 <template name="accountFlex">
 	<aside class="sidebar-light" role="navigation">
-		{{#unless embeddedVersion}}
-			<header class="sidebar__header">
-				{{> accountBox lighten=true modifier="--account" }}
-				<button class="sidebar-flex__back-button" data-action="back">
-					{{> icon block="sidebar-flex__back-icon" icon="back"}}
-					<span>{{_ "Back_to_chat"}}</span>
+		<header class="sidebar-flex__header">
+			<h1 class="sidebar-flex__title">{{_ "My_Account"}}</h1>
+			{{#unless embeddedVersion}}
+				<button class="sidebar-flex__close-button" data-action="close">
+					{{> icon block="sidebar-flex__close-icon" icon="cross"}}
 				</button>
-			</header>
-		{{/unless}}
+			{{/unless}}
+		</header>
 		<div class="rooms-list {{#if embeddedVersion}}rooms-list--embedded{{/if}}">
 			<ul class="rooms-list__list">
 				{{> sidebarItem menuItem "Preferences" "customize" "account" "preferences" }}
diff --git a/packages/rocketchat-ui-account/client/accountFlex.js b/packages/rocketchat-ui-account/client/accountFlex.js
index 4b794bbe9857..45d9fccd75a7 100644
--- a/packages/rocketchat-ui-account/client/accountFlex.js
+++ b/packages/rocketchat-ui-account/client/accountFlex.js
@@ -1,5 +1,5 @@
 Template.accountFlex.events({
-	'click [data-action="back"]'() {
+	'click [data-action="close"]'() {
 		SideNav.closeFlex();
 	}
 });
diff --git a/packages/rocketchat-ui-admin/client/adminFlex.html b/packages/rocketchat-ui-admin/client/adminFlex.html
index 312380a62008..98c3207f9b20 100644
--- a/packages/rocketchat-ui-admin/client/adminFlex.html
+++ b/packages/rocketchat-ui-admin/client/adminFlex.html
@@ -1,34 +1,32 @@
 <template name="adminFlex">
 	<aside class="sidebar-light" role="navigation">
-		{{#unless embeddedVersion}}
-			<header class="sidebar__header">
-				{{> accountBox lighten=true modifier="--admin"}}
-				<button class="sidebar-flex__back-button" data-action="back">
-					{{> icon block="sidebar-flex__back-icon" icon="back"}}
-					<span>{{_ "Back_to_chat"}}</span>
+		<header class="sidebar-flex__header">
+			<h1 class="sidebar-flex__title">{{_ "Administration"}}</h1>
+			{{#unless embeddedVersion}}
+				<button class="sidebar-flex__close-button" data-action="close">
+					{{> icon block="sidebar-flex__close-icon" icon="cross"}}
 				</button>
-			</header>
-		{{/unless}}
+			{{/unless}}
+		</header>
 		<div class="rooms-list {{#if embeddedVersion}}rooms-list--embedded{{/if}}" aria-label="{{_ "Administration"}}">
-			<h3 class="rooms-list__type">{{_ "Administration"}}</h3>
 			<ul class="rooms-list__list">
-				{{> sidebarItem menuItem "Info" false "admin-info" "" }}
+				{{> sidebarItem menuItem "Info" "info-circled" "admin-info" "" }}
 
 				{{#if hasPermission 'run-import'}}
-					{{> sidebarItem menuItem "Import" false "admin-import" "" }}
+					{{> sidebarItem menuItem "Import" "import" "admin-import" "" }}
 				{{/if}}
 
 				{{#if hasPermission 'view-room-administration'}}
-					{{> sidebarItem menuItem "Rooms" false "admin-rooms" "" }}
+					{{> sidebarItem menuItem "Rooms" "hashtag" "admin-rooms" "" }}
 				{{/if}}
 
 				{{#if hasPermission 'view-user-administration'}}
-					{{> sidebarItem menuItem "Users" false "admin-users" "" }}
+					{{> sidebarItem menuItem "Users" "team" "admin-users" "" }}
 				{{/if}}
 
 				{{#each adminBoxOptions}}
 					{{#if permissionGranted}}
-						{{> sidebarItem menuItem label false href "" }}
+						{{> sidebarItem menuItem label icon href "" }}
 					{{/if}}
 				{{/each}}
 			</ul>
diff --git a/packages/rocketchat-ui-admin/client/adminFlex.js b/packages/rocketchat-ui-admin/client/adminFlex.js
index 836b8ec67ab1..ad181b29f588 100644
--- a/packages/rocketchat-ui-admin/client/adminFlex.js
+++ b/packages/rocketchat-ui-admin/client/adminFlex.js
@@ -70,7 +70,7 @@ Template.adminFlex.helpers({
 });
 
 Template.adminFlex.events({
-	'click [data-action="back"]'() {
+	'click [data-action="close"]'() {
 		SideNav.closeFlex();
 	},
 	'keyup [name=settings-search]'(e, t) {
diff --git a/packages/rocketchat-ui-master/public/icons.svg b/packages/rocketchat-ui-master/public/icons.svg
index f84e5c748a13..c0bb0485187e 100644
--- a/packages/rocketchat-ui-master/public/icons.svg
+++ b/packages/rocketchat-ui-master/public/icons.svg
@@ -62,4 +62,8 @@
     <symbol viewBox="0 0 20 20" id="icon-flag"><path d="M12.928 6.063l3.263-3.77a.74.74 0 0 0 .112-.759.71.71 0 0 0-.647-.422H3.141v17.72h1.406v-7.876h11.11a.71.71 0 0 0 .646-.422.691.691 0 0 0-.112-.759l-3.263-3.713zM4.547 9.578V2.547h9.562l-2.643 3.065c-.225.254-.225.647 0 .929l2.643 3.065H4.547v-.028z" fill-rule="nonzero" fill="currentColor"/></symbol>
     <symbol viewBox="0 0 20 20" id="icon-circle"><circle cx="10" cy="10" r="9" fill="currentColor" fill-rule="evenodd"/></symbol>
     <symbol viewBox="0 0 20 20" id="icon-eye-off"><g fill-rule="nonzero" fill="currentColor"><path d="M10 3.99c-3.79.004-6.658 2.896-8.542 5.44a.62.62 0 0 0 0 .739c.679.919 1.482 1.873 2.41 2.725a.62.62 0 1 0 .84-.915c-.729-.668-1.371-1.421-1.95-2.172C4.533 7.51 7.014 5.235 10 5.232c.515 0 1.011.066 1.493.187a.62.62 0 1 0 .303-1.203A7.392 7.392 0 0 0 10 3.99zM14.14 5.32a.62.62 0 0 0-.327 1.145c1.33.867 2.47 2.11 3.422 3.342-1.776 2.294-4.254 4.562-7.234 4.566-1.22-.003-2.346-.37-3.389-.972a.62.62 0 1 0-.62 1.076c1.19.686 2.537 1.135 4.008 1.137 3.79-.004 6.659-2.895 8.543-5.44a.62.62 0 0 0 0-.738c-1.052-1.424-2.399-2.934-4.051-4.011a.62.62 0 0 0-.352-.106z"/><path d="M11.722 7.895a.62.62 0 0 0-.468.993c.188.257.298.57.298.914 0 .864-.687 1.552-1.552 1.552-.371 0-.706-.127-.972-.342a.62.62 0 1 0-.779.967 2.79 2.79 0 0 0 1.751.616 2.803 2.803 0 0 0 2.793-2.793c0-.612-.2-1.185-.536-1.646a.62.62 0 0 0-.535-.261z"/><path d="M18.057 1.107a.62.62 0 0 0-.427.187L1.492 17.432a.62.62 0 1 0 .878.879L18.508 2.172a.62.62 0 0 0-.45-1.065z"/></g></symbol>
-</svg>
+    <symbol viewBox="0 0 20 20" id="icon-cross"><path d="M16.364 3.636l-6.018 6.018-6.71 6.71m12.728 0L3.636 3.636" stroke="currentColor" stroke-width="1.5" fill="none" fill-rule="evenodd" stroke-linecap="square"/></symbol>
+    <symbol viewBox="0 0 20 20" id="icon-post"><g fill="none" fill-rule="evenodd"><path d="M0 0h20v20H0z"/><path stroke="currentColor" stroke-width="1.5" d="M5 3h6l4 4v10H5z"/><path d="M8.5 10.5h3M8.5 13.5h3" stroke="currentColor" stroke-width="1.5" stroke-linecap="square"/></g></symbol>
+    <symbol viewBox="0 0 20 20" id="icon-discover"><g transform="translate(1 1)" fill="none" fill-rule="evenodd"><path d="M0 0h18v18H0z"/><circle stroke="currentColor" stroke-width="1.5" cx="9" cy="9" r="6.75"/><path d="M9 15.75c1.5 0 3-3.022 3-6.75s-1.5-6.75-3-6.75S6 5.272 6 9s1.5 6.75 3 6.75z" stroke="currentColor" stroke-width="1.5"/><path d="M2.25 9c0 1.5 3.022 3 6.75 3s6.75-1.5 6.75-3S12.728 6 9 6 2.25 7.5 2.25 9z" stroke="currentColor" stroke-width="1.5"/></g></symbol>
+    <symbol viewBox="0 0 20 20" id="icon-import"><g stroke="currentColor" stroke-width="1.5" fill="none" fill-rule="evenodd"><path d="M10 7.5v9.583" stroke-linecap="square"/><path d="M13.333 14.581l-3.291 3.292L6.75 14.58m.75-2.913H5V2.5h10v9.167h-2.5"/></g></symbol>
+</svg>
\ No newline at end of file
diff --git a/packages/rocketchat-ui-sidenav/client/sidebarItem.html b/packages/rocketchat-ui-sidenav/client/sidebarItem.html
index 3ac3cd8ede1a..cd24e8318f42 100644
--- a/packages/rocketchat-ui-sidenav/client/sidebarItem.html
+++ b/packages/rocketchat-ui-sidenav/client/sidebarItem.html
@@ -4,17 +4,19 @@
 			<div class="sidebar-item__user-status sidebar-item__user-status--{{statusClass}}"></div>
 		{{/if}}
 		<a class="sidebar-item__link" href="{{#if route}}{{route}}{{else}}{{pathFor pathSection group=pathGroup}}{{/if}}" title="{{name}}">
-			<div class="sidebar-item__picture">
-				{{#if icon}}
+			{{#if icon}}
+				<div class="sidebar-item__picture">
 					{{> icon block="sidebar-item__icon" icon=icon}}
-				{{else}}
-					{{#if avatar}}
+				</div>
+			{{else}}
+				{{#if avatar}}
+					<div class="sidebar-item__picture">
 						<div class="sidebar-item__user-thumb">
 							{{> avatar username=username}}
 						</div>
-					{{/if}}
+					</div>
 				{{/if}}
-			</div>
+			{{/if}}
 			<div class='sidebar-item__name {{archivedClass}}'>{{name}}</div>
 			{{#if unread}}
 				<span class="badge badge--unread">{{#if userMentions}}@ {{/if}}{{unread}}</span>
diff --git a/tests/pageobjects/side-nav.page.js b/tests/pageobjects/side-nav.page.js
index 6a7ca954b124..fcd8e0b89a0d 100644
--- a/tests/pageobjects/side-nav.page.js
+++ b/tests/pageobjects/side-nav.page.js
@@ -37,7 +37,7 @@ class SideNav extends Page {
 	get preferences() { return browser.element('[href="/account/preferences"]'); }
 	get profile() { return browser.element('[href="/account/profile"]'); }
 	get avatar() { return browser.element('[href="/changeavatar"]'); }
-	get preferencesClose() { return browser.element('.sidebar-flex__back-button[data-action="back"]'); }
+	get preferencesClose() { return browser.element('.sidebar-flex__close-button[data-action="close"]'); }
 
 	get burgerBtn() { return browser.element('.burger'); }