[IMPROVEMENT] Livechat Status Toggle

app/lib/methods/subscriptions/rooms.js

@@ -14,6 +14,7 @@ import buildMessage from '../helpers/buildMessage';
 import RocketChat from '../../rocketchat';
 import EventEmitter from '../../../utils/events';
 import { removedRoom } from '../../../actions/room';
+import { setUser } from '../../../actions/login';
 import { INAPP_NOTIFICATION_EMITTER } from '../../../containers/InAppNotification';
 
 const removeListener = listener => listener.stop();
@@ -241,6 +242,10 @@ export default function subscribeRooms() {
 		}
 		const [type, data] = ddpMessage.fields.args;
 		const [, ev] = ddpMessage.fields.eventName.split('/');
+		if (/userData/.test(ev)) {
+			const [{ diff }] = ddpMessage.fields.args;
+			store.dispatch(setUser({ statusLivechat: diff?.statusLivechat }));
+		}
 		if (/subscriptions/.test(ev)) {
 			if (type === 'removed') {
 				try {

app/lib/rocketchat.js

@@ -401,6 +401,7 @@ const RocketChat = {
 			status: result.me.status,
 			statusText: result.me.statusText,
 			customFields: result.me.customFields,
+			statusLivechat: result.me.statusLivechat,
 			emails: result.me.emails,
 			roles: result.me.roles
 		};
@@ -809,6 +810,10 @@ const RocketChat = {
 		// RC 2.2.0
 		return this.sdk.get('livechat/custom-fields');
 	},
+	changeLivechatStatus() {
+		// RC 0.26.0
+		return this.methodCall('livechat:changeLivechatStatus');
+	},
 
 	getUidDirectMessage(room) {
 		const { id: userId } = reduxStore.getState().login.user;

app/sagas/room.js

@@ -74,12 +74,12 @@ const handleDeleteRoom = function* handleDeleteRoom({ rid, t }) {
 };
 
 const handleCloseRoom = function* handleCloseRoom({ rid }) {
+	const isMasterDetail = yield select(state => state.app.isMasterDetail);
 	const requestComment = yield select(state => state.settings.Livechat_request_comment_when_closing_conversation);
 
 	const closeRoom = async(comment = '') => {
 		try {
 			await RocketChat.closeLivechat(rid, comment);
-			const isMasterDetail = await select(state => state.app.isMasterDetail);
 			if (isMasterDetail) {
 				Navigation.navigate('DrawerNavigator');
 			} else {

app/views/RoomView/Header/Icon.js

@@ -43,7 +43,7 @@ const Icon = React.memo(({
 	} else if (type === 'c') {
 		icon = 'hash';
 	} else if (type === 'l') {
-		icon = 'omnichannel';
+		icon = 'livechat';
 	} else if (type === 'd') {
 		icon = 'team';
 	} else {

app/views/SettingsView/index.js

@@ -70,10 +70,20 @@ class SettingsView extends React.Component {
 		isMasterDetail: PropTypes.bool,
 		logout: PropTypes.func.isRequired,
 		selectServerRequest: PropTypes.func,
-		token: PropTypes.string,
+		user: PropTypes.shape({
+			roles: PropTypes.array,
+			statusLivechat: PropTypes.string
+		}),
 		appStart: PropTypes.func
 	}
 
+	get showLivechat() {
+		const { user } = this.props;
+		const { roles } = user;
+
+		return roles.includes('livechat-agent');
+	}
+
 	handleLogout = () => {
 		showConfirmationAlert({
 			message: I18n.t('You_will_be_logged_out_of_this_application'),
@@ -114,6 +124,14 @@ class SettingsView extends React.Component {
 		}
 	}
 
+	toggleLivechat = async() => {
+		try {
+			await RocketChat.changeLivechatStatus();
+		} catch {
+			// Do nothing
+		}
+	}
+
 	navigateToScreen = (screen) => {
 		const { navigation } = this.props;
 		navigation.navigate(screen);
@@ -172,6 +190,18 @@ class SettingsView extends React.Component {
 		);
 	}
 
+	renderLivechatSwitch = () => {
+		const { user } = this.props;
+		const { statusLivechat } = user;
+		return (
+			<Switch
+				value={statusLivechat === 'available'}
+				trackColor={SWITCH_TRACK_COLOR}
+				onValueChange={this.toggleLivechat}
+			/>
+		);
+	}
+
 	render() {
 		const { server, isMasterDetail, theme } = this.props;
 		return (
@@ -292,6 +322,18 @@ class SettingsView extends React.Component {
 
 					<SectionSeparator theme={theme} />
 
+					{this.showLivechat ? (
+						<>
+							<ListItem
+								title={I18n.t('Livechat')}
+								testID='settings-view-livechat'
+								right={() => this.renderLivechatSwitch()}
+								theme={theme}
+							/>
+							<SectionSeparator theme={theme} />
+						</>
+					) : null}
+
 					<ListItem
 						title={I18n.t('Send_crash_report')}
 						testID='settings-view-crash-report'
@@ -331,7 +373,7 @@ class SettingsView extends React.Component {
 
 const mapStateToProps = state => ({
 	server: state.server,
-	token: getUserSelector(state).token,
+	user: getUserSelector(state),
 	allowCrashReport: state.crashReport.allowCrashReport,
 	isMasterDetail: state.app.isMasterDetail
 });