RocketChat · kodiakhq · Jun 19, 2024 · Jun 5, 2024 · Jun 5, 2024 · Jun 6, 2024
diff --git a/.changeset/plenty-buses-kneel.md b/.changeset/plenty-buses-kneel.md
@@ -0,0 +1,6 @@
+---
+'@rocket.chat/i18n': minor
+'@rocket.chat/meteor': minor
+---
+
+Disable "Reply in direct message", "Copy link" and "Forward message" message menu items for encrypted messages as they don't apply to encrypted messages and also disable apps menu items and show a warning.
diff --git a/apps/meteor/app/ui-utils/client/lib/MessageAction.ts b/apps/meteor/app/ui-utils/client/lib/MessageAction.ts
@@ -25,7 +25,7 @@ export type MessageActionContext =
 
 type MessageActionType = 'communication' | 'interaction' | 'duplication' | 'apps' | 'management';
 
-type MessageActionConditionProps = {
+export type MessageActionConditionProps = {
  message: IMessage;
  user: IUser | undefined;
  room: IRoom;
@@ -65,6 +65,7 @@ export type MessageActionConfig = {
  ) => any;
  condition?: (props: MessageActionConditionProps) => Promise<boolean> | boolean;
  type?: MessageActionType;
+ disabled?: (props: MessageActionConditionProps) => boolean;
 };
 
 class MessageAction {

diff --git a/apps/meteor/app/ui-utils/client/lib/messageActionDefault.ts b/apps/meteor/app/ui-utils/client/lib/messageActionDefault.ts
@@ -1,5 +1,5 @@
 import type { IMessage } from '@rocket.chat/core-typings';
-import { isRoomFederated } from '@rocket.chat/core-typings';
+import { isE2EEMessage, isRoomFederated } from '@rocket.chat/core-typings';
 import { Meteor } from 'meteor/meteor';
 import moment from 'moment';
 
@@ -63,6 +63,9 @@ Meteor.startup(async () => {
  },
  order: 0,
  group: 'menu',
+ disabled({ message }) {
+ return isE2EEMessage(message);
+ },
  });
 
  MessageAction.addButton({
@@ -87,6 +90,9 @@ Meteor.startup(async () => {
  },
  order: 0,
  group: 'message',
+ disabled({ message }) {
+ return isE2EEMessage(message);
+ },
  });
 
  MessageAction.addButton({
@@ -139,6 +145,9 @@ Meteor.startup(async () => {
  },
  order: 5,
  group: 'menu',
+ disabled({ message }) {
+ return isE2EEMessage(message);
+ },
  });
 
  MessageAction.addButton({

@@ -41,7 +41,7 @@ const GenericMenu = ({ title, icon = 'menu', disabled, onAction, ...props }: Gen
 
  const hasIcon = itemsList.some(({ icon }) => icon);
  const handleItems = (items: GenericMenuItemProps[]) =>
- hasIcon ? items.map((item) => ({ ...item, gap: !item.icon && !item.status })) : items;
+ hasIcon ? items.map((item) => ({ ...item, gap: item.gap ?? (!item.icon && !item.status) })) : items;
 
  const isMenuEmpty = !(sections && sections.length > 0) && !(items && items.length > 0);
 

@@ -12,14 +12,15 @@ export type GenericMenuItemProps = {
  disabled?: boolean;
  description?: ReactNode;
  gap?: boolean;
+ tooltip?: string;
 };
 
-const GenericMenuItem = ({ icon, content, addon, status, gap }: GenericMenuItemProps) => (
+const GenericMenuItem = ({ icon, content, addon, status, gap, tooltip }: GenericMenuItemProps) => (
  <>
  {gap && <MenuItemColumn />}
  {icon && <MenuItemIcon name={icon} />}
  {status && <MenuItemColumn>{status}</MenuItemColumn>}
- {content && <MenuItemContent>{content}</MenuItemContent>}
+ {content && <MenuItemContent title={tooltip}>{content}</MenuItemContent>}
  {addon && <MenuItemInput>{addon}</MenuItemInput>}
  </>
 );

@@ -1,8 +1,9 @@
+import { useUniqueId } from '@rocket.chat/fuselage-hooks';
 import { useTranslation } from '@rocket.chat/ui-contexts';
 import type { MouseEvent, ReactElement } from 'react';
 import React from 'react';
 
-import type { MessageActionConfig } from '../../../../app/ui-utils/client/lib/MessageAction';
+import type { MessageActionConditionProps, MessageActionConfig } from '../../../../app/ui-utils/client/lib/MessageAction';
 import GenericMenu from '../../GenericMenu/GenericMenu';
 import type { GenericMenuItemProps } from '../../GenericMenu/GenericMenuItem';
 
@@ -19,11 +20,13 @@ type MessageActionSection = {
 type MessageActionMenuProps = {
  onChangeMenuVisibility: (visible: boolean) => void;
  options: MessageActionConfigOption[];
+ context: MessageActionConditionProps;
+ isMessageEncrypted: boolean;
 };
 
-const MessageActionMenu = ({ options, onChangeMenuVisibility }: MessageActionMenuProps): ReactElement => {
+const MessageActionMenu = ({ options, onChangeMenuVisibility, context, isMessageEncrypted }: MessageActionMenuProps): ReactElement => {
  const t = useTranslation();
-
+ const id = useUniqueId();
  const groupOptions = options
  .map((option) => ({
  variant: option.color === 'alert' ? 'danger' : '',
@@ -32,6 +35,9 @@ const MessageActionMenu = ({ options, onChangeMenuVisibility }: MessageActionMen
  content: t(option.label),
  onClick: option.action,
  type: option.type,
+ ...(option.disabled && { disabled: option?.disabled?.(context) }),
+ ...(option.disabled &&
+ option?.disabled?.(context) && { tooltip: t('Action_not_available_encrypted_content', { action: t(option.label) }) }),
  }))
  .reduce((acc, option) => {
  const group = option.type ? option.type : '';
@@ -44,7 +50,31 @@ const MessageActionMenu = ({ options, onChangeMenuVisibility }: MessageActionMen
  acc.push(newSection);
 
  return acc;
- }, [] as unknown as MessageActionSection[]);
+ }, [] as unknown as MessageActionSection[])
+ .map((section) => {
+ if (section.id !== 'apps') {
+ return section;
+ }
+
+ if (!isMessageEncrypted) {
+ return section;
+ }
+
+ return {
+ id: 'apps',
+ title: t('Apps'),
+ items: [
+ {
+ content: t('Unavailable'),
+ type: 'apps',
+ id,
+ disabled: true,
+ gap: false,
+ tooltip: t('Action_not_available_encrypted_content', { action: t('Apps') }),
+ },
+ ],
+ };
+ });
 
  return (
  <GenericMenu

@@ -1,6 +1,6 @@
 import { useToolbar } from '@react-aria/toolbar';
 import type { IMessage, IRoom, ISubscription, ITranslatedMessage } from '@rocket.chat/core-typings';
-import { isThreadMessage, isRoomFederated, isVideoConfMessage } from '@rocket.chat/core-typings';
+import { isThreadMessage, isRoomFederated, isVideoConfMessage, isE2EEMessage } from '@rocket.chat/core-typings';
 import { MessageToolbar as FuselageMessageToolbar, MessageToolbarItem } from '@rocket.chat/fuselage';
 import { useFeaturePreview } from '@rocket.chat/ui-client';
 import { useUser, useSettings, useTranslation, useMethod, useLayoutHiddenActions } from '@rocket.chat/ui-contexts';
@@ -125,9 +125,14 @@ const MessageToolbar = ({
  onClick={(e): void => action.action(e, { message, tabbar: toolbox, room, chat, autoTranslateOptions })}
  key={action.id}
  icon={action.icon}
- title={t(action.label)}
+ title={
+ action?.disabled?.({ message, room, user, subscription, settings: mapSettings, chat, context })
+ ? t('Action_not_available_encrypted_content', { action: t(action.label) })
+ : t(action.label)
+ }
  data-qa-id={action.label}
  data-qa-type='message-action-menu'
+ disabled={action?.disabled?.({ message, room, user, subscription, settings: mapSettings, chat, context })}
  />
  ))}
  {actionsQueryResult.isSuccess && actionsQueryResult.data.menu.length > 0 && (
@@ -138,6 +143,8 @@ const MessageToolbar = ({
  }))}
  onChangeMenuVisibility={onChangeMenuVisibility}
  data-qa-type='message-action-menu-options'
+ context={{ message, room, user, subscription, settings: mapSettings, chat, context }}
+ isMessageEncrypted={isE2EEMessage(message)}
  />
  )}
  </FuselageMessageToolbar>

diff --git a/apps/meteor/package.json b/apps/meteor/package.json
@@ -242,7 +242,7 @@
  "@rocket.chat/favicon": "workspace:^",
  "@rocket.chat/forked-matrix-appservice-bridge": "^4.0.2",
  "@rocket.chat/forked-matrix-bot-sdk": "^0.6.0-beta.3",
- "@rocket.chat/fuselage": "^0.54.2",
+ "@rocket.chat/fuselage": "^0.54.3",
  "@rocket.chat/fuselage-hooks": "^0.33.1",
  "@rocket.chat/fuselage-polyfills": "~0.31.25",
  "@rocket.chat/fuselage-toastbar": "^0.31.26",

@@ -213,6 +213,31 @@ test.describe.serial('e2e-encryption', () => {
  await expect(poHomeChannel.content.mainThreadMessageText.locator('.rcx-icon--name-key')).toBeVisible();
  });
 
+ test('expect create a private encrypted channel and check disabled message menu actions on an encrypted message', async ({ page }) => {
+ const channelName = faker.string.uuid();
+
+ await poHomeChannel.sidenav.createEncryptedChannel(channelName);
+
+ await expect(page).toHaveURL(`/group/${channelName}`);
+
+ await poHomeChannel.dismissToast();
+
+ await expect(poHomeChannel.content.encryptedRoomHeaderIcon).toBeVisible();
+
+ await poHomeChannel.content.sendMessage('This is an encrypted message.');
+
+ await expect(poHomeChannel.content.lastUserMessageBody).toHaveText('This is an encrypted message.');
+ await expect(poHomeChannel.content.lastUserMessage.locator('.rcx-icon--name-key')).toBeVisible();
+
+ await page.locator('[data-qa-type="message"]').last().hover();
+ await expect(page.locator('role=button[name="Forward message"]')).toBeDisabled();
+
+ await poHomeChannel.content.openLastMessageMenu();
+
+ await expect(page.locator('role=menuitem[name="Reply in direct message"]')).toHaveClass(/disabled/);
+ await expect(page.locator('role=menuitem[name="Copy link"]')).toHaveClass(/disabled/);
+ });
+
  test('expect create a private channel, encrypt it and send an encrypted message', async ({ page }) => {
  const channelName = faker.string.uuid();
 

diff --git a/ee/packages/ui-theming/package.json b/ee/packages/ui-theming/package.json
@@ -4,7 +4,7 @@
  "private": true,
  "devDependencies": {
  "@rocket.chat/css-in-js": "~0.31.25",
- "@rocket.chat/fuselage": "^0.54.2",
+ "@rocket.chat/fuselage": "^0.54.3",
  "@rocket.chat/fuselage-hooks": "^0.33.1",
  "@rocket.chat/icons": "^0.36.0",
  "@rocket.chat/ui-contexts": "workspace:~",

diff --git a/packages/fuselage-ui-kit/package.json b/packages/fuselage-ui-kit/package.json
@@ -66,7 +66,7 @@
  "@rocket.chat/apps-engine": "alpha",
  "@rocket.chat/core-typings": "workspace:^",
  "@rocket.chat/eslint-config": "workspace:^",
- "@rocket.chat/fuselage": "^0.54.2",
+ "@rocket.chat/fuselage": "^0.54.3",
  "@rocket.chat/fuselage-hooks": "^0.33.1",
  "@rocket.chat/fuselage-polyfills": "~0.31.25",
  "@rocket.chat/icons": "^0.36.0",

diff --git a/packages/gazzodown/package.json b/packages/gazzodown/package.json
@@ -6,7 +6,7 @@
  "@babel/core": "~7.22.20",
  "@rocket.chat/core-typings": "workspace:^",
  "@rocket.chat/css-in-js": "~0.31.25",
- "@rocket.chat/fuselage": "^0.54.2",
+ "@rocket.chat/fuselage": "^0.54.3",
  "@rocket.chat/fuselage-tokens": "^0.33.1",
  "@rocket.chat/message-parser": "workspace:^",
  "@rocket.chat/styled": "~0.31.25",

diff --git a/packages/i18n/src/locales/en.i18n.json b/packages/i18n/src/locales/en.i18n.json
@@ -304,6 +304,7 @@
  "Action_required": "Action required",
  "Action_Available_After_Custom_Content_Added": "This action will become available after the custom content has been added",
  "Action_Available_After_Custom_Content_Added_And_Visible": "This action will become available after the custom content has been added and made visible to everyone",
+ "Action_not_available_encrypted_content": "{{action}} not available on encrypted content",
  "Activate": "Activate",
  "Active": "Active",
  "Active_users": "Active users",

diff --git a/packages/ui-avatar/package.json b/packages/ui-avatar/package.json
@@ -4,7 +4,7 @@
  "private": true,
  "devDependencies": {
  "@babel/core": "~7.22.20",
- "@rocket.chat/fuselage": "^0.54.2",
+ "@rocket.chat/fuselage": "^0.54.3",
  "@rocket.chat/ui-contexts": "workspace:^",
  "@types/babel__core": "~7.20.3",
  "@types/react": "~17.0.69",

diff --git a/packages/ui-client/package.json b/packages/ui-client/package.json
@@ -6,7 +6,7 @@
  "@babel/core": "~7.22.20",
  "@react-aria/toolbar": "^3.0.0-beta.1",
  "@rocket.chat/css-in-js": "~0.31.25",
- "@rocket.chat/fuselage": "^0.54.2",
+ "@rocket.chat/fuselage": "^0.54.3",
  "@rocket.chat/fuselage-hooks": "^0.33.1",
  "@rocket.chat/icons": "^0.36.0",
  "@rocket.chat/mock-providers": "workspace:^",

diff --git a/packages/ui-composer/package.json b/packages/ui-composer/package.json
@@ -6,7 +6,7 @@
  "@babel/core": "~7.22.20",
  "@react-aria/toolbar": "^3.0.0-beta.1",
  "@rocket.chat/eslint-config": "workspace:^",
- "@rocket.chat/fuselage": "^0.54.2",
+ "@rocket.chat/fuselage": "^0.54.3",
  "@rocket.chat/icons": "^0.36.0",
  "@storybook/addon-actions": "~6.5.16",
  "@storybook/addon-docs": "~6.5.16",

diff --git a/packages/ui-video-conf/package.json b/packages/ui-video-conf/package.json
@@ -6,7 +6,7 @@
  "@babel/core": "~7.22.20",
  "@rocket.chat/css-in-js": "~0.31.25",
  "@rocket.chat/eslint-config": "workspace:^",
- "@rocket.chat/fuselage": "^0.54.2",
+ "@rocket.chat/fuselage": "^0.54.3",
  "@rocket.chat/fuselage-hooks": "^0.33.1",
  "@rocket.chat/icons": "^0.36.0",
  "@rocket.chat/styled": "~0.31.25",

diff --git a/packages/uikit-playground/package.json b/packages/uikit-playground/package.json
@@ -15,7 +15,7 @@
  "@codemirror/tooltip": "^0.19.16",
  "@lezer/highlight": "^1.1.6",
  "@rocket.chat/css-in-js": "~0.31.25",
- "@rocket.chat/fuselage": "^0.54.2",
+ "@rocket.chat/fuselage": "^0.54.3",
  "@rocket.chat/fuselage-hooks": "^0.33.1",
  "@rocket.chat/fuselage-polyfills": "~0.31.25",
  "@rocket.chat/fuselage-toastbar": "^0.31.26",