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

2026-09-16 01:21:02 +05:00
commit 30810eecd7
10161 changed files with 987110 additions and 0 deletions
--- a/packages/ui-client/src/components/AnnouncementBanner/AnnouncementBanner.spec.tsx
+++ b/packages/ui-client/src/components/AnnouncementBanner/AnnouncementBanner.spec.tsx
@@ -0,0 +1,23 @@
+import { composeStories } from '@storybook/react';
+import { render } from '@testing-library/react';
+import { axe } from 'jest-axe';
+
+import * as stories from './AnnouncementBanner.stories';
+
+const testCases = Object.values(composeStories(stories)).map((Story) => [Story.storyName || 'Story', Story]);
+
+test.each(testCases)(`renders %s without crashing`, async (_storyname, Story) => {
+	const { baseElement } = render(<Story />);
+	expect(baseElement).toMatchSnapshot();
+});
+
+test.each(testCases)('%s should have no a11y violations', async (_storyname, Story) => {
+	const { container } = render(<Story />);
+
+	/**
+	 ** We are disabling the rule in this case because ideally we should not have nested interactive
+	 ** but in this case we need to open a modal when clicking in the `AnnouncementBanner`
+	 **/
+	const results = await axe(container, { rules: { 'nested-interactive': { enabled: false } } });
+	expect(results).toHaveNoViolations();
+});
--- a/packages/ui-client/src/components/AnnouncementBanner/AnnouncementBanner.stories.tsx
+++ b/packages/ui-client/src/components/AnnouncementBanner/AnnouncementBanner.stories.tsx
@@ -0,0 +1,27 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { action } from 'storybook/actions';
+
+import AnnouncementBanner from './AnnouncementBanner';
+
+export default {
+	component: AnnouncementBanner,
+	args: {
+		onClick: action('clicked'),
+	},
+} satisfies Meta<typeof AnnouncementBanner>;
+
+export const Default: StoryObj<typeof AnnouncementBanner> = {
+	args: {
+		children: 'Announcement',
+	},
+};
+
+export const WithLink: StoryObj<typeof AnnouncementBanner> = {
+	args: {
+		children: (
+			<a target='_blank' href='https://rocket.chat' rel='noreferrer'>
+				Announcement
+			</a>
+		),
+	},
+};
--- a/packages/ui-client/src/components/AnnouncementBanner/AnnouncementBanner.tsx
+++ b/packages/ui-client/src/components/AnnouncementBanner/AnnouncementBanner.tsx
@@ -0,0 +1,51 @@
+import { css } from '@rocket.chat/css-in-js';
+import { Box, Palette } from '@rocket.chat/fuselage';
+import type { AllHTMLAttributes, ReactNode, MouseEvent } from 'react';
+
+export type AnnouncementBannerProps = {
+	children: ReactNode;
+	onClick?: (e: MouseEvent) => void;
+} & Omit<AllHTMLAttributes<HTMLButtonElement>, 'is'>;
+
+const AnnouncementBanner = ({ children, className, onClick, ...props }: AnnouncementBannerProps) => {
+	const announcementBar = css`
+		background-color: ${Palette.status['status-background-info'].theme('announcement-background')};
+		color: ${Palette.text['font-pure-black'].theme('announcement-text')};
+		cursor: pointer;
+		transition: transform 0.2s ease-out;
+		a:link {
+			color: ${Palette.text['font-pure-black'].theme('announcement-text')};
+			text-decoration: underline;
+		}
+		> * {
+			flex: auto;
+		}
+		&:hover {
+			text-decoration: underline;
+		}
+	`;
+
+	return (
+		<Box
+			focusable
+			height='x40'
+			paddingInline={24}
+			alignItems='center'
+			display='flex'
+			fontScale='p2m'
+			textAlign='center'
+			borderRadius={0}
+			className={[announcementBar, className]}
+			tabIndex={onClick ? 0 : -1}
+			role={onClick ? 'button' : 'banner'}
+			onClick={onClick}
+			{...props}
+		>
+			<Box withTruncatedText width='none'>
+				{children}
+			</Box>
+		</Box>
+	);
+};
+
+export default AnnouncementBanner;
--- a/packages/ui-client/src/components/AnnouncementBanner/snapshots/AnnouncementBanner.spec.tsx.snap
+++ b/packages/ui-client/src/components/AnnouncementBanner/snapshots/AnnouncementBanner.spec.tsx.snap
@@ -0,0 +1,43 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`renders Default without crashing 1`] = `
+<body>
+  <div>
+    <div
+      class="rcx-box rcx-box--full rcx-box--focusable rcx-css-1itjqx1 rcx-css-k3fjzq"
+      role="button"
+      tabindex="0"
+    >
+      <div
+        class="rcx-box rcx-box--full rcx-css-1n09zs3"
+      >
+        Announcement
+      </div>
+    </div>
+  </div>
+</body>
+`;
+
+exports[`renders WithLink without crashing 1`] = `
+<body>
+  <div>
+    <div
+      class="rcx-box rcx-box--full rcx-box--focusable rcx-css-1itjqx1 rcx-css-k3fjzq"
+      role="button"
+      tabindex="0"
+    >
+      <div
+        class="rcx-box rcx-box--full rcx-css-1n09zs3"
+      >
+        <a
+          href="https://rocket.chat"
+          rel="noreferrer"
+          target="_blank"
+        >
+          Announcement
+        </a>
+      </div>
+    </div>
+  </div>
+</body>
+`;
--- a/packages/ui-client/src/components/AnnouncementBanner/index.ts
+++ b/packages/ui-client/src/components/AnnouncementBanner/index.ts
@@ -0,0 +1 @@
+export { default } from './AnnouncementBanner';
				`@@ -0,0 +1 @@`
				`export { default } from './AnnouncementBanner';`