Skip to content

[pull] develop from RocketChat:develop #398

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
pull merged 2 commits into from
Mar 10, 2026
Merged

[pull] develop from RocketChat:develop #398

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0cb6a96
refactor: standardize ReturnChatQueueModal using GenericModal (#38384)
NAME-ASHWANIYADAV Mar 9, 2026
c987432
test: custom user status API tests with authentication and permission…
jessicaschelly Mar 9, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions apps/meteor/client/views/omnichannel/modals/ReturnChatQueueModal.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import { mockAppRoot } from '@rocket.chat/mock-providers';
import { composeStories } from '@storybook/react';
import { render } from '@testing-library/react';
import { axe } from 'jest-axe';

import * as stories from './ReturnChatQueueModal.stories';

const testCases = Object.values(composeStories(stories)).map((Story) => [Story.storyName || 'Story', Story]);

const appRoot = mockAppRoot().build();

test.each(testCases)(`renders %s without crashing`, async (_storyname, Story) => {
const { baseElement } = render(<Story />, { wrapper: appRoot });
expect(baseElement).toMatchSnapshot();
});

test.each(testCases)('%s should have no a11y violations', async (_storyname, Story) => {
const { container } = render(<Story />, { wrapper: appRoot });
const results = await axe(container);
expect(results).toHaveNoViolations();
});
17 changes: 17 additions & 0 deletions apps/meteor/client/views/omnichannel/modals/ReturnChatQueueModal.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
import type { Meta, StoryFn } from '@storybook/react';

import ReturnChatQueueModal from './ReturnChatQueueModal';

export default {
component: ReturnChatQueueModal,
parameters: {
layout: 'fullscreen',
actions: { argTypesRegex: '^on.*' },
},
args: {
onMoveChat: () => undefined,
onCancel: () => undefined,
},
} satisfies Meta<typeof ReturnChatQueueModal>;

export const Default: StoryFn<typeof ReturnChatQueueModal> = (args) => <ReturnChatQueueModal {...args} />;
41 changes: 12 additions & 29 deletions apps/meteor/client/views/omnichannel/modals/ReturnChatQueueModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,42 +1,25 @@
import {
Button,
Modal,
ModalClose,
ModalContent,
ModalFooter,
ModalFooterControllers,
ModalHeader,
ModalIcon,
ModalTitle,
} from '@rocket.chat/fuselage';
import { GenericModal } from '@rocket.chat/ui-client';
import { useTranslation } from 'react-i18next';

type ReturnChatQueueModalProps = {
onMoveChat: () => void;
onCancel: () => void;
};

// TODO: use `GenericModal` instead of creating a new modal from scratch
const ReturnChatQueueModal = ({ onCancel, onMoveChat, ...props }: ReturnChatQueueModalProps) => {
const ReturnChatQueueModal = ({ onCancel, onMoveChat }: ReturnChatQueueModalProps) => {
const { t } = useTranslation();

return (
<Modal aria-label={t('Return_to_the_queue')} {...props}>
<ModalHeader>
<ModalIcon name='burger-arrow-left' />
<ModalTitle>{t('Return_to_the_queue')}</ModalTitle>
<ModalClose onClick={onCancel} />
</ModalHeader>
<ModalContent fontScale='p2'>{t('Would_you_like_to_return_the_queue')}</ModalContent>
<ModalFooter>
<ModalFooterControllers>
<Button onClick={onCancel}>{t('Cancel')}</Button>
<Button primary onClick={onMoveChat}>
{t('Confirm')}
</Button>
</ModalFooterControllers>
</ModalFooter>
</Modal>
<GenericModal
variant='warning'
icon='burger-arrow-left'
title={t('Return_to_the_queue')}
onConfirm={onMoveChat}
onCancel={onCancel}
confirmText={t('Confirm')}
>
{t('Would_you_like_to_return_the_queue')}
</GenericModal>
);
};

Expand Down
98 changes: 98 additions & 0 deletions apps/meteor/client/views/omnichannel/modals/__snapshots__/ReturnChatQueueModal.spec.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing

exports[`renders Default without crashing 1`] = `
<body>
<div>
<dialog
aria-labelledby=":r0:-title"
aria-modal="true"
class="rcx-box rcx-box--full rcx-modal"
open=""
>
<div
class="rcx-box rcx-box--full rcx-modal__inner rcx-css-1euli2f"
>
<header
class="rcx-box rcx-box--full rcx-modal__header"
>
<div
class="rcx-box rcx-box--full rcx-modal__header-inner"
>
<div
class="rcx-box rcx-box--full rcx-css-trljwa rcx-css-1xb12qx"
>
<i
aria-hidden="true"
class="rcx-box rcx-box--full rcx-icon--name-burger-arrow-left rcx-icon rcx-css-zozvgz"
>
</i>
</div>
<div
class="rcx-box rcx-box--full rcx-modal__header-text rcx-css-trljwa rcx-css-lma364"
>
<h2
class="rcx-box rcx-box--full rcx-modal__title"
id=":r0:-title"
>
Return_to_the_queue
</h2>
</div>
<button
aria-label="Close"
class="rcx-box rcx-box--full rcx-button--small-square rcx-button--square rcx-button--icon rcx-button rcx-css-trljwa rcx-css-lma364"
tabindex="-1"
type="button"
>
<i
aria-hidden="true"
class="rcx-box rcx-box--full rcx-icon--name-cross rcx-icon rcx-css-4pvxx3"
>
</i>
</button>
</div>
</header>
<div
class="rcx-box rcx-box--full rcx-modal__content rcx-css-1vw7itl"
>
<div
class="rcx-box rcx-box--full rcx-modal__content-wrapper rcx-css-r1bpeb"
>
Would_you_like_to_return_the_queue
</div>
</div>
<div
class="rcx-box rcx-box--full rcx-modal__footer rcx-css-17mu816"
>
<div
class="rcx-button-group rcx-button-group--align-end"
role="group"
>
<button
class="rcx-box rcx-box--full rcx-button--secondary rcx-button"
type="button"
>
<span
class="rcx-button--content"
>
Cancel
</span>
</button>
<button
class="rcx-box rcx-box--full rcx-button--primary rcx-button"
type="button"
>
<span
class="rcx-button--content"
>
Confirm
</span>
</button>
</div>
</div>
</div>
</dialog>
</div>
</body>
`;
Loading
Loading