[NEW] Custom Status

app/containers/MessageBox/UploadModal.js

@@ -225,7 +225,7 @@ class UploadModal extends Component {
 				hideModalContentWhileAnimating
 				avoidKeyboard
 			>
-				<View style={[styles.container, { width: width - 32, backgroundColor: themes[theme].chatComponentBackground }, split && sharedStyles.modal]}>
+				<View style={[styles.container, { width: width - 32, backgroundColor: themes[theme].chatComponentBackground }, split && [sharedStyles.modal, sharedStyles.modalFormSheet]]}>
 					<View style={styles.titleContainer}>
 						<Text style={[styles.title, { color: themes[theme].titleText }]}>{I18n.t('Upload_file_question_mark')}</Text>
 					</View>

app/containers/Status/index.js

@@ -26,7 +26,7 @@ class StatusContainer extends React.PureComponent {
 }
 
 const mapStateToProps = (state, ownProps) => ({
-	status: state.meteor.connected ? state.activeUsers[ownProps.id] : 'offline'
+	status: state.meteor.connected ? (state.activeUsers[ownProps.id] && state.activeUsers[ownProps.id].status) : 'offline'
 });
 
 export default connect(mapStateToProps)(withTheme(StatusContainer));

app/i18n/locales/en.js

@@ -10,6 +10,7 @@ export default {
 	'error-could-not-change-email': 'Could not change email',
 	'error-could-not-change-name': 'Could not change name',
 	'error-could-not-change-username': 'Could not change username',
+	'error-could-not-change-status': 'Could not change status',
 	'error-delete-protected-role': 'Cannot delete a protected role',
 	'error-department-not-found': 'Department not found',
 	'error-direct-message-file-upload-not-allowed': 'File sharing not allowed in direct messages',
@@ -158,6 +159,7 @@ export default {
 	Created_snippet: 'Created a snippet',
 	Create_a_new_workspace: 'Create a new workspace',
 	Create: 'Create',
+	Custom_Status: 'Custom Status',
 	Dark: 'Dark',
 	Dark_level: 'Dark Level',
 	Default: 'Default',
@@ -179,6 +181,7 @@ export default {
 	edit: 'edit',
 	edited: 'edited',
 	Edit: 'Edit',
+	Edit_Status: 'Edit Status',
 	Edit_Invite: 'Edit Invite',
 	Email_or_password_field_is_empty: 'Email or password field is empty',
 	Email: 'Email',
@@ -385,6 +388,9 @@ export default {
 	Servers: 'Servers',
 	Server_version: 'Server version: {{version}}',
 	Set_username_subtitle: 'The username is used to allow others to mention you in messages',
+	Set_custom_status: 'Set custom status',
+	Set_status: 'Set status',
+	Status_saved_successfully: 'Status saved successfully!',
 	Settings: 'Settings',
 	Settings_succesfully_changed: 'Settings succesfully changed!',
 	Share: 'Share',

app/lib/database/index.js

@@ -23,6 +23,8 @@ import appSchema from './schema/app';
 
 import migrations from './model/migrations';
 
+import serversMigrations from './model/serversMigrations';
+
 import { isIOS } from '../../utils/deviceInfo';
 
 const appGroupPath = isIOS ? `${ RNFetchBlob.fs.syncPathAppGroup('group.ios.chat.rocket') }/` : '';
@@ -36,7 +38,8 @@ class DB {
 		serversDB: new Database({
 			adapter: new SQLiteAdapter({
 				dbName: `${ appGroupPath }default.db`,
-				schema: serversSchema
+				schema: serversSchema,
+				migrations: serversMigrations
 			}),
 			modelClasses: [Server, User],
 			actionsEnabled: true

app/lib/database/model/User.js

@@ -16,5 +16,7 @@ export default class User extends Model {
 
 	@field('status') status;
 
+	@field('statusText') statusText;
+
 	@json('roles', sanitizer) roles;
 }

app/lib/database/model/serversMigrations.js

@@ -0,0 +1,17 @@
+import { schemaMigrations, addColumns } from '@nozbe/watermelondb/Schema/migrations';
+
+export default schemaMigrations({
+	migrations: [
+		{
+			toVersion: 3,
+			steps: [
+				addColumns({
+					table: 'users',
+					columns: [
+						{ name: 'statusText', type: 'string', isOptional: true }
+					]
+				})
+			]
+		}
+	]
+});

app/lib/database/schema/servers.js

@@ -1,7 +1,7 @@
 import { appSchema, tableSchema } from '@nozbe/watermelondb';
 
 export default appSchema({
-	version: 2,
+	version: 3,
 	tables: [
 		tableSchema({
 			name: 'users',
@@ -11,6 +11,7 @@ export default appSchema({
 				{ name: 'name', type: 'string', isOptional: true },
 				{ name: 'language', type: 'string', isOptional: true },
 				{ name: 'status', type: 'string', isOptional: true },
+				{ name: 'statusText', type: 'string', isOptional: true },
 				{ name: 'roles', type: 'string', isOptional: true }
 			]
 		}),

app/lib/rocketchat.js

@@ -240,12 +240,12 @@ const RocketChat = {
 						}, 10000);
 					}
 					const userStatus = ddpMessage.fields.args[0];
-					const [id,, status] = userStatus;
-					this.activeUsers[id] = STATUSES[status];
+					const [id,, status, statusText] = userStatus;
+					this.activeUsers[id] = { status: STATUSES[status], statusText };
 
 					const { user: loggedUser } = reduxStore.getState().login;
 					if (loggedUser && loggedUser.id === id) {
-						reduxStore.dispatch(setUser({ status: STATUSES[status] }));
+						reduxStore.dispatch(setUser({ status: STATUSES[status], statusText }));
 					}
 				}
 			}));
@@ -377,6 +377,7 @@ const RocketChat = {
 				name: result.me.name,
 				language: result.me.language,
 				status: result.me.status,
+				statusText: result.me.statusText,
 				customFields: result.me.customFields,
 				emails: result.me.emails,
 				roles: result.me.roles
@@ -1045,7 +1046,7 @@ const RocketChat = {
 		}
 
 		if (ddpMessage.cleared && user && user.id === ddpMessage.id) {
-			reduxStore.dispatch(setUser({ status: 'offline' }));
+			reduxStore.dispatch(setUser({ status: { status: 'offline' } }));
 		}
 
 		if (!this._setUserTimer) {
@@ -1060,9 +1061,9 @@ const RocketChat = {
 		}
 
 		if (!ddpMessage.fields) {
-			this.activeUsers[ddpMessage.id] = 'offline';
+			this.activeUsers[ddpMessage.id] = { status: 'offline' };
 		} else if (ddpMessage.fields.status) {
-			this.activeUsers[ddpMessage.id] = ddpMessage.fields.status;
+			this.activeUsers[ddpMessage.id] = { status: ddpMessage.fields.status };
 		}
 	},
 	getUserPresence() {
@@ -1089,7 +1090,10 @@ const RocketChat = {
 				const result = await this.sdk.get('users.presence', params);
 				if (result.success) {
 					const activeUsers = result.users.reduce((ret, item) => {
-						ret[item._id] = item.status;
+						ret[item._id] = {
+							status: item.status,
+							statusText: item.statusText
+						};
 						return ret;
 					}, {});
 					InteractionManager.runAfterInteractions(() => {

app/presentation/RoomItem/index.js

@@ -201,7 +201,7 @@ RoomItem.defaultProps = {
 const mapStateToProps = (state, ownProps) => ({
 	status:
 		state.meteor.connected && ownProps.type === 'd'
-			? state.activeUsers[ownProps.id]
+			? state.activeUsers[ownProps.id] && state.activeUsers[ownProps.id].status
 			: 'offline'
 });
 

app/sagas/login.js

@@ -100,6 +100,7 @@ const handleLoginSuccess = function* handleLoginSuccess({ user }) {
 			name: user.name,
 			language: user.language,
 			status: user.status,
+			statusText: user.statusText,
 			roles: user.roles
 		};
 		yield serversDB.action(async() => {

app/sagas/selectServer.js

@@ -78,6 +78,7 @@ const handleSelectServer = function* handleSelectServer({ server, version, fetch
 					name: userRecord.name,
 					language: userRecord.language,
 					status: userRecord.status,
+					statusText: userRecord.statusText,
 					roles: userRecord.roles
 				};
 			} catch (e) {

app/views/ProfileView/index.js

@@ -63,6 +63,7 @@ class ProfileView extends React.Component {
 	state = {
 		showPasswordAlert: false,
 		saving: false,
+		statusText: null,
 		name: null,
 		username: null,
 		email: null,
@@ -115,10 +116,11 @@ class ProfileView extends React.Component {
 	init = (user) => {
 		const { user: userProps } = this.props;
 		const {
-			name, username, emails, customFields
+			statusText, name, username, emails, customFields
 		} = user || userProps;
 
 		this.setState({
+			statusText,
 			name,
 			username,
 			email: emails ? emails[0].address : null,
@@ -132,7 +134,7 @@ class ProfileView extends React.Component {
 
 	formIsChanged = () => {
 		const {
-			name, username, email, newPassword, avatar, customFields
+			statusText, name, username, email, newPassword, avatar, customFields
 		} = this.state;
 		const { user } = this.props;
 		let customFieldsChanged = false;
@@ -146,7 +148,8 @@ class ProfileView extends React.Component {
 			});
 		}
 
-		return !(user.name === name
+		return !(user.statusText === statusText
+			&& user.name === name
 			&& user.username === username
 			&& !newPassword
 			&& (user.emails && user.emails[0].address === email)
@@ -180,11 +183,16 @@ class ProfileView extends React.Component {
 		this.setState({ saving: true });
 
 		const {
-			name, username, email, newPassword, currentPassword, avatar, customFields
+			statusText, name, username, email, newPassword, currentPassword, avatar, customFields
 		} = this.state;
 		const { user, setUser } = this.props;
 		const params = {};
 
+		// Status Text
+		if (user.statusText !== statusText) {
+			params.statusText = statusText;
+		}
+
 		// Name
 		if (user.name !== name) {
 			params.name = name;
@@ -409,7 +417,7 @@ class ProfileView extends React.Component {
 
 	render() {
 		const {
-			name, username, email, newPassword, avatarUrl, customFields, avatar, saving, showPasswordAlert
+			statusText, name, username, email, newPassword, avatarUrl, customFields, avatar, saving, showPasswordAlert
 		} = this.state;
 		const {
 			baseUrl,
@@ -446,6 +454,16 @@ class ProfileView extends React.Component {
 								token={user.token}
 							/>
 						</View>
+						<RCTextInput
+							inputRef={(e) => { this.statusText = e; }}
+							label={I18n.t('Custom_Status')}
+							placeholder={I18n.t('Custom_Status')}
+							value={statusText}
+							onChangeText={value => this.setState({ statusText: value })}
+							onSubmitEditing={() => { this.name.focus(); }}
+							testID='profile-view-custom-status'
+							theme={theme}
+						/>
 						<RCTextInput
 							editable={Accounts_AllowRealNameChange}
 							inputStyle={[

app/views/RoomActionsView/index.js

@@ -5,6 +5,7 @@ import {
 } from 'react-native';
 import { connect } from 'react-redux';
 import { SafeAreaView } from 'react-navigation';
+import _ from 'lodash';
 
 import Touch from '../../utils/touch';
 import { leaveRoom as leaveRoomAction } from '../../actions/room';
@@ -25,6 +26,7 @@ import { withTheme } from '../../theme';
 import { themedHeader } from '../../utils/navigation';
 import { CloseModalButton } from '../../containers/HeaderButton';
 import { getUserSelector } from '../../selectors/login';
+import Markdown from '../../containers/markdown';
 
 class RoomActionsView extends React.Component {
 	static navigationOptions = ({ navigation, screenProps }) => {
@@ -54,12 +56,13 @@ class RoomActionsView extends React.Component {
 		super(props);
 		this.mounted = false;
 		const room = props.navigation.getParam('room');
+		const member = props.navigation.getParam('member');
 		this.rid = props.navigation.getParam('rid');
 		this.t = props.navigation.getParam('t');
 		this.state = {
 			room: room || { rid: this.rid, t: this.t },
 			membersCount: 0,
-			member: {},
+			member: member || {},
 			joined: !!room,
 			canViewMembers: false,
 			canAutoTranslate: false,
@@ -81,7 +84,7 @@ class RoomActionsView extends React.Component {
 
 	async componentDidMount() {
 		this.mounted = true;
-		const { room } = this.state;
+		const { room, member } = this.state;
 		if (!room.id) {
 			try {
 				const result = await RocketChat.getChannelInfo(room.rid);
@@ -102,7 +105,7 @@ class RoomActionsView extends React.Component {
 			} catch (e) {
 				log(e);
 			}
-		} else if (room.t === 'd') {
+		} else if (room.t === 'd' && _.isEmpty(member)) {
 			this.updateRoomMember();
 		}
 
@@ -181,7 +184,7 @@ class RoomActionsView extends React.Component {
 
 	get sections() {
 		const {
-			room, membersCount, canViewMembers, canAddUser, canInviteUser, joined, canAutoTranslate
+			room, member, membersCount, canViewMembers, canAddUser, canInviteUser, joined, canAutoTranslate
 		} = this.state;
 		const { jitsiEnabled } = this.props;
 		const {
@@ -217,7 +220,9 @@ class RoomActionsView extends React.Component {
 				name: I18n.t('Room_Info'),
 				route: 'RoomInfoView',
 				// forward room only if room isn't joined
-				params: { rid, t, room },
+				params: {
+					rid, t, room, member
+				},
 				testID: 'room-actions-info'
 			}],
 			renderItem: this.renderRoomInfo
@@ -452,6 +457,7 @@ class RoomActionsView extends React.Component {
 						)
 					}
 					<Text style={[styles.roomDescription, { color: themes[theme].auxiliaryText }]} ellipsizeMode='tail' numberOfLines={1}>{t === 'd' ? `@${ name }` : topic}</Text>
+					{room.t === 'd' && <Markdown msg={member.statusText} style={[styles.roomDescription, { color: themes[theme].auxiliaryText }]} preview theme={theme} />}
 				</View>,
 				<DisclosureIndicator theme={theme} key='disclosure-indicator' />
 			], item)