Merge remote-tracking branch 'rocket.chat/develop' into HEAD

app/otr/client/rocketchat.otr.room.js

@@ -10,10 +10,11 @@ import toastr from 'toastr';
 
 import { OTR } from './rocketchat.otr';
 import { Notifications } from '../../notifications';
-import { modal } from '../../ui-utils';
 import { getUidDirectMessage } from '../../ui-utils/client/lib/getUidDirectMessage';
 import { Presence } from '../../../client/lib/presence';
 import { goToRoomById } from '../../../client/lib/goToRoomById';
+import { imperativeModal } from '../../../client/lib/imperativeModal';
+import GenericModal from '../../../client/components/GenericModal';
 
 OTR.Room = class {
 	constructor(userId, roomId) {
@@ -208,31 +209,32 @@ OTR.Room = class {
 							this.reset();
 						}
 
-						modal.open({
-							title: TAPi18n.__('OTR'),
-							text: TAPi18n.__('Username_wants_to_start_otr_Do_you_want_to_accept', { username }),
-							html: true,
-							showCancelButton: true,
-							allowOutsideClick: false,
-							confirmButtonText: TAPi18n.__('Yes'),
-							cancelButtonText: TAPi18n.__('No'),
-						}, (isConfirm) => {
-							if (isConfirm) {
-								establishConnection();
-							} else {
-								Meteor.clearTimeout(timeout);
-								this.deny();
-							}
+						imperativeModal.open({ component: GenericModal,
+							props: {
+								variant: 'warning',
+								title: TAPi18n.__('OTR'),
+								children: TAPi18n.__('Username_wants_to_start_otr_Do_you_want_to_accept', { username }),
+								confirmText: TAPi18n.__('Yes'),
+								cancelText: TAPi18n.__('No'),
+								onClose: () => imperativeModal.close,
+								onCancel: () => {
+									Meteor.clearTimeout(timeout);
+									this.deny();
+									imperativeModal.close();
+								},
+								onConfirm: () => {
+									establishConnection();
+									imperativeModal.close();
+								},
+							},
 						});
 					}
 
 					timeout = Meteor.setTimeout(() => {
 						this.establishing.set(false);
-						modal.close();
+						imperativeModal.close();
 					}, 10000);
 				})();
-
-
 				break;
 
 			case 'acknowledge':
@@ -242,28 +244,41 @@ OTR.Room = class {
 				break;
 
 			case 'deny':
-				if (this.establishing.get()) {
-					this.reset();
-					const user = Meteor.users.findOne(this.peerId);
-					modal.open({
-						title: TAPi18n.__('OTR'),
-						text: TAPi18n.__('Username_denied_the_OTR_session', { username: user.username }),
-						html: true,
-					});
-				}
+				(async () => {
+					const { username } = await Presence.get(this.peerId);
+					if (this.establishing.get()) {
+						this.reset();
+						imperativeModal.open({ component: GenericModal,
+							props: {
+								variant: 'warning',
+								title: TAPi18n.__('OTR'),
+								children: TAPi18n.__('Username_denied_the_OTR_session', { username }),
+								onClose: imperativeModal.close,
+								onConfirm: imperativeModal.close,
+							},
+						});
+					}
+				})();
 				break;
 
 			case 'end':
-				if (this.established.get()) {
-					this.reset();
-					const user = Meteor.users.findOne(this.peerId);
-					modal.open({
-						title: TAPi18n.__('OTR'),
-						text: TAPi18n.__('Username_ended_the_OTR_session', { username: user.username }),
-						html: true,
-						confirmButtonText: TAPi18n.__('Ok'),
-					});
-				}
+				(async () => {
+					const { username } = await Presence.get(this.peerId);
+
+					if (this.established.get()) {
+						this.reset();
+						imperativeModal.open({ component: GenericModal,
+							props: {
+								variant: 'warning',
+								title: TAPi18n.__('OTR'),
+								children: TAPi18n.__('Username_ended_the_OTR_session', { username }),
+								confirmText: TAPi18n.__('Ok'),
+								onClose: imperativeModal.close,
+								onConfirm: imperativeModal.close,
+							},
+						});
+					}
+				})();
 				break;
 		}
 	}

app/ui-utils/client/lib/readMessages.js

@@ -31,7 +31,6 @@ export const readMessage = new class extends Emitter {
 			return;
 		}
 
-
 		const subscription = ChatSubscription.findOne({ rid });
 		if (subscription == null) {
 			this.log('readMessage -> readNow canceled, no subscription found for rid:', rid);
@@ -71,6 +70,13 @@ export const readMessage = new class extends Emitter {
 			this.log('readMessage -> readNow canceled, no rid informed');
 			return;
 		}
+
+		const subscription = ChatSubscription.findOne({ rid });
+		if (subscription == null) {
+			this.log('readMessage -> readNow canceled, no subscription found for rid:', rid);
+			return;
+		}
+
 		return Meteor.call('readMessages', rid, () => {
 			RoomHistoryManager.getRoom(rid).unreadNotLoaded.set(0);
 			return this.emit(rid);

client/components/CreateDiscussion/DefaultParentRoomField.tsx

@@ -1,6 +1,7 @@
-import { Skeleton, Select, Callout } from '@rocket.chat/fuselage';
+import { Skeleton, TextInput, Callout } from '@rocket.chat/fuselage';
 import React, { useMemo, ReactElement } from 'react';
 
+import { roomTypes } from '../../../app/utils/client/lib/roomTypes';
 import { useTranslation } from '../../contexts/TranslationContext';
 import { AsyncStatePhase } from '../../hooks/useAsyncState';
 import { useEndpointData } from '../../hooks/useEndpointData';
@@ -29,12 +30,9 @@ const DefaultParentRoomField = ({
 		return <Callout type={'error'}>{t('Error')}</Callout>;
 	}
 
-	const { _id, fname, name } = value?.room;
-
 	return (
-		<Select
-			options={[[_id, (fname || name) as string]]}
-			value={_id}
+		<TextInput
+			value={roomTypes.getRoomName(value.room.t, value.room)}
 			disabled
 			onChange={(): string => ''}
 		/>

client/contexts/UserContext.ts

@@ -1,9 +1,11 @@
+import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
 import { FilterQuery } from 'mongodb';
 import { createContext, useContext, useMemo } from 'react';
 import { useSubscription, Subscription, Unsubscribe } from 'use-subscription';
 
 import { IRoom } from '../../definition/IRoom';
 import { ISubscription } from '../../definition/ISubscription';
+import { useRoute } from './RouterContext';
 
 type SubscriptionQuery =
 	| {
@@ -34,6 +36,7 @@ type UserContextValue = {
 	userId: string | null;
 	user: Meteor.User | null;
 	loginWithPassword: (user: string | object, password: string) => Promise<void>;
+	logout: () => Promise<void>;
 	queryPreference: <T>(
 		key: string | Mongo.ObjectID,
 		defaultValue?: T,
@@ -58,6 +61,7 @@ export const UserContext = createContext<UserContextValue>({
 	userId: null,
 	user: null,
 	loginWithPassword: async () => undefined,
+	logout: () => Promise.resolve(),
 	queryPreference: () => ({
 		getCurrentValue: (): undefined => undefined,
 		subscribe: (): Unsubscribe => (): void => undefined,
@@ -85,6 +89,18 @@ export const useLoginWithPassword = (): ((
 	password: string,
 ) => Promise<void>) => useContext(UserContext).loginWithPassword;
 
+export const useLogout = (): (() => void) => {
+	const router = useRoute('home');
+	const { logout } = useContext(UserContext);
+
+	const handleLogout = useMutableCallback(() => {
+		logout();
+		router.push({});
+	});
+
+	return handleLogout;
+};
+
 export const useUserPreference = <T>(key: string, defaultValue?: T): T | undefined => {
 	const { queryPreference } = useContext(UserContext);
 	const subscription = useMemo(

client/providers/UserProvider.tsx

@@ -1,6 +1,7 @@
 import { Meteor } from 'meteor/meteor';
 import React, { useMemo, FC } from 'react';
 
+import { callbacks } from '../../app/callbacks/client';
 import { Subscriptions, Rooms } from '../../app/models/client';
 import { getUserPreference } from '../../app/utils/client';
 import { IRoom } from '../../definition/IRoom';
@@ -29,6 +30,20 @@ const loginWithPassword = (user: string | object, password: string): Promise<voi
 		);
 	});
 
+const logout = (): Promise<void> =>
+	new Promise((resolve) => {
+		const user = Meteor.user();
+
+		if (!user) {
+			return resolve();
+		}
+
+		Meteor.logout(() => {
+			callbacks.run('afterLogoutCleanUp', user);
+			Meteor.call('logoutCleanUp', user, resolve);
+		});
+	});
+
 const UserProvider: FC = ({ children }) => {
 	const userId = useReactiveValue(getUserId);
 	const user = useReactiveValue(getUser);
@@ -37,6 +52,7 @@ const UserProvider: FC = ({ children }) => {
 			userId,
 			user,
 			loginWithPassword,
+			logout,
 			queryPreference: createReactiveSubscriptionFactory((key, defaultValue) =>
 				getUserPreference(userId, key, defaultValue),
 			),

client/sidebar/header/UserDropdown.js

@@ -1,7 +1,6 @@
 import { Box, Margins, Divider, Option } from '@rocket.chat/fuselage';
 import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
 import { FlowRouter } from 'meteor/kadira:flow-router';
-import { Meteor } from 'meteor/meteor';
 import React from 'react';
 
 import { callbacks } from '../../../app/callbacks/client';
@@ -14,6 +13,7 @@ import { useAtLeastOnePermission } from '../../contexts/AuthorizationContext';
 import { useRoute } from '../../contexts/RouterContext';
 import { useSetting } from '../../contexts/SettingsContext';
 import { useTranslation } from '../../contexts/TranslationContext';
+import { useLogout } from '../../contexts/UserContext';
 import { useReactiveValue } from '../../hooks/useReactiveValue';
 
 const ADMIN_PERMISSIONS = [
@@ -47,10 +47,11 @@ const getItems = () => AccountBox.getItems();
 
 const UserDropdown = ({ user, onClose }) => {
 	const t = useTranslation();
-	const homeRoute = useRoute('home');
 	const accountRoute = useRoute('account');
 	const adminRoute = useRoute('admin');
 
+	const logout = useLogout();
+
 	const { name, username, avatarETag, status, statusText } = user;
 
 	const useRealName = useSetting('UI_Use_Real_Name');
@@ -78,15 +79,6 @@ const UserDropdown = ({ user, onClose }) => {
 		onClose();
 	});
 
-	const handleLogout = useMutableCallback(() => {
-		Meteor.logout(() => {
-			callbacks.run('afterLogoutCleanUp', user);
-			Meteor.call('logoutCleanUp', user);
-			homeRoute.push({});
-			popover.close();
-		});
-	});
-
 	const handleMyAccount = useMutableCallback(() => {
 		accountRoute.push({});
 		popover.close();
@@ -97,6 +89,11 @@ const UserDropdown = ({ user, onClose }) => {
 		popover.close();
 	});
 
+	const handleLogout = useMutableCallback(() => {
+		logout();
+		popover.close();
+	});
+
 	const accountBoxItems = useReactiveValue(getItems);
 
 	return (

client/views/account/AccountProfilePage.js

@@ -10,7 +10,7 @@ import { useMethod } from '../../contexts/ServerContext';
 import { useSetting } from '../../contexts/SettingsContext';
 import { useToastMessageDispatch } from '../../contexts/ToastMessagesContext';
 import { useTranslation } from '../../contexts/TranslationContext';
-import { useUser } from '../../contexts/UserContext';
+import { useUser, useLogout } from '../../contexts/UserContext';
 import { useForm } from '../../hooks/useForm';
 import { useUpdateAvatar } from '../../hooks/useUpdateAvatar';
 import AccountProfileForm from './AccountProfileForm';
@@ -37,9 +37,10 @@ const AccountProfilePage = () => {
 
 	const user = useUser();
 
-	const { values, handlers, hasUnsavedChanges, commit } = useForm(getInitialValues(user));
+	const { values, handlers, hasUnsavedChanges, commit } = useForm(getInitialValues(user ?? {}));
 	const [canSave, setCanSave] = useState(true);
 	const setModal = useSetModal();
+	const logout = useLogout();
 	const [loggingOut, setLoggingOut] = useState(false);
 
 	const logoutOtherClients = useMethod('logoutOtherClients');
@@ -114,7 +115,7 @@ const AccountProfilePage = () => {
 
 	const { handleAvatar, handlePassword, handleConfirmationPassword } = handlers;
 
-	const updateAvatar = useUpdateAvatar(avatar, user._id);
+	const updateAvatar = useUpdateAvatar(avatar, user?._id);
 
 	const onSave = useCallback(async () => {
 		const save = async (typedPassword) => {
@@ -192,6 +193,7 @@ const AccountProfilePage = () => {
 			try {
 				await deleteOwnAccount(SHA256(passwordOrUsername));
 				dispatchToastMessage({ type: 'success', message: t('User_has_been_deleted') });
+				logout();
 			} catch (error) {
 				if (error.error === 'user-last-owner') {
 					const { shouldChangeOwner, shouldBeRemoved } = error.details;
@@ -233,7 +235,16 @@ const AccountProfilePage = () => {
 				text={t('If_you_are_sure_type_in_your_username')}
 			/>
 		));
-	}, [closeModal, deleteOwnAccount, dispatchToastMessage, erasureType, localPassword, t, setModal]);
+	}, [
+		closeModal,
+		deleteOwnAccount,
+		dispatchToastMessage,
+		erasureType,
+		localPassword,
+		t,
+		logout,
+		setModal,
+	]);
 
 	return (
 		<Page>
@@ -249,7 +260,7 @@ const AccountProfilePage = () => {
 					<AccountProfileForm
 						values={values}
 						handlers={handlers}
-						user={user}
+						user={user ?? { emails: [] }}
 						settings={settings}
 						onSaveStateChange={setCanSave}
 					/>