snapshot of https://github.com/RocketChat/Rocket.Chat.git (develop, 2026-09-16; blobs > 131072B omitted)

apps/meteor/client/views/room/modals/E2EEModals/BaseDisableE2EEModal.tsx

@@ -0,0 +1,42 @@
+import { useStableCallback } from '@rocket.chat/fuselage-hooks';
+import { useState } from 'react';
+
+import DisableE2EEModal from './DisableE2EEModal';
+import ResetKeysE2EEModal from './ResetKeysE2EEModal';
+
+const STEPS = {
+	DISABLE_E2EE: 'DISABLE_E2EE',
+	RESET_ROOM_KEY: 'RESET_ROOM_KEY',
+};
+
+export type BaseDisableE2EEModalProps = {
+	onConfirm: () => void;
+	onClose: () => void;
+	roomType: string;
+	roomId: string;
+	canResetRoomKey: boolean;
+};
+
+const BaseDisableE2EEModal = ({ onConfirm, onClose, roomType, roomId, canResetRoomKey }: BaseDisableE2EEModalProps) => {
+	const [step, setStep] = useState(STEPS.DISABLE_E2EE);
+
+	const onResetRoomKey = useStableCallback(() => {
+		setStep(STEPS.RESET_ROOM_KEY);
+	});
+
+	if (step === STEPS.RESET_ROOM_KEY && canResetRoomKey) {
+		return <ResetKeysE2EEModal roomType={roomType} roomId={roomId} onCancel={onClose} />;
+	}
+
+	return (
+		<DisableE2EEModal
+			onConfirm={onConfirm}
+			onCancel={onClose}
+			roomType={roomType}
+			canResetRoomKey={canResetRoomKey}
+			onResetRoomKey={onResetRoomKey}
+		/>
+	);
+};
+
+export default BaseDisableE2EEModal;

apps/meteor/client/views/room/modals/E2EEModals/DisableE2EEModal.tsx

@@ -0,0 +1,52 @@
+import { Accordion, AccordionItem, Box, Button } from '@rocket.chat/fuselage';
+import { GenericModal } from '@rocket.chat/ui-client';
+import { Trans, useTranslation } from 'react-i18next';
+
+export type DisableE2EEModalProps = {
+	onConfirm: () => void;
+	onCancel: () => void;
+	roomType: string;
+	canResetRoomKey: boolean;
+	onResetRoomKey: () => void;
+};
+
+const DisableE2EEModal = ({ onConfirm, onCancel, roomType, canResetRoomKey, onResetRoomKey }: DisableE2EEModalProps) => {
+	const { t } = useTranslation();
+
+	return (
+		<GenericModal
+			icon='key'
+			title={t('E2E_disable_encryption')}
+			variant='warning'
+			confirmText={t('E2E_disable_encryption')}
+			onConfirm={onConfirm}
+			onCancel={onCancel}
+			onDismiss={() => undefined}
+			annotation={t('Proceed_with_caution')}
+		>
+			<Box marginBlockEnd={16} is='p'>
+				<Trans i18nKey='E2E_disable_encryption_description' tOptions={{ roomType }} />
+			</Box>
+
+			{canResetRoomKey && (
+				<>
+					<Box marginBlockEnd={16} is='p'>
+						{t('E2E_disable_encryption_reset_keys_description')}
+					</Box>
+					<Accordion>
+						<AccordionItem title={t('E2E_reset_encryption_keys')}>
+							<Box marginBlockEnd={16} is='p'>
+								{t('E2E_reset_encryption_keys_description')}
+							</Box>
+							<Button secondary danger small onClick={onResetRoomKey}>
+								{t('E2E_reset_encryption_keys_button', { roomType })}
+							</Button>
+						</AccordionItem>
+					</Accordion>
+				</>
+			)}
+		</GenericModal>
+	);
+};
+
+export default DisableE2EEModal;

apps/meteor/client/views/room/modals/E2EEModals/EnableE2EEModal.tsx

@@ -0,0 +1,30 @@
+import { Box } from '@rocket.chat/fuselage';
+import { GenericModal } from '@rocket.chat/ui-client';
+import { useTranslation } from 'react-i18next';
+
+export type EnableE2EEModalProps = {
+	onConfirm: () => void;
+	onClose: () => void;
+	roomType: string;
+};
+
+const EnableE2EEModal = ({ onConfirm, onClose, roomType }: EnableE2EEModalProps) => {
+	const { t } = useTranslation();
+
+	return (
+		<GenericModal
+			icon='key'
+			title={t('E2E_enable_encryption')}
+			variant='warning'
+			confirmText={t('E2E_enable_encryption')}
+			onConfirm={onConfirm}
+			onCancel={onClose}
+		>
+			<Box marginBlockEnd={16} is='p'>
+				{t('E2E_enable_encryption_description', { roomType })}
+			</Box>
+		</GenericModal>
+	);
+};
+
+export default EnableE2EEModal;

apps/meteor/client/views/room/modals/E2EEModals/ResetKeysE2EEModal.tsx

@@ -0,0 +1,62 @@
+import { Box, ModalFooterAnnotation, ModalIcon } from '@rocket.chat/fuselage';
+import { ExternalLink, GenericModal } from '@rocket.chat/ui-client';
+import { useToastMessageDispatch } from '@rocket.chat/ui-contexts';
+import { Trans, useTranslation } from 'react-i18next';
+
+import { links } from '../../../../lib/links';
+import { useE2EEResetRoomKey } from '../../hooks/useE2EEResetRoomKey';
+
+const E2EE_RESET_KEY_LINK = links.go.e2eeGuide;
+
+export type ResetKeysE2EEModalProps = {
+	roomType: string;
+	roomId: string;
+	onCancel: () => void;
+};
+
+const ResetKeysE2EEModal = ({ roomType, roomId, onCancel }: ResetKeysE2EEModalProps) => {
+	const { t } = useTranslation();
+	const resetRoomKeyMutation = useE2EEResetRoomKey();
+
+	const dispatchToastMessage = useToastMessageDispatch();
+
+	const handleResetRoomKey = () => {
+		resetRoomKeyMutation.mutate(
+			{ roomId },
+			{
+				onSuccess: () => {
+					dispatchToastMessage({ type: 'success', message: t('E2E_reset_encryption_keys_success') });
+				},
+				onError: () => {
+					dispatchToastMessage({ type: 'error', message: t('E2E_reset_encryption_keys_error') });
+				},
+				onSettled: () => {
+					onCancel();
+				},
+			},
+		);
+	};
+
+	return (
+		<GenericModal
+			icon={<ModalIcon color='danger' name='key' />}
+			title={t('E2E_reset_encryption_keys')}
+			variant='danger'
+			confirmText={t('E2E_reset_encryption_keys')}
+			dontAskAgain={<ModalFooterAnnotation>{t('This_action_cannot_be_undone')}</ModalFooterAnnotation>}
+			onCancel={onCancel}
+			onConfirm={handleResetRoomKey}
+			onDismiss={() => undefined}
+		>
+			<Box marginBlockEnd={16} is='p'>
+				<Trans i18nKey='E2E_reset_encryption_keys_modal_description' tOptions={{ roomType }}>
+					Resetting E2EE keys is only recommend if no {roomType} member has a valid key to regain access to the previously encrypted
+					content. All members may lose access to previously encrypted content.
+					<ExternalLink to={E2EE_RESET_KEY_LINK}>Learn more</ExternalLink> about resetting encryption keys. Proceed with caution.
+				</Trans>
+			</Box>
+		</GenericModal>
+	);
+};
+
+export default ResetKeysE2EEModal;