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

apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.spec.tsx

@@ -0,0 +1,24 @@
+import { composeStories } from '@storybook/react';
+import { render } from '@testing-library/react';
+import { axe } from 'jest-axe';
+
+import * as stories from './RetentionPolicyCallout.stories';
+
+const testCases = Object.values(composeStories(stories)).map((Story) => [Story.storyName || 'Story', Story]);
+
+test.each(testCases)(`renders %s without crashing`, async (_storyname, Story) => {
+	jest.useFakeTimers();
+	jest.setSystemTime(new Date(2024, 5, 1, 0, 0, 0));
+
+	const { baseElement } = render(<Story />);
+	expect(baseElement).toMatchSnapshot();
+});
+
+test.each(testCases)('%s should have no a11y violations', async (_storyname, Story) => {
+	// We have to use real timers here because `jest-axe` is breaking otherwise
+	jest.useRealTimers();
+	const { container } = render(<Story />);
+
+	const results = await axe(container);
+	expect(results).toHaveNoViolations();
+});

apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.stories.tsx

@@ -0,0 +1,32 @@
+import type { Meta, StoryFn } from '@storybook/react';
+
+import RetentionPolicyCallout from './RetentionPolicyCallout';
+import { createRenteionPolicySettingsMock as createMock } from '../../../tests/mocks/client/mockRetentionPolicySettings';
+import { createFakeRoom } from '../../../tests/mocks/data';
+
+export default {
+	component: RetentionPolicyCallout,
+} satisfies Meta<typeof RetentionPolicyCallout>;
+
+const fakeRoom = createFakeRoom();
+
+const DefaultWrapper = createMock({ appliesToChannels: true, TTLChannels: 60000 });
+
+export const Default: StoryFn<typeof RetentionPolicyCallout> = () => (
+	<DefaultWrapper>
+		<RetentionPolicyCallout room={fakeRoom} />
+	</DefaultWrapper>
+);
+
+const InvalidSettingsWrapper = createMock({
+	appliesToChannels: true,
+	TTLChannels: 60000,
+	advancedPrecisionCron: '* * * 12 * *',
+	advancedPrecision: true,
+});
+
+export const InvalidSettings: StoryFn<typeof RetentionPolicyCallout> = () => (
+	<InvalidSettingsWrapper>
+		<RetentionPolicyCallout room={fakeRoom} />
+	</InvalidSettingsWrapper>
+);

apps/meteor/client/components/InfoPanel/RetentionPolicyCallout.tsx

@@ -0,0 +1,23 @@
+import type { IRoom } from '@rocket.chat/core-typings';
+import { Callout } from '@rocket.chat/fuselage';
+import { useTranslation } from 'react-i18next';
+
+import { usePruneWarningMessage } from '../../hooks/usePruneWarningMessage';
+import { withErrorBoundary } from '../withErrorBoundary';
+
+export type RetentionPolicyCalloutProps = { room: IRoom };
+
+const RetentionPolicyCallout = ({ room }: RetentionPolicyCalloutProps) => {
+	const message = usePruneWarningMessage(room);
+	const { t } = useTranslation();
+
+	return (
+		<Callout arial-label={t('Retention_policy_warning_callout')} role='alert' aria-live='polite' type='warning'>
+			<div>
+				<p>{message}</p>
+			</div>
+		</Callout>
+	);
+};
+
+export default withErrorBoundary(RetentionPolicyCallout);

apps/meteor/client/components/InfoPanel/__snapshots__/RetentionPolicyCallout.spec.tsx.snap

@@ -0,0 +1,75 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`renders Default without crashing 1`] = `
+<body>
+  <div>
+    <section
+      aria-live="polite"
+      arial-label="Retention_policy_warning_callout"
+      class="rcx-box rcx-box--full rcx-callout rcx-callout--warning"
+      role="alert"
+    >
+      <i
+        aria-hidden="true"
+        class="rcx-box rcx-box--full rcx-icon--name-warning rcx-icon rcx-callout__icon rcx-css-4pvxx3"
+      >
+        
+      </i>
+      <div
+        class="rcx-box rcx-box--full rcx-callout__wrapper"
+      >
+        <div
+          class="rcx-box rcx-box--full rcx-callout__wrapper-content"
+        >
+          <div
+            class="rcx-box rcx-box--full rcx-callout__content"
+          >
+            <div>
+              <p>
+                1 minute June 1, 2024 at 12:30 AM
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</body>
+`;
+
+exports[`renders InvalidSettings without crashing 1`] = `
+<body>
+  <div>
+    <section
+      aria-live="polite"
+      arial-label="Retention_policy_warning_callout"
+      class="rcx-box rcx-box--full rcx-callout rcx-callout--warning"
+      role="alert"
+    >
+      <i
+        aria-hidden="true"
+        class="rcx-box rcx-box--full rcx-icon--name-warning rcx-icon rcx-callout__icon rcx-css-4pvxx3"
+      >
+        
+      </i>
+      <div
+        class="rcx-box rcx-box--full rcx-callout__wrapper"
+      >
+        <div
+          class="rcx-box rcx-box--full rcx-callout__wrapper-content"
+        >
+          <div
+            class="rcx-box rcx-box--full rcx-callout__content"
+          >
+            <div>
+              <p>
+                1 minute June 12, 2024 at 12:00 AM
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</body>
+`;