Merge remote-tracking branch 'origin/develop' into feat/apps-deno-run…

…time

.changeset/chilly-poems-explode.md

@@ -0,0 +1,7 @@
+---
+"@rocket.chat/meteor": minor
+"@rocket.chat/core-typings": minor
+"@rocket.chat/i18n": patch
+---
+
+Introduced a tab layout to the users page and implemented a tab called "All" that lists all users.

.changeset/tall-wombats-love.md

@@ -0,0 +1,5 @@
+---
+'@rocket.chat/meteor': patch
+---
+
+Replaces the burger menu with an appropriate button fixing the semantics and mismatching color

.changeset/warm-squids-deliver.md

@@ -0,0 +1,5 @@
+---
+'@rocket.chat/meteor': minor
+---
+
+Changes the scrollbar color in order to improve the contrast and accessibility compliance

.changeset/wild-teachers-design.md

@@ -0,0 +1,7 @@
+---
+"@rocket.chat/meteor": minor
+"@rocket.chat/core-typings": minor
+"@rocket.chat/i18n": minor
+---
+
+Added "Rocket.Chat Cloud Workspace ID" to workspace statistics page

.changeset/young-yaks-suffer.md

@@ -0,0 +1,5 @@
+---
+'@rocket.chat/meteor': patch
+---
+
+bump fuselage adding `AttachmentAuthorName` missing color token

apps/meteor/app/api/server/lib/getServerInfo.ts

@@ -5,17 +5,18 @@ import {
 	getCachedSupportedVersionsToken,
 	wrapPromise,
 } from '../../../cloud/server/functions/supportedVersionsToken/supportedVersionsToken';
+import { settings } from '../../../settings/server';
 import { Info, minimumClientVersions } from '../../../utils/rocketchat.info';
 
 const removePatchInfo = (version: string): string => version.replace(/(\d+\.\d+).*/, '$1');
 
 export async function getServerInfo(userId?: string): Promise<IWorkspaceInfo> {
 	const hasPermissionToViewStatistics = userId && (await hasPermissionAsync(userId, 'view-statistics'));
 	const supportedVersionsToken = await wrapPromise(getCachedSupportedVersionsToken());
+	const cloudWorkspaceId = settings.get<string | undefined>('Cloud_Workspace_Id');
 
 	return {
 		version: removePatchInfo(Info.version),
-
 		...(hasPermissionToViewStatistics && {
 			info: {
 				...Info,
@@ -28,5 +29,7 @@ export async function getServerInfo(userId?: string): Promise<IWorkspaceInfo> {
 			supportedVersionsToken.result && {
 				supportedVersions: { signed: supportedVersionsToken.result },
 			}),
+
+		cloudWorkspaceId,
 	};
 }

apps/meteor/client/components/CustomScrollbars/CustomScrollbars.tsx

@@ -1,3 +1,4 @@
+import { Palette } from '@rocket.chat/fuselage';
 import type { ScrollValues } from 'rc-scrollbars';
 import { Scrollbars } from 'rc-scrollbars';
 import type { MutableRefObject, CSSProperties, ReactNode, ReactElement } from 'react';
@@ -43,7 +44,7 @@ const CustomScrollbars = forwardRef<HTMLElement, CustomScrollbarsProps>(function
 				overflowX ? undefined : (props): ReactElement => <div {...props} className='track-horizontal' style={{ display: 'none' }} />
 			}
 			renderThumbVertical={({ style, ...props }): JSX.Element => (
-				<div {...props} style={{ ...style, backgroundColor: 'rgba(0, 0, 0, 0.5)', borderRadius: '7px' }} />
+				<div {...props} style={{ ...style, backgroundColor: Palette.stroke['stroke-dark'].toString(), borderRadius: '4px' }} />
 			)}
 			children={children}
 			ref={refSetter}

apps/meteor/client/components/Page/PageHeader.tsx

@@ -4,7 +4,7 @@ import { useLayout, useTranslation } from '@rocket.chat/ui-contexts';
 import type { FC, ComponentProps, ReactNode } from 'react';
 import React, { useContext } from 'react';
 
-import BurgerMenu from '../BurgerMenu';
+import SidebarToggler from '../SidebarToggler';
 import PageContext from './PageContext';
 
 type PageHeaderProps = {
@@ -32,7 +32,7 @@ const PageHeader: FC<PageHeaderProps> = ({ children = undefined, title, onClickB
 			<Box height='100%' marginInline={24} display='flex' flexDirection='row' flexWrap='wrap' alignItems='center' color='default'>
 				{isMobile && (
 					<HeaderToolbar>
-						<BurgerMenu />
+						<SidebarToggler />
 					</HeaderToolbar>
 				)}
 				{onClickBack && <IconButton small mie={8} icon='arrow-back' onClick={onClickBack} title={t('Back')} />}

apps/meteor/client/components/SidebarToggler/SidebarToggler.tsx

@@ -0,0 +1,19 @@
+import { useEffectEvent } from '@rocket.chat/fuselage-hooks';
+import { useLayout, useSession } from '@rocket.chat/ui-contexts';
+import type { ReactElement } from 'react';
+import React, { memo } from 'react';
+
+import { useEmbeddedLayout } from '../../hooks/useEmbeddedLayout';
+import SidebarTogglerButton from './SidebarTogglerButton';
+
+const SideBarToggler = (): ReactElement => {
+	const { sidebar } = useLayout();
+	const isLayoutEmbedded = useEmbeddedLayout();
+	const unreadMessagesBadge = useSession('unread');
+
+	const toggleSidebar = useEffectEvent(() => sidebar.toggle());
+
+	return <SidebarTogglerButton onClick={toggleSidebar} badge={!isLayoutEmbedded && unreadMessagesBadge && unreadMessagesBadge} />;
+};
+
+export default memo(SideBarToggler);

apps/meteor/client/components/BurgerMenu/BurgerBadge.tsx → apps/meteor/client/components/SidebarToggler/SidebarTogglerBadge.tsx

@@ -1,19 +1,18 @@
 import { css } from '@rocket.chat/css-in-js';
 import { Box, Badge } from '@rocket.chat/fuselage';
-import type { ReactElement } from 'react';
 import React from 'react';
 
-const BurgerBadge = ({ children }: { children?: unknown }): ReactElement => (
+const SidebarTogglerBadge = ({ children }: { children?: unknown }) => (
 	<Box
 		className={css`
 			position: absolute;
-			zindex: 3;
+			z-index: 3;
 			top: -5px;
-			right: -5px;
+			right: 3px;
 		`}
 	>
 		<Badge variant='danger' children={children} />
 	</Box>
 );
 
-export default BurgerBadge;
+export default SidebarTogglerBadge;