Merge remote-tracking branch 'origin/develop' into chore/license-ms

app/action-links/client/lib/actionLinks.js

@@ -1,7 +1,7 @@
 import { Meteor } from 'meteor/meteor';
 
 import { handleError } from '../../../../client/lib/utils/handleError';
-import { Messages, Subscriptions } from '../../../models/client';
+import { Messages } from '../../../models/client';
 
 // Action Links namespace creation.
 export const actionLinks = {
@@ -24,16 +24,6 @@ export const actionLinks = {
 			});
 		}
 
-		const subscription = Subscriptions.findOne({
-			'rid': message.rid,
-			'u._id': userId,
-		});
-		if (!subscription) {
-			throw new Meteor.Error('error-not-allowed', 'Not allowed', {
-				function: 'actionLinks.getMessage',
-			});
-		}
-
 		if (!message.actionLinks || !message.actionLinks[name]) {
 			throw new Meteor.Error('error-invalid-actionlink', 'Invalid action link', {
 				function: 'actionLinks.getMessage',

app/action-links/server/lib/actionLinks.js

@@ -1,6 +1,16 @@
 import { Meteor } from 'meteor/meteor';
 
-import { Messages, Subscriptions } from '../../../models/server';
+import { getMessageForUser } from '../../../../server/lib/messages/getMessageForUser';
+
+function getMessageById(messageId) {
+	try {
+		return Promise.await(getMessageForUser(messageId, Meteor.userId()));
+	} catch (e) {
+		throw new Meteor.Error(e.message, 'Invalid message', {
+			function: 'actionLinks.getMessage',
+		});
+	}
+}
 
 // Action Links namespace creation.
 export const actionLinks = {
@@ -9,30 +19,14 @@ export const actionLinks = {
 		actionLinks.actions[name] = funct;
 	},
 	getMessage(name, messageId) {
-		const userId = Meteor.userId();
-		if (!userId) {
-			throw new Meteor.Error('error-invalid-user', 'Invalid user', {
-				function: 'actionLinks.getMessage',
-			});
-		}
+		const message = getMessageById(messageId);
 
-		const message = Messages.findOne({ _id: messageId });
 		if (!message) {
 			throw new Meteor.Error('error-invalid-message', 'Invalid message', {
 				function: 'actionLinks.getMessage',
 			});
 		}
 
-		const subscription = Subscriptions.findOne({
-			'rid': message.rid,
-			'u._id': userId,
-		});
-		if (!subscription) {
-			throw new Meteor.Error('error-not-allowed', 'Not allowed', {
-				function: 'actionLinks.getMessage',
-			});
-		}
-
 		if (!message.actionLinks || !message.actionLinks[name]) {
 			throw new Meteor.Error('error-invalid-actionlink', 'Invalid action link', {
 				function: 'actionLinks.getMessage',

app/lib/lib/roomTypes/private.js

@@ -1,6 +1,6 @@
 import { Meteor } from 'meteor/meteor';
 
-import { ChatRoom, ChatSubscription } from '../../../models';
+import { ChatRoom } from '../../../models';
 import { openRoom } from '../../../ui-utils';
 import { settings } from '../../../settings';
 import { hasAtLeastOnePermission, hasPermission } from '../../../authorization';
@@ -74,15 +74,6 @@ export class PrivateRoomType extends RoomTypeConfig {
 		return hasAtLeastOnePermission(['add-user-to-any-p-room', 'add-user-to-joined-room'], room._id);
 	}
 
-	canSendMessage(roomId) {
-		// TODO: remove duplicated code
-		return (
-			ChatSubscription.find({
-				rid: roomId,
-			}).count() > 0
-		);
-	}
-
 	allowRoomSettingChange(room, setting) {
 		switch (setting) {
 			case RoomSettingsEnum.JOIN_CODE:

app/lib/lib/roomTypes/public.js

@@ -1,7 +1,7 @@
 import { Meteor } from 'meteor/meteor';
 
 import { openRoom } from '../../../ui-utils';
-import { ChatRoom, ChatSubscription } from '../../../models';
+import { ChatRoom } from '../../../models';
 import { settings } from '../../../settings';
 import { hasAtLeastOnePermission } from '../../../authorization';
 import { getUserPreference, RoomTypeConfig, RoomTypeRouteConfig, RoomSettingsEnum, UiTextContext, RoomMemberActions } from '../../../utils';
@@ -86,20 +86,6 @@ export class PublicRoomType extends RoomTypeConfig {
 		return hasAtLeastOnePermission(['add-user-to-any-c-room', 'add-user-to-joined-room'], room._id);
 	}
 
-	canSendMessage(roomId) {
-		const room = ChatRoom.findOne({ _id: roomId, t: 'c' }, { fields: { prid: 1 } });
-		if (room.prid) {
-			return true;
-		}
-
-		// TODO: remove duplicated code
-		return (
-			ChatSubscription.find({
-				rid: roomId,
-			}).count() > 0
-		);
-	}
-
 	enableMembersListProfile() {
 		return true;
 	}

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

@@ -62,6 +62,7 @@ export const openRoom = async function (type, name, render = true) {
 			}
 
 			NewRoomManager.open(room._id);
+			Session.set('openedRoom', room._id);
 
 			fireGlobalEvent('room-opened', _.omit(room, 'usernames'));
 

app/videobridge/client/actionLink.js

@@ -7,20 +7,48 @@ import { Rooms } from '../../models';
 import { dispatchToastMessage } from '../../../client/lib/toast';
 
 actionLinks.register('joinJitsiCall', function (message, params, instance) {
-	if (Session.get('openedRoom')) {
-		const rid = Session.get('openedRoom');
+	const rid = Session.get('openedRoom');
+	if (!rid) {
+		return;
+	}
+
+	const room = Rooms.findOne({ _id: rid });
+	const username = Meteor.user()?.username;
+
+	if (!room) {
+		dispatchToastMessage({ type: 'info', message: TAPi18n.__('Call Already Ended', '') });
+		return;
+	}
+
+	if (room?.muted?.includes(username)) {
+		dispatchToastMessage({ type: 'error', message: TAPi18n.__('You_have_been_muted', '') });
+		return;
+	}
+
+	const clickTime = new Date();
+	const jitsiTimeout = new Date(room.jitsiTimeout);
 
-		const room = Rooms.findOne({ _id: rid });
-		const username = Meteor.user()?.username;
-		const currentTime = new Date().getTime();
-		const jitsiTimeout = new Date((room && room.jitsiTimeout) || currentTime).getTime();
+	if (jitsiTimeout > clickTime) {
+		instance.tabBar.open('video');
+		return;
+	}
+
+	// Get updated room info from the server to check if the call is still happening
+	Meteor.call('getRoomById', rid, (err, result) => {
+		if (err) {
+			throw err;
+		}
 
-		if (room && room?.muted?.includes(username)) {
-			dispatchToastMessage({ type: 'error', message: TAPi18n.__('You_have_been_muted', '') });
-		} else if (jitsiTimeout > currentTime) {
+		// If the openedRoom has changed, abort
+		if (rid !== Session.get('openedRoom')) {
+			return;
+		}
+
+		if (result?.jitsiTimeout && result.jitsiTimeout instanceof Date && result.jitsiTimeout > clickTime) {
 			instance.tabBar.open('video');
-		} else {
-			dispatchToastMessage({ type: 'info', message: TAPi18n.__('Call Already Ended', '') });
+			return;
 		}
-	}
+
+		dispatchToastMessage({ type: 'info', message: TAPi18n.__('Call Already Ended', '') });
+	});
 });

client/components/modal/ModalBackdrop.tsx

@@ -0,0 +1,103 @@
+import { Box } from '@rocket.chat/fuselage';
+import React, { MouseEvent, ReactElement, ReactNode, RefObject, useCallback, useEffect, useRef } from 'react';
+
+const useEscapeKey = (onDismiss: (() => void) | undefined): void => {
+	useEffect(() => {
+		const closeOnEsc = (e: KeyboardEvent): void => {
+			if (e.key !== 'Escape') {
+				return;
+			}
+
+			e.stopPropagation();
+			onDismiss?.();
+		};
+
+		window.addEventListener('keyup', closeOnEsc);
+
+		return (): void => {
+			window.removeEventListener('keyup', closeOnEsc);
+		};
+	}, [onDismiss]);
+};
+
+const isAtBackdropChildren = (e: MouseEvent, ref: RefObject<HTMLElement>): boolean => {
+	const backdrop = ref.current;
+	const { parentElement } = e.target as HTMLElement;
+
+	return (Boolean(parentElement) && backdrop?.contains(parentElement)) ?? false;
+};
+
+const useOutsideClick = (
+	ref: RefObject<HTMLElement>,
+	onDismiss: (() => void) | undefined,
+): {
+	onMouseDown: (e: MouseEvent) => void;
+	onMouseUp: (e: MouseEvent) => void;
+} => {
+	const hasClicked = useRef<boolean>(false);
+
+	const onMouseDown = useCallback(
+		(e) => {
+			if (isAtBackdropChildren(e, ref)) {
+				hasClicked.current = false;
+				return;
+			}
+
+			hasClicked.current = true;
+		},
+		[ref],
+	);
+
+	const onMouseUp = useCallback(
+		(e: MouseEvent) => {
+			if (isAtBackdropChildren(e, ref)) {
+				hasClicked.current = false;
+				return;
+			}
+
+			if (!hasClicked.current) {
+				return;
+			}
+
+			hasClicked.current = false;
+			e.stopPropagation();
+			onDismiss?.();
+		},
+		[onDismiss, ref],
+	);
+
+	return {
+		onMouseDown,
+		onMouseUp,
+	};
+};
+
+type ModalBackdropProps = {
+	children?: ReactNode;
+	onDismiss?: () => void;
+};
+
+const ModalBackdrop = ({ children, onDismiss }: ModalBackdropProps): ReactElement => {
+	const ref = useRef<HTMLDivElement>(null);
+
+	useEscapeKey(onDismiss);
+	const { onMouseDown, onMouseUp } = useOutsideClick(ref, onDismiss);
+
+	return (
+		<Box
+			ref={ref}
+			children={children}
+			className='rcx-modal__backdrop'
+			position='fixed'
+			zIndex={9999}
+			inset={0}
+			display='flex'
+			flexDirection='column'
+			backgroundColor='neutral-800-50'
+			onMouseDown={onMouseDown}
+			onMouseUp={onMouseUp}
+		/>
+	);
+};
+
+export default ModalBackdrop;

client/components/ModalPortal.tsx → client/components/modal/ModalPortal.tsx

@@ -1,4 +1,4 @@
-import { FC, memo, useState } from 'react';
+import { memo, ReactElement, ReactNode, useState } from 'react';
 import { createPortal } from 'react-dom';
 
 const getModalRoot = (): Element => {
@@ -14,9 +14,13 @@ const getModalRoot = (): Element => {
 	return newElement;
 };
 
-const ModalPortal: FC = ({ children }) => {
+type ModalPortalProps = {
+	children?: ReactNode;
+};
+
+const ModalPortal = ({ children }: ModalPortalProps): ReactElement => {
 	const [modalRoot] = useState(getModalRoot);
 	return createPortal(children, modalRoot);
 };
 
-export default memo<typeof ModalPortal>(ModalPortal);
+export default memo(ModalPortal);

client/providers/ModalProvider.tsx

@@ -1,15 +1,19 @@
-import { Modal } from '@rocket.chat/fuselage';
-import React, { useState, useMemo, memo, FC, ComponentProps, ReactNode } from 'react';
+import React, { useState, useMemo, memo, ReactNode, useCallback, ReactElement } from 'react';
 
 import { modal } from '../../app/ui-utils/client/lib/modal';
-import ModalPortal from '../components/ModalPortal';
+import ModalBackdrop from '../components/modal/ModalBackdrop';
+import ModalPortal from '../components/modal/ModalPortal';
 import { ModalContext } from '../contexts/ModalContext';
 import { useImperativeModal } from '../views/hooks/useImperativeModal';
 
-const ModalProvider: FC = ({ children }) => {
+type ModalProviderProps = {
+	children?: ReactNode;
+};
+
+const ModalProvider = ({ children }: ModalProviderProps): ReactElement => {
 	const [currentModal, setCurrentModal] = useState<ReactNode>(null);
 
-	const contextValue = useMemo<ComponentProps<typeof ModalContext.Provider>['value']>(
+	const contextValue = useMemo(
 		() =>
 			Object.assign(modal, {
 				setModal: setCurrentModal,
@@ -19,12 +23,14 @@ const ModalProvider: FC = ({ children }) => {
 
 	useImperativeModal(setCurrentModal);
 
+	const handleDismiss = useCallback(() => setCurrentModal(null), [setCurrentModal]);
+
 	return (
 		<ModalContext.Provider value={contextValue}>
 			{children}
 			{currentModal && (
 				<ModalPortal>
-					<Modal.Backdrop zIndex={9999}>{currentModal}</Modal.Backdrop>
+					<ModalBackdrop onDismiss={handleDismiss}>{currentModal}</ModalBackdrop>
 				</ModalPortal>
 			)}
 		</ModalContext.Provider>

client/views/room/contextualBar/Call/Jitsi/CallJitsiWithData.js

@@ -3,6 +3,7 @@ import { useMutableCallback, useSafely } from '@rocket.chat/fuselage-hooks';
 import { clear } from '@rocket.chat/memo';
 import React, { useRef, useEffect, useState, useMemo, useLayoutEffect, memo } from 'react';
 
+import { Subscriptions } from '../../../../../../app/models/client';
 import { HEARTBEAT, TIMEOUT, DEBOUNCE } from '../../../../../../app/videobridge/constants';
 import { useConnectionStatus } from '../../../../../contexts/ConnectionStatusContext';
 import { useSetModal } from '../../../../../contexts/ModalContext';
@@ -44,6 +45,7 @@ const CallJitsiWithData = ({ rid }) => {
 	const closeModal = useMutableCallback(() => setModal(null));
 	const generateAccessToken = useMethod('jitsi:generateAccessToken');
 	const updateTimeout = useMethod('jitsi:updateTimeout');
+	const joinRoom = useMethod('joinRoom');
 	const dispatchToastMessage = useToastMessageDispatch();
 	const t = useTranslation();
 
@@ -187,6 +189,10 @@ const CallJitsiWithData = ({ rid }) => {
 		}
 
 		setAccepted(true);
+		const sub = Subscriptions.findOne({ rid, 'u._id': user._id });
+		if (!sub) {
+			joinRoom(rid);
+		}
 
 		if (openNewWindow) {
 			handleClose();