Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into refa…

…ctor/message-search

.gitignore

@@ -44,4 +44,4 @@ yarn-error.log*
 .nvmrc
 .idea/
 .exrc
-.envrc
+.envrc

apps/meteor/app/apps/server/bridges/listeners.js

@@ -80,12 +80,12 @@ export class AppListenerBridge {
 						user: this.orch.getConverters().get('users').convertToApp(userDeleted),
 					};
 				case AppInterface.IPostMessageReacted:
-					const [userReacted, reaction, isRemoved] = payload;
+					const [userReacted, reaction, isReacted] = payload;
 					return {
 						message: msg,
 						user: this.orch.getConverters().get('users').convertToApp(userReacted),
 						reaction,
-						isRemoved,
+						isReacted,
 					};
 				case AppInterface.IPostMessageFollowed:
 					const [userFollowed, isUnfollow] = payload;

apps/meteor/client/sidebar/header/UserDropdown.tsx

@@ -13,7 +13,7 @@ import {
 } from '@rocket.chat/fuselage';
 import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
 import type { TranslationKey } from '@rocket.chat/ui-contexts';
-import { useLayout, useRoute, useLogout, useSetting, useTranslation, useSetModal } from '@rocket.chat/ui-contexts';
+import { useLayout, useRole, useRoute, useLogout, useSetting, useTranslation, useSetModal } from '@rocket.chat/ui-contexts';
 import { useThemeMode } from '@rocket.chat/ui-theming/src/hooks/useThemeMode';
 import type { ReactElement } from 'react';
 import React from 'react';
@@ -58,6 +58,7 @@ const UserDropdown = ({ user, onClose }: UserDropdownProps): ReactElement => {
 	const logout = useLogout();
 	const { isMobile } = useLayout();
 	const presenceDisabled = useSetting<boolean>('Presence_broadcast_disabled');
+	const isAdmin = useRole('admin');
 
 	const setModal = useSetModal();
 	const closeModal = useMutableCallback(() => setModal());
@@ -130,17 +131,28 @@ const UserDropdown = ({ user, onClose }: UserDropdownProps): ReactElement => {
 						color='status-font-on-info'
 						onClick={() =>
 							setModal(
-								<GenericModal
-									title={t('User_status_disabled_learn_more')}
-									cancelText={t('Close')}
-									confirmText={t('Go_to_workspace_settings')}
-									children={t('User_status_disabled_learn_more_description')}
-									onConfirm={handleGoToSettings}
-									onClose={closeModal}
-									onCancel={closeModal}
-									icon={null}
-									variant='warning'
-								/>,
+								isAdmin ? (
+									<GenericModal
+										title={t('User_status_disabled_learn_more')}
+										cancelText={t('Close')}
+										confirmText={t('Go_to_workspace_settings')}
+										children={t('User_status_disabled_learn_more_description')}
+										onConfirm={handleGoToSettings}
+										onClose={closeModal}
+										onCancel={closeModal}
+										icon={null}
+										variant='warning'
+									/>
+								) : (
+									<GenericModal
+										title={t('User_status_disabled_learn_more')}
+										confirmText={t('Close')}
+										children={t('User_status_disabled_learn_more_description')}
+										onConfirm={closeModal}
+										onClose={closeModal}
+										icon={null}
+									/>
+								),
 							)
 						}
 					>

apps/meteor/client/sidebar/sections/StatusDisabledSection.tsx

@@ -1,6 +1,6 @@
 import { SidebarBanner } from '@rocket.chat/fuselage';
 import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
-import { useRoute, useSetModal, useTranslation } from '@rocket.chat/ui-contexts';
+import { useRole, useRoute, useSetModal, useTranslation } from '@rocket.chat/ui-contexts';
 import React from 'react';
 
 import GenericModal from '../../components/GenericModal';
@@ -14,6 +14,7 @@ const StatusDisabledSection = ({ onDismiss }: { onDismiss: () => void }) => {
 		userStatusRoute.push({});
 		closeModal();
 	});
+	const isAdmin = useRole('admin');
 
 	return (
 		<SidebarBanner
@@ -22,17 +23,28 @@ const StatusDisabledSection = ({ onDismiss }: { onDismiss: () => void }) => {
 			onClose={onDismiss}
 			onClick={() =>
 				setModal(
-					<GenericModal
-						title={t('User_status_disabled_learn_more')}
-						cancelText={t('Close')}
-						confirmText={t('Go_to_workspace_settings')}
-						children={t('User_status_disabled_learn_more_description')}
-						onConfirm={handleGoToSettings}
-						onClose={closeModal}
-						onCancel={closeModal}
-						icon={null}
-						variant='warning'
-					/>,
+					isAdmin ? (
+						<GenericModal
+							title={t('User_status_disabled_learn_more')}
+							cancelText={t('Close')}
+							confirmText={t('Go_to_workspace_settings')}
+							children={t('User_status_disabled_learn_more_description')}
+							onConfirm={handleGoToSettings}
+							onClose={closeModal}
+							onCancel={closeModal}
+							icon={null}
+							variant='warning'
+						/>
+					) : (
+						<GenericModal
+							title={t('User_status_disabled_learn_more')}
+							confirmText={t('Close')}
+							children={t('User_status_disabled_learn_more_description')}
+							onConfirm={closeModal}
+							onClose={closeModal}
+							icon={null}
+						/>
+					),
 				)
 			}
 		/>

apps/meteor/client/views/admin/customUserStatus/CustomUserStatusService.tsx

@@ -17,6 +17,7 @@ import { useMutation } from '@tanstack/react-query';
 import React from 'react';
 
 import VerticalBar from '../../../components/VerticalBar';
+import { useIsEnterprise } from '../../../hooks/useIsEnterprise';
 import { useActiveConnections } from './hooks/useActiveConnections';
 
 const CustomUserStatusService = () => {
@@ -25,6 +26,7 @@ const CustomUserStatusService = () => {
 	const presenceDisabled = useSetting<boolean>('Presence_broadcast_disabled');
 	const togglePresenceServiceEndpoint = useEndpoint('POST', '/v1/presence.enableBroadcast');
 	const disablePresenceService = useMutation(() => togglePresenceServiceEndpoint());
+	const isEnterprise = useIsEnterprise();
 
 	if (result.isLoading || disablePresenceService.isLoading) {
 		return <Skeleton />;
@@ -61,11 +63,9 @@ const CustomUserStatusService = () => {
 					</Box>
 					<Box display='flex' fontScale='c1' justifyContent='space-between' mb='x16'>
 						<Box>{t('Active_connections')}</Box>
-						<Box>
-							{current}/{max}
-						</Box>
+						<Box>{isEnterprise ? current : `${current}/${max}`}</Box>
 					</Box>
-					<ProgressBar percentage={percentage} variant='success' />
+					{!isEnterprise && <ProgressBar percentage={percentage} variant={percentage > 80 ? 'danger' : 'success'} />}
 					{presenceDisabled && (
 						<Margins block='x16'>
 							<Callout type='danger' title={t('Service_disabled')}>
@@ -75,21 +75,39 @@ const CustomUserStatusService = () => {
 					)}
 				</div>
 				<Box display='flex' flexDirection='column' mb='x16'>
-					<Box fontScale='p2' mb='x8'>
-						{t('Community_cap_description')}
-					</Box>
-					<Box fontScale='p2' mb='x8'>
-						{t('Enterprise_cap_description')}
-					</Box>
+					{isEnterprise ? (
+						<>
+							<Box fontScale='p2' mb='x8'>
+								{t('Enterprise_cap_description')}
+							</Box>
+							<Box fontScale='p2' mb='x8'>
+								{t('Larger_amounts_of_active_connections')}{' '}
+								<Box is='a' href='https://go.rocket.chat/i/presence-cap-learn-more' target='_blank' color='status-font-on-info'>
+									{t('multiple_instance_solutions')}
+								</Box>
+							</Box>
+						</>
+					) : (
+						<>
+							<Box fontScale='p2' mb='x8'>
+								{t('Community_cap_description')}
+							</Box>
+							<Box fontScale='p2' mb='x8'>
+								{t('Enterprise_cap_description')}
+							</Box>
+						</>
+					)}
 				</Box>
 			</VerticalBar.Content>
-			<VerticalBar.Footer borderBlockStartWidth='default' borderBlockColor='extra-light'>
-				<ButtonGroup stretch vertical>
-					<Button primary width='100%'>
-						{t('More_about_Enterprise_Edition')}
-					</Button>
-				</ButtonGroup>
-			</VerticalBar.Footer>
+			{!isEnterprise && (
+				<VerticalBar.Footer borderBlockStartWidth='default' borderBlockColor='extra-light'>
+					<ButtonGroup stretch vertical>
+						<Button primary width='100%' is='a' href='https://go.rocket.chat/i/presence-cap-learn-more' target='_blank'>
+							{t('More_about_Enterprise_Edition')}
+						</Button>
+					</ButtonGroup>
+				</VerticalBar.Footer>
+			)}
 		</>
 	);
 };

apps/meteor/client/views/room/components/body/composer/ComposerContainer.tsx

@@ -55,11 +55,7 @@ const ComposerContainer = ({ children, ...props }: ComposerMessageProps): ReactE
 	}
 
 	if (isReadOnly) {
-		return (
-			<footer className='rc-message-box footer'>
-				<ComposerReadOnly />
-			</footer>
-		);
+		return <ComposerReadOnly />;
 	}
 
 	if (isBlockedOrBlocker) {

apps/meteor/client/views/room/components/body/composer/ComposerReadOnly.tsx

@@ -1,9 +1,35 @@
-import { MessageFooterCallout } from '@rocket.chat/ui-composer';
-import { useTranslation } from '@rocket.chat/ui-contexts';
+import { Button } from '@rocket.chat/fuselage';
+import { MessageFooterCallout, MessageFooterCalloutContent } from '@rocket.chat/ui-composer';
+import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts';
+import { useMutation } from '@tanstack/react-query';
 import type { ReactElement } from 'react';
 import React from 'react';
 
+import { dispatchToastMessage } from '../../../../../lib/toast';
+import { useRoom, useUserIsSubscribed } from '../../../contexts/RoomContext';
+
 export const ComposerReadOnly = (): ReactElement => {
 	const t = useTranslation();
-	return <MessageFooterCallout>{t('room_is_read_only')}</MessageFooterCallout>;
+	const room = useRoom();
+	const isSubscribed = useUserIsSubscribed();
+	const joinChannel = useEndpoint('POST', '/v1/channels.join');
+
+	const join = useMutation(() => joinChannel({ roomId: room._id }), {
+		onError: (error: unknown) => {
+			dispatchToastMessage({ type: 'error', message: error });
+		},
+	});
+
+	return (
+		<footer className='rc-message-box footer'>
+			<MessageFooterCallout>
+				<MessageFooterCalloutContent>{t('room_is_read_only')}</MessageFooterCalloutContent>
+				{!isSubscribed && (
+					<Button primary onClick={() => join.mutate()} disabled={join.isLoading}>
+						{t('Join')}
+					</Button>
+				)}
+			</MessageFooterCallout>
+		</footer>
+	);
 };

apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json

@@ -5565,5 +5565,7 @@
   "RegisterWorkspace_Syncing_Complete": "Sync Complete",
   "RegisterWorkspace_Connection_Error": "An error occured connecting",
   "cloud.RegisterWorkspace_Token_Step_One": "1. Go to: <1>cloud.rocket.chat > Workspaces</1> and click <3>'Register self-managed'</3>.",
-  "cloud.RegisterWorkspace_Setup_Terms_Privacy": "I agree with <1>Terms and Conditions</1> and <3>Privacy Policy</3>"
+  "cloud.RegisterWorkspace_Setup_Terms_Privacy": "I agree with <1>Terms and Conditions</1> and <3>Privacy Policy</3>",
+  "Larger_amounts_of_active_connections": "For larger amounts of active connections you can consider our",
+  "multiple_instance_solutions": "multiple instance solutions"
 }

apps/meteor/tests/e2e/channel-management.spec.ts

@@ -1,3 +1,6 @@
+import type { Page } from '@playwright/test';
+import faker from '@faker-js/faker';
+
 import { test, expect } from './utils/test';
 import { HomeChannel } from './page-objects';
 import { createTargetChannel } from './utils';
@@ -7,9 +10,13 @@ test.use({ storageState: 'admin-session.json' });
 test.describe.serial('channel-management', () => {
 	let poHomeChannel: HomeChannel;
 	let targetChannel: string;
+	let regularUserPage: Page;
 
-	test.beforeAll(async ({ api }) => {
+	test.beforeAll(async ({ api, browser }) => {
 		targetChannel = await createTargetChannel(api);
+		regularUserPage = await browser.newPage({ storageState: 'user2-session.json' });
+		await regularUserPage.goto('/home');
+		await regularUserPage.waitForSelector('[data-qa-id="home-header"]');
 	});
 
 	test.beforeEach(async ({ page }) => {
@@ -101,6 +108,19 @@ test.describe.serial('channel-management', () => {
 		await expect(poHomeChannel.toastSuccess).toBeVisible();
 	});
 
+	test('expect "readOnlyChannel" to show join button', async () => {
+		const channelName = faker.datatype.uuid();
+
+		await poHomeChannel.sidenav.openNewByLabel('Channel');
+		await poHomeChannel.sidenav.inputChannelName.type(channelName);
+		await poHomeChannel.sidenav.checkboxPrivateChannel.click();
+		await poHomeChannel.sidenav.checkboxReadOnly.click();
+		await poHomeChannel.sidenav.btnCreate.click();
+
+		await regularUserPage.goto(`/channel/${channelName}`);
+		await expect(regularUserPage.locator('button', { hasText: 'Join' })).toBeVisible();
+	});
+
 	test.skip('expect all notification preferences of "targetChannel" to be "Mentions"', async () => {
 		await poHomeChannel.sidenav.openChat(targetChannel);
 		await poHomeChannel.tabs.kebab.click({ force: true });

apps/meteor/tests/e2e/page-objects/fragments/home-sidenav.ts

@@ -17,6 +17,12 @@ export class HomeSidenav {
 		return this.page.locator('role=dialog[name="Create Channel"] >> role=checkbox[name="Encrypted"]');
 	}
 
+	get checkboxReadOnly(): Locator {
+		return this.page.locator(
+			'//*[@id="modal-root"]//*[contains(@class, "rcx-field") and contains(text(), "Read Only")]/../following-sibling::label/i',
+		);
+	}
+
 	get inputChannelName(): Locator {
 		return this.page.locator('#modal-root [data-qa="create-channel-modal"] [data-qa-type="channel-name-input"]');
 	}

packages/ui-composer/src/MessageFooterCallout/MessageFooterCalloutContent.tsx

@@ -7,6 +7,10 @@ const MessageFooterCalloutContent = forwardRef<
 	{
 		children: ReactNode;
 	}
->((props, ref): ReactElement => <Box mi='x4' ref={ref} flexWrap='wrap' flexShrink={1} {...props} />);
+>(
+	(props, ref): ReactElement => (
+		<Box mi='x4' ref={ref} flexWrap='wrap' textAlign='center' color='default' flexGrow={1} flexShrink={1} {...props} />
+	),
+);
 
 export default MessageFooterCalloutContent;