From 623f166cddbd5a4d5090eb097b4f3ba30069696e Mon Sep 17 00:00:00 2001
From: Martin Schoeler <martin.schoeler@rocket.chat>
Date: Mon, 19 Jun 2017 16:17:52 -0300
Subject: [PATCH 1/9] Edit roles work in progress.

---
 .../client/tabs/userEdit.html                 | 10 ++++--
 .../client/tabs/userEdit.js                   | 35 +++++++++++++++++--
 2 files changed, 39 insertions(+), 6 deletions(-)

diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
index f05851461c57..7979d7633928 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
@@ -40,15 +40,19 @@ <h3>{{_ "Add_User"}}</h3>
 						</label>
 					</div>
 				{{/if}}
-				{{#unless user}}
-					<div class="input-line">
+				{{#each userRoles}}
+					<div class="input-line" data="{{this}}">
 						<label for="role">{{_ "Role"}}</label>
-						<select id="role">
+
+						<select class="role-select">
 							{{#each role}}
 								<option value="{{_id}}" selected="{{selectUserRole}}">{{name}}</option>
 							{{/each}}
 						</select>
+						<i class="icon-cancel remove-role"></i>
 					</div>
+				{{/each}}
+				{{#unless user}}
 					<div class="input-line">
 						<label for="joinDefaultChannels">
 							<input type="checkbox" id="joinDefaultChannels" value="1" checked="true">
diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
index 32b4ee1ec3d7..ca4ea849a225 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
@@ -17,8 +17,13 @@ Template.userEdit.helpers({
 		return RocketChat.models.Roles.find({}, { sort: { description: 1, _id: 1 } });
 	},
 
+	userRoles() {
+		return Template.instance().user.roles;
+	},
+
 	selectUserRole() {
-		if (this._id === 'user') {
+		console.log(Template.parentData(1));
+		if (this._id === Template.parentData(1)) {
 			return 'selected';
 		}
 	},
@@ -35,6 +40,13 @@ Template.userEdit.events({
 		return t.cancel(t.find('form'));
 	},
 
+	'click .remove-role'(e) {
+		console.log(this);
+		e.stopPropagation();
+		e.preventDefault();
+		$(`[data=${ this }]`).remove();
+	},
+
 	'click #randomPassword'(e) {
 		e.stopPropagation();
 		e.preventDefault();
@@ -44,7 +56,6 @@ Template.userEdit.events({
 	'submit form'(e, t) {
 		e.stopPropagation();
 		e.preventDefault();
-
 		return t.save(e.currentTarget);
 	}
 });
@@ -75,7 +86,21 @@ Template.userEdit.onCreated(function() {
 		userData.requirePasswordChange = this.$('#changePassword:checked').length > 0;
 		userData.joinDefaultChannels = this.$('#joinDefaultChannels:checked').length > 0;
 		userData.sendWelcomeEmail = this.$('#sendWelcomeEmail:checked').length > 0;
-		if (this.$('#role').val()) { userData.roles = [this.$('#role').val()]; }
+		// userData.roles = this.$('.role-select');
+		const roleSelect = this.$('.role-select');
+		if (roleSelect.length > 0) {
+			const roles = roleSelect.map(role => {
+				return role.value;
+			});
+
+			console.log(roles);
+		}
+
+
+
+		// if (this.$('#role').val()) {
+		// 	userData.roles = [this.$('#role').val()];
+		// }
 		return userData;
 	};
 
@@ -93,6 +118,10 @@ Template.userEdit.onCreated(function() {
 			errors.push('Email');
 		}
 
+		if (!userData.roles) {
+			errors.push('Roles');
+		}
+
 		for (const error of Array.from(errors)) {
 			toastr.error(TAPi18n.__('error-the-field-is-required', { field: TAPi18n.__(error) }));
 		}

From 0c4d4f40a9ee71c3965f1cc4f94967219f3b1cbb Mon Sep 17 00:00:00 2001
From: Martin Schoeler <martin.schoeler@rocket.chat>
Date: Mon, 19 Jun 2017 16:41:25 -0300
Subject: [PATCH 2/9] support for multiple roles

---
 packages/rocketchat-ui-flextab/client/tabs/userEdit.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
index ca4ea849a225..704a52943c88 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
@@ -86,14 +86,14 @@ Template.userEdit.onCreated(function() {
 		userData.requirePasswordChange = this.$('#changePassword:checked').length > 0;
 		userData.joinDefaultChannels = this.$('#joinDefaultChannels:checked').length > 0;
 		userData.sendWelcomeEmail = this.$('#sendWelcomeEmail:checked').length > 0;
-		// userData.roles = this.$('.role-select');
-		const roleSelect = this.$('.role-select');
+		// userData.roles = this.$('.role-select').toArray();
+		const roleSelect = this.$('.role-select').toArray();
 		if (roleSelect.length > 0) {
-			const roles = roleSelect.map(role => {
+			userData.roles = roleSelect.map(role => {
 				return role.value;
 			});
 
-			console.log(roles);
+			// console.log(roles);
 		}
 
 

From bc4fdc9e1241cd731139cf9630600e05343d04ba Mon Sep 17 00:00:00 2001
From: Martin Schoeler <martin.schoeler@rocket.chat>
Date: Tue, 20 Jun 2017 16:32:25 -0300
Subject: [PATCH 3/9] use chips instead of selects

Work in Progress
---
 .../rocketchat-theme/client/imports/base.css  |  4 ++
 .../rocketchat-theme/client/imports/chip.css  | 18 ++++++
 packages/rocketchat-theme/client/main.css     |  1 +
 .../client/tabs/userEdit.html                 | 19 ++++--
 .../client/tabs/userEdit.js                   | 59 +++++++++++--------
 5 files changed, 70 insertions(+), 31 deletions(-)
 create mode 100644 packages/rocketchat-theme/client/imports/chip.css

diff --git a/packages/rocketchat-theme/client/imports/base.css b/packages/rocketchat-theme/client/imports/base.css
index 139776250008..c8c73cec4870 100644
--- a/packages/rocketchat-theme/client/imports/base.css
+++ b/packages/rocketchat-theme/client/imports/base.css
@@ -3524,6 +3524,10 @@ body:not(.is-cordova) {
 			& #password {
 				width: 70%;
 			}
+
+			& .role-select {
+				width: 70%;
+			}
 		}
 
 		& nav {
diff --git a/packages/rocketchat-theme/client/imports/chip.css b/packages/rocketchat-theme/client/imports/chip.css
new file mode 100644
index 000000000000..12cc1178634b
--- /dev/null
+++ b/packages/rocketchat-theme/client/imports/chip.css
@@ -0,0 +1,18 @@
+.chip-container {
+	list-style-type: none;
+	margin: 15px;
+}
+
+.chip-container li {
+	display: inline-block;
+	background-color: #dddddd;
+	border-radius: 10px;
+	padding: 2px 8px 2px 2px;
+	margin: 1px 0;
+	cursor: pointer;
+}
+
+.chip-container li .icon-plus-circled {
+	opacity: 0.5;
+	font-size: 0.8rem;
+}
diff --git a/packages/rocketchat-theme/client/main.css b/packages/rocketchat-theme/client/main.css
index f7b298262b52..2dd47b9037c7 100644
--- a/packages/rocketchat-theme/client/main.css
+++ b/packages/rocketchat-theme/client/main.css
@@ -4,5 +4,6 @@
 @import 'imports/keyframes.css';
 @import 'imports/forms.css';
 @import 'imports/base.css';
+@import 'imports/chip.css';
 @import 'imports/rtl.css';
 
diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
index 7979d7633928..89196ecffa7a 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
@@ -40,18 +40,25 @@ <h3>{{_ "Add_User"}}</h3>
 						</label>
 					</div>
 				{{/if}}
-				{{#each userRoles}}
 					<div class="input-line" data="{{this}}">
-						<label for="role">{{_ "Role"}}</label>
-
+						<label for="role">{{_ "Add_Role"}}</label>
 						<select class="role-select">
+							<option value="placeholder" disabled selected>{{_ "Select_role"}}</option>
 							{{#each role}}
-								<option value="{{_id}}" selected="{{selectUserRole}}">{{name}}</option>
+								<option value="{{_id}}">{{name}}</option>
 							{{/each}}
 						</select>
-						<i class="icon-cancel remove-role"></i>
+						<button id="addRole" class="button">{{_ 'Add_role'}}</button>
+
+						<fieldset>
+							<ul class="chip-container current-user-roles">
+								{{#each userRoles}}
+									<li class="remove-role" title="{{this}}"><i class="icon-cancel-circled"></i>{{this}}</li>
+								{{/each}}
+							</ul>
+						</fieldset>
 					</div>
-				{{/each}}
+
 				{{#unless user}}
 					<div class="input-line">
 						<label for="joinDefaultChannels">
diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
index 704a52943c88..01ea9397d0af 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
@@ -1,6 +1,8 @@
 import toastr from 'toastr';
 
 Template.userEdit.helpers({
+
+
 	canEditOrAdd() {
 		return (Template.instance().user && RocketChat.authz.hasAtLeastOnePermission('edit-other-user-info')) || (!Template.instance().user && RocketChat.authz.hasAtLeastOnePermission('create-user'));
 	},
@@ -18,14 +20,7 @@ Template.userEdit.helpers({
 	},
 
 	userRoles() {
-		return Template.instance().user.roles;
-	},
-
-	selectUserRole() {
-		console.log(Template.parentData(1));
-		if (this._id === Template.parentData(1)) {
-			return 'selected';
-		}
+		return Template.instance().roles.get();
 	},
 
 	name() {
@@ -37,32 +32,51 @@ Template.userEdit.events({
 	'click .cancel'(e, t) {
 		e.stopPropagation();
 		e.preventDefault();
-		return t.cancel(t.find('form'));
+		Template.instance().roles.set('');
+		t.cancel(t.find('form'));
 	},
 
 	'click .remove-role'(e) {
-		console.log(this);
 		e.stopPropagation();
 		e.preventDefault();
-		$(`[data=${ this }]`).remove();
+		$(`[title=${ this }]`).remove();
 	},
 
 	'click #randomPassword'(e) {
 		e.stopPropagation();
 		e.preventDefault();
-		return $('#password').val(Random.id());
+		$('#password').val(Random.id());
+	},
+
+	'click #addRole'(e) {
+		e.stopPropagation();
+		e.preventDefault();
+		if ($('.role-select').find(':selected').is(':disabled')) {
+			return;
+		}
+		const user = Template.instance().user;
+		const instanceRoles = Template.instance().roles.get();
+		let userRoles = [];
+		if (user || instanceRoles) {
+			userRoles = user ? user.roles : instanceRoles;
+		}
+		userRoles.push($('.role-select').val());
+		Template.instance().roles.set(userRoles);
+		Template.instance().user.roles;
 	},
 
 	'submit form'(e, t) {
 		e.stopPropagation();
 		e.preventDefault();
-		return t.save(e.currentTarget);
+		t.save(e.currentTarget);
 	}
 });
 
 Template.userEdit.onCreated(function() {
 	let userData;
 	this.user = this.data != null ? this.data.user : undefined;
+	this.roles = this.user ? new ReactiveVar(this.user.roles) : new ReactiveVar;
+
 
 	const { tabBar } = Template.currentData();
 
@@ -86,21 +100,16 @@ Template.userEdit.onCreated(function() {
 		userData.requirePasswordChange = this.$('#changePassword:checked').length > 0;
 		userData.joinDefaultChannels = this.$('#joinDefaultChannels:checked').length > 0;
 		userData.sendWelcomeEmail = this.$('#sendWelcomeEmail:checked').length > 0;
-		// userData.roles = this.$('.role-select').toArray();
-		const roleSelect = this.$('.role-select').toArray();
+		const roleSelect = this.$('.remove-role').toArray();
+
 		if (roleSelect.length > 0) {
-			userData.roles = roleSelect.map(role => {
-				return role.value;
+			const notSorted = roleSelect.map(role => {
+				return role.title;
 			});
-
-			// console.log(roles);
+			//Remove duplicate strings from the array
+			console.log(notSorted);
+			userData.roles = notSorted.filter((el, index) => notSorted.indexOf(el) === index);
 		}
-
-
-
-		// if (this.$('#role').val()) {
-		// 	userData.roles = [this.$('#role').val()];
-		// }
 		return userData;
 	};
 

From 509642e6e12f6c79799bec3be12237e37df82d30 Mon Sep 17 00:00:00 2001
From: Martin Schoeler <martin.schoeler@rocket.chat>
Date: Wed, 21 Jun 2017 16:04:34 -0300
Subject: [PATCH 4/9] Add Translations

and fix some bugs
---
 packages/rocketchat-i18n/i18n/en.i18n.json    |  2 ++
 .../client/tabs/userEdit.html                 |  8 +++--
 .../client/tabs/userEdit.js                   | 29 ++++++++++---------
 3 files changed, 22 insertions(+), 17 deletions(-)

diff --git a/packages/rocketchat-i18n/i18n/en.i18n.json b/packages/rocketchat-i18n/i18n/en.i18n.json
index 1b2888536b9a..289c3921ad8a 100644
--- a/packages/rocketchat-i18n/i18n/en.i18n.json
+++ b/packages/rocketchat-i18n/i18n/en.i18n.json
@@ -133,6 +133,7 @@
   "Add_custom_oauth": "Add custom oauth",
   "Add_Domain": "Add Domain",
   "Add_manager": "Add manager",
+  "Add_role": "Add Role",
   "Add_user": "Add user",
   "Add_User": "Add User",
   "Add_users": "Add users",
@@ -1329,6 +1330,7 @@
   "Select_an_avatar": "Select an avatar",
   "Select_file": "Select file",
   "Select_service_to_login": "Select a service to login to load your picture or upload one directly from your computer",
+  "Select_role": "Select a Role",
   "Select_user": "Select user",
   "Select_users": "Select users",
   "Selected_agents": "Selected agents",
diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
index 89196ecffa7a..64cf7a382e49 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
@@ -42,13 +42,15 @@ <h3>{{_ "Add_User"}}</h3>
 				{{/if}}
 					<div class="input-line" data="{{this}}">
 						<label for="role">{{_ "Add_Role"}}</label>
-						<select class="role-select">
+						{{#let roles=role}}
+						<select class="role-select" {{disabled role}}>
 							<option value="placeholder" disabled selected>{{_ "Select_role"}}</option>
-							{{#each role}}
+							{{#each roles}}
 								<option value="{{_id}}">{{name}}</option>
 							{{/each}}
 						</select>
-						<button id="addRole" class="button">{{_ 'Add_role'}}</button>
+						{{/let}}
+						<button id="addRole" class="button" {{disabled role}}>{{_ 'Add_role'}}</button>
 
 						<fieldset>
 							<ul class="chip-container current-user-roles">
diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
index 01ea9397d0af..f06373c84ee3 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
@@ -2,7 +2,9 @@ import toastr from 'toastr';
 
 Template.userEdit.helpers({
 
-
+	disabled(cursor) {
+		return cursor.count() === 0 ? 'disabled' : '';
+	},
 	canEditOrAdd() {
 		return (Template.instance().user && RocketChat.authz.hasAtLeastOnePermission('edit-other-user-info')) || (!Template.instance().user && RocketChat.authz.hasAtLeastOnePermission('create-user'));
 	},
@@ -16,7 +18,8 @@ Template.userEdit.helpers({
 	},
 
 	role() {
-		return RocketChat.models.Roles.find({}, { sort: { description: 1, _id: 1 } });
+		const roles = Template.instance().roles.get();
+		return RocketChat.models.Roles.find({_id: {$nin:roles}}, { sort: { description: 1, _id: 1 } });
 	},
 
 	userRoles() {
@@ -32,13 +35,16 @@ Template.userEdit.events({
 	'click .cancel'(e, t) {
 		e.stopPropagation();
 		e.preventDefault();
-		Template.instance().roles.set('');
+		Template.instance().roles.set([]);
 		t.cancel(t.find('form'));
 	},
 
 	'click .remove-role'(e) {
 		e.stopPropagation();
 		e.preventDefault();
+		let roles = Template.instance().roles.get();
+		roles = roles.filter(el => el !== this.valueOf());
+		Template.instance().roles.set(roles);
 		$(`[title=${ this }]`).remove();
 	},
 
@@ -48,21 +54,16 @@ Template.userEdit.events({
 		$('#password').val(Random.id());
 	},
 
-	'click #addRole'(e) {
+	'click #addRole'(e, instance) {
 		e.stopPropagation();
 		e.preventDefault();
 		if ($('.role-select').find(':selected').is(':disabled')) {
 			return;
 		}
-		const user = Template.instance().user;
-		const instanceRoles = Template.instance().roles.get();
-		let userRoles = [];
-		if (user || instanceRoles) {
-			userRoles = user ? user.roles : instanceRoles;
-		}
+		const userRoles = [...instance.roles.get()];
 		userRoles.push($('.role-select').val());
-		Template.instance().roles.set(userRoles);
-		Template.instance().user.roles;
+		instance.roles.set(userRoles);
+		$('.role-select').val('placeholder');
 	},
 
 	'submit form'(e, t) {
@@ -72,10 +73,11 @@ Template.userEdit.events({
 	}
 });
 
+
 Template.userEdit.onCreated(function() {
 	let userData;
 	this.user = this.data != null ? this.data.user : undefined;
-	this.roles = this.user ? new ReactiveVar(this.user.roles) : new ReactiveVar;
+	this.roles = this.user ? new ReactiveVar(this.user.roles) : new ReactiveVar([]);
 
 
 	const { tabBar } = Template.currentData();
@@ -107,7 +109,6 @@ Template.userEdit.onCreated(function() {
 				return role.title;
 			});
 			//Remove duplicate strings from the array
-			console.log(notSorted);
 			userData.roles = notSorted.filter((el, index) => notSorted.indexOf(el) === index);
 		}
 		return userData;

From 8a123c6864db7a338e444dba32c09f33ff6204b4 Mon Sep 17 00:00:00 2001
From: Martin Schoeler <martin.schoeler@rocket.chat>
Date: Thu, 22 Jun 2017 15:26:51 -0300
Subject: [PATCH 5/9] Fix tests

and use id instead of class
---
 packages/rocketchat-theme/client/imports/base.css        | 2 +-
 packages/rocketchat-ui-flextab/client/tabs/userEdit.html | 2 +-
 packages/rocketchat-ui-flextab/client/tabs/userEdit.js   | 6 +++---
 tests/end-to-end/ui/11-admin.js                          | 8 +++++++-
 tests/pageobjects/flex-tab.page.js                       | 3 ++-
 5 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/packages/rocketchat-theme/client/imports/base.css b/packages/rocketchat-theme/client/imports/base.css
index c8c73cec4870..ac6ab2b37602 100644
--- a/packages/rocketchat-theme/client/imports/base.css
+++ b/packages/rocketchat-theme/client/imports/base.css
@@ -3525,7 +3525,7 @@ body:not(.is-cordova) {
 				width: 70%;
 			}
 
-			& .role-select {
+			& #roleSelect {
 				width: 70%;
 			}
 		}
diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
index 64cf7a382e49..5fd369e265d8 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
@@ -43,7 +43,7 @@ <h3>{{_ "Add_User"}}</h3>
 					<div class="input-line" data="{{this}}">
 						<label for="role">{{_ "Add_Role"}}</label>
 						{{#let roles=role}}
-						<select class="role-select" {{disabled role}}>
+						<select id="roleSelect" {{disabled role}}>
 							<option value="placeholder" disabled selected>{{_ "Select_role"}}</option>
 							{{#each roles}}
 								<option value="{{_id}}">{{name}}</option>
diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
index f06373c84ee3..b4082f4be8d9 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
@@ -57,13 +57,13 @@ Template.userEdit.events({
 	'click #addRole'(e, instance) {
 		e.stopPropagation();
 		e.preventDefault();
-		if ($('.role-select').find(':selected').is(':disabled')) {
+		if ($('#roleSelect').find(':selected').is(':disabled')) {
 			return;
 		}
 		const userRoles = [...instance.roles.get()];
-		userRoles.push($('.role-select').val());
+		userRoles.push($('#roleSelect').val());
 		instance.roles.set(userRoles);
-		$('.role-select').val('placeholder');
+		$('#roleSelect').val('placeholder');
 	},
 
 	'submit form'(e, t) {
diff --git a/tests/end-to-end/ui/11-admin.js b/tests/end-to-end/ui/11-admin.js
index b86c9944d106..6ba202868003 100644
--- a/tests/end-to-end/ui/11-admin.js
+++ b/tests/end-to-end/ui/11-admin.js
@@ -316,7 +316,13 @@ describe('[Administration]', () => {
 					});
 
 					it('it should show the role dropdown', () => {
-						flexTab.usersAddUserRole.isVisible().should.be.true;
+						flexTab.usersAddUserRoleList.waitForVisible(5000);
+						flexTab.usersAddUserRoleList.isVisible().should.be.true;
+					});
+
+					it('ít should show the add role button', () => {
+						flexTab.usersAddUserRoleButton.waitForVisible(5000);
+						flexTab.usersAddUserRoleButton.isVisible().should.be.true;
 					});
 
 					it('it should show the join default channel checkbox', () => {
diff --git a/tests/pageobjects/flex-tab.page.js b/tests/pageobjects/flex-tab.page.js
index 95f4e8fb85a7..0387b0d416f4 100644
--- a/tests/pageobjects/flex-tab.page.js
+++ b/tests/pageobjects/flex-tab.page.js
@@ -85,8 +85,9 @@ class FlexTab extends Page {
 	get usersAddUserName() { return browser.element('#name'); }
 	get usersAddUserUsername() { return browser.element('#username'); }
 	get usersAddUserEmail() { return browser.element('#email'); }
+	get usersAddUserRoleList() { return browser.element('#roleSelect'); }
 	get usersAddUserPassword() { return browser.element('#password'); }
-	get usersAddUserRole() { return browser.element('#role'); }
+	get usersAddUserRoleButton() { return browser.element('#addRole'); }
 	get usersAddUserVerifiedCheckbox() { return browser.element('#verified'); }
 	get usersAddUserChangePasswordCheckbox() { return browser.element('#changePassword'); }
 	get usersAddUserDefaultChannelCheckbox() { return browser.element('#joinDefaultChannels'); }

From 4bf0aa194b51c849f0c3a1d8a109486b2c48a23f Mon Sep 17 00:00:00 2001
From: Martin Schoeler <martin.schoeler@rocket.chat>
Date: Thu, 22 Jun 2017 16:30:25 -0300
Subject: [PATCH 6/9] Show only user scoped roles

---
 packages/rocketchat-ui-flextab/client/tabs/userEdit.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
index b4082f4be8d9..377646d9e01d 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
@@ -19,7 +19,7 @@ Template.userEdit.helpers({
 
 	role() {
 		const roles = Template.instance().roles.get();
-		return RocketChat.models.Roles.find({_id: {$nin:roles}}, { sort: { description: 1, _id: 1 } });
+		return RocketChat.models.Roles.find({_id: {$nin:roles}, scope: 'Users'}, { sort: { description: 1, _id: 1 } });
 	},
 
 	userRoles() {

From 87ea965b28e0bd84612ec22dd2e0970db675b713 Mon Sep 17 00:00:00 2001
From: Martin Schoeler <martin.schoeler@rocket.chat>
Date: Fri, 23 Jun 2017 10:54:10 -0300
Subject: [PATCH 7/9] fix tests

---
 tests/end-to-end/ui/13-permissions.js |  1 +
 tests/pageobjects/flex-tab.page.js    | 10 ++++++++++
 2 files changed, 11 insertions(+)

diff --git a/tests/end-to-end/ui/13-permissions.js b/tests/end-to-end/ui/13-permissions.js
index f1f4bac4ae63..4c16d5a3d94b 100644
--- a/tests/end-to-end/ui/13-permissions.js
+++ b/tests/end-to-end/ui/13-permissions.js
@@ -97,6 +97,7 @@ describe('[Permissions]', () => {
 			flexTab.usersAddUserVerifiedCheckbox.click();
 			flexTab.usersAddUserPassword.setValue(password);
 			flexTab.usersAddUserChangePasswordCheckbox.click();
+			flexTab.addRole('user');
 			flexTab.usersButtonSave.click();
 		});
 
diff --git a/tests/pageobjects/flex-tab.page.js b/tests/pageobjects/flex-tab.page.js
index 0387b0d416f4..cf6bc44a3e61 100644
--- a/tests/pageobjects/flex-tab.page.js
+++ b/tests/pageobjects/flex-tab.page.js
@@ -123,6 +123,16 @@ class FlexTab extends Page {
 		this.removeUserBtn.click();
 	}
 
+	addRole(role) {
+		this.usersAddUserRoleList.waitForVisible(5000);
+		this.usersAddUserRoleList.click();
+		browser.waitForVisible(`option[value=${ role }]`, 5000);
+		browser.click(`option[value=${ role }]`);
+		this.usersAddUserRoleButton.waitForVisible(5000);
+		this.usersAddUserRoleButton.click();
+		browser.waitForVisible(`.remove-role=${ role }`);
+	}
+
 	operateFlexTab(desiredTab, desiredState) {
 		//desiredState true=open false=closed
 		switch (desiredTab) {

From a8ff1b23eb7bfd8fc3faf23a65a44c9150e9554c Mon Sep 17 00:00:00 2001
From: Martin Schoeler <martin.schoeler@rocket.chat>
Date: Mon, 26 Jun 2017 09:31:09 -0300
Subject: [PATCH 8/9] use argument

instead of template.instance()
---
 packages/rocketchat-ui-flextab/client/tabs/userEdit.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
index 377646d9e01d..52c46830284c 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.js
@@ -35,16 +35,16 @@ Template.userEdit.events({
 	'click .cancel'(e, t) {
 		e.stopPropagation();
 		e.preventDefault();
-		Template.instance().roles.set([]);
+		t.roles.set([]);
 		t.cancel(t.find('form'));
 	},
 
-	'click .remove-role'(e) {
+	'click .remove-role'(e, t) {
 		e.stopPropagation();
 		e.preventDefault();
-		let roles = Template.instance().roles.get();
+		let roles = t.roles.get();
 		roles = roles.filter(el => el !== this.valueOf());
-		Template.instance().roles.set(roles);
+		t.roles.set(roles);
 		$(`[title=${ this }]`).remove();
 	},
 

From e53904d1f2551f4bab1878f31bc1ac7fdf85629f Mon Sep 17 00:00:00 2001
From: Rodrigo Nascimento <rodrigoknascimento@gmail.com>
Date: Thu, 27 Jul 2017 16:57:29 -0300
Subject: [PATCH 9/9] Fix i18n

---
 packages/rocketchat-i18n/i18n/en.i18n.json               | 2 +-
 packages/rocketchat-ui-flextab/client/tabs/userEdit.html | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/rocketchat-i18n/i18n/en.i18n.json b/packages/rocketchat-i18n/i18n/en.i18n.json
index a471f166560c..ad7ab1152fa8 100644
--- a/packages/rocketchat-i18n/i18n/en.i18n.json
+++ b/packages/rocketchat-i18n/i18n/en.i18n.json
@@ -133,7 +133,7 @@
   "Add_custom_oauth": "Add custom oauth",
   "Add_Domain": "Add Domain",
   "Add_manager": "Add manager",
-  "Add_role": "Add Role",
+  "Add_Role": "Add Role",
   "Add_user": "Add user",
   "Add_User": "Add User",
   "Add_users": "Add users",
diff --git a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
index 5fd369e265d8..d1578747649e 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
+++ b/packages/rocketchat-ui-flextab/client/tabs/userEdit.html
@@ -50,7 +50,7 @@ <h3>{{_ "Add_User"}}</h3>
 							{{/each}}
 						</select>
 						{{/let}}
-						<button id="addRole" class="button" {{disabled role}}>{{_ 'Add_role'}}</button>
+						<button id="addRole" class="button" {{disabled role}}>{{_ 'Add_Role'}}</button>
 
 						<fieldset>
 							<ul class="chip-container current-user-roles">