Skip to content

chore: Reorganize ABAC UI folders and files #37700

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
MartinSchoeler merged 2 commits into from
Dec 9, 2025
Merged

chore: Reorganize ABAC UI folders and files #37700

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
536a8bc
chore: Reorganize ABAC UI folders and files
MartinSchoeler Dec 4, 2025
d528e0d
Merge branch 'feat/abac' into chore/organize-ui-files
MartinSchoeler Dec 8, 2025
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
10 changes: 5 additions & 5 deletions ...admin/ABAC/AdminABACRoomAttributeMenu.tsx → .../ABAC/ABACAttributesTab/AttributeMenu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import { GenericMenu } from '@rocket.chat/ui-client';
import { useTranslation } from 'react-i18next';

import { useRoomAttributeItems } from './useRoomAttributeOptions';
import { useAttributeOptions } from '../hooks/useAttributeOptions';

type AdminABACRoomAttributeMenuProps = {
type AttributeMenuProps = {
attribute: { _id: string; key: string };
};

const AdminABACRoomAttributeMenu = ({ attribute }: AdminABACRoomAttributeMenuProps) => {
const AttributeMenu = ({ attribute }: AttributeMenuProps) => {
const { t } = useTranslation();

const items = useRoomAttributeItems(attribute);
const items = useAttributeOptions(attribute);

return (
<GenericMenu
Expand All @@ -25,4 +25,4 @@ const AdminABACRoomAttributeMenu = ({ attribute }: AdminABACRoomAttributeMenuPro
);
};

export default AdminABACRoomAttributeMenu;
export default AttributeMenu;
16 changes: 8 additions & 8 deletions ...dmin/ABAC/RoomAttributesContextualBar.tsx → ...AttributesTab/AttributesContextualBar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,11 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
import { FormProvider, useForm } from 'react-hook-form';
import { useTranslation } from 'react-i18next';

import type { AdminABACRoomAttributesFormFormData } from './AdminABACRoomAttributesForm';
import AdminABACRoomAttributesForm from './AdminABACRoomAttributesForm';
import { ABACQueryKeys } from '../../../lib/queryKeys';
import type { AttributesFormFormData } from './AttributesForm';
import AttributesForm from './AttributesForm';
import { ABACQueryKeys } from '../../../../lib/queryKeys';

type RoomAttributesContextualBarProps = {
type AttributesContextualBarProps = {
attributeId?: string;
attributeData?: {
key: string;
Expand All @@ -19,7 +19,7 @@ type RoomAttributesContextualBarProps = {
onClose: () => void;
};

const RoomAttributesContextualBar = ({ attributeData, onClose }: RoomAttributesContextualBarProps) => {
const AttributesContextualBar = ({ attributeData, onClose }: AttributesContextualBarProps) => {
const { t } = useTranslation();
const queryClient = useQueryClient();

Expand Down Expand Up @@ -52,7 +52,7 @@ const RoomAttributesContextualBar = ({ attributeData, onClose }: RoomAttributesC
const dispatchToastMessage = useToastMessageDispatch();

const saveMutation = useMutation({
mutationFn: async (data: AdminABACRoomAttributesFormFormData) => {
mutationFn: async (data: AttributesFormFormData) => {
const payload = {
key: data.name,
values: [...data.lockedAttributes.map((attribute) => attribute.value), ...data.attributeValues.map((attribute) => attribute.value)],
Expand Down Expand Up @@ -86,7 +86,7 @@ const RoomAttributesContextualBar = ({ attributeData, onClose }: RoomAttributesC
<ContextualbarClose onClick={onClose} />
</ContextualbarHeader>
<FormProvider {...methods}>
<AdminABACRoomAttributesForm
<AttributesForm
onSave={(values) => saveMutation.mutateAsync(values)}
onCancel={onClose}
description={t(attributeId ? 'ABAC_Edit_attribute_description' : 'ABAC_New_attribute_description')}
Expand All @@ -96,4 +96,4 @@ const RoomAttributesContextualBar = ({ attributeData, onClose }: RoomAttributesC
);
};

export default RoomAttributesContextualBar;
export default AttributesContextualBar;
12 changes: 6 additions & 6 deletions ...C/RoomAttributesContextualBarWithData.tsx → ...esTab/AttributesContextualBarWithData.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,15 @@ import { ContextualbarSkeletonBody } from '@rocket.chat/ui-client';
import { useEndpoint } from '@rocket.chat/ui-contexts';
import { useQuery } from '@tanstack/react-query';

import RoomAttributesContextualBar from './RoomAttributesContextualBar';
import { ABACQueryKeys } from '../../../lib/queryKeys';
import AttributesContextualBar from './AttributesContextualBar';
import { ABACQueryKeys } from '../../../../lib/queryKeys';

type RoomAttributesContextualBarWithDataProps = {
type AttributesContextualBarWithDataProps = {
id: string;
onClose: () => void;
};

const RoomAttributesContextualBarWithData = ({ id, onClose }: RoomAttributesContextualBarWithDataProps) => {
const AttributesContextualBarWithData = ({ id, onClose }: AttributesContextualBarWithDataProps) => {
const getAttributes = useEndpoint('GET', '/v1/abac/attributes/:_id', { _id: id });
const { data, isLoading, isFetching } = useQuery({
queryKey: ABACQueryKeys.roomAttributes.attribute(id),
Expand All @@ -22,7 +22,7 @@ const RoomAttributesContextualBarWithData = ({ id, onClose }: RoomAttributesCont
return <ContextualbarSkeletonBody />;
}

return <RoomAttributesContextualBar attributeData={data} onClose={onClose} />;
return <AttributesContextualBar attributeData={data} onClose={onClose} />;
};

export default RoomAttributesContextualBarWithData;
export default AttributesContextualBarWithData;
36 changes: 15 additions & 21 deletions ...ABAC/AdminABACRoomAttributesForm.spec.tsx → ...ABACAttributesTab/AttributesForm.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ import { axe } from 'jest-axe';
import type { ReactNode } from 'react';
import { FormProvider, useForm } from 'react-hook-form';

import AdminABACRoomAttributesForm, { type AdminABACRoomAttributesFormFormData } from './AdminABACRoomAttributesForm';
import * as stories from './AdminABACRoomAttributesForm.stories';
import AttributesForm, { type AttributesFormFormData } from './AttributesForm';
import * as stories from './AttributesForm.stories';

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

Expand All @@ -23,14 +23,8 @@ const appRoot = mockAppRoot()
})
.build();

const FormProviderWrapper = ({
children,
defaultValues,
}: {
children: ReactNode;
defaultValues?: Partial<AdminABACRoomAttributesFormFormData>;
}) => {
const methods = useForm<AdminABACRoomAttributesFormFormData>({
const FormProviderWrapper = ({ children, defaultValues }: { children: ReactNode; defaultValues?: Partial<AttributesFormFormData> }) => {
const methods = useForm<AttributesFormFormData>({
defaultValues: {
name: '',
attributeValues: [{ value: '' }],
Expand All @@ -43,7 +37,7 @@ const FormProviderWrapper = ({
return <FormProvider {...methods}>{children}</FormProvider>;
};

describe('AdminABACRoomAttributesForm', () => {
describe('AttributesForm', () => {
const defaultProps = {
onSave: jest.fn(),
onCancel: jest.fn(),
Expand All @@ -70,7 +64,7 @@ describe('AdminABACRoomAttributesForm', () => {
it('should show validation errors for required fields', async () => {
render(
<FormProviderWrapper>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand All @@ -86,7 +80,7 @@ describe('AdminABACRoomAttributesForm', () => {
it('should show validation error for empty attribute values', async () => {
render(
<FormProviderWrapper>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand All @@ -110,7 +104,7 @@ describe('AdminABACRoomAttributesForm', () => {

render(
<FormProviderWrapper defaultValues={defaultValues}>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand All @@ -130,7 +124,7 @@ describe('AdminABACRoomAttributesForm', () => {

render(
<FormProviderWrapper defaultValues={defaultValues}>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand All @@ -153,7 +147,7 @@ describe('AdminABACRoomAttributesForm', () => {

render(
<FormProviderWrapper defaultValues={defaultValues}>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand All @@ -172,7 +166,7 @@ describe('AdminABACRoomAttributesForm', () => {
it('should disable Add Value button when there are empty values', async () => {
render(
<FormProviderWrapper>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand All @@ -189,7 +183,7 @@ describe('AdminABACRoomAttributesForm', () => {

render(
<FormProviderWrapper defaultValues={defaultValues}>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand All @@ -206,7 +200,7 @@ describe('AdminABACRoomAttributesForm', () => {

render(
<FormProviderWrapper defaultValues={defaultValues}>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand All @@ -225,7 +219,7 @@ describe('AdminABACRoomAttributesForm', () => {
it('should call onCancel when Cancel button is clicked', async () => {
render(
<FormProviderWrapper>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand All @@ -245,7 +239,7 @@ describe('AdminABACRoomAttributesForm', () => {

render(
<FormProviderWrapper defaultValues={defaultValues}>
<AdminABACRoomAttributesForm {...defaultProps} />
<AttributesForm {...defaultProps} />
</FormProviderWrapper>,
{ wrapper: appRoot },
);
Expand Down
12 changes: 6 additions & 6 deletions ...C/AdminABACRoomAttributesForm.stories.tsx → ...CAttributesTab/AttributesForm.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@ import { mockAppRoot } from '@rocket.chat/mock-providers';
import type { Meta, StoryFn } from '@storybook/react';
import { FormProvider, useForm } from 'react-hook-form';

import AdminABACRoomAttributesForm, { type AdminABACRoomAttributesFormFormData } from './AdminABACRoomAttributesForm';
import AttributesForm, { type AttributesFormFormData } from './AttributesForm';

export default {
component: AdminABACRoomAttributesForm,
component: AttributesForm,
parameters: {
layout: 'padded',
},
Expand All @@ -25,15 +25,15 @@ export default {
})
.buildStoryDecorator(),
],
} satisfies Meta<typeof AdminABACRoomAttributesForm>;
} satisfies Meta<typeof AttributesForm>;

const Template: StoryFn<typeof AdminABACRoomAttributesForm> = (args) => <AdminABACRoomAttributesForm {...args} />;
const Template: StoryFn<typeof AttributesForm> = (args) => <AttributesForm {...args} />;

export const NewAttribute = Template.bind({});

NewAttribute.decorators = [
(fn) => {
const methods = useForm<AdminABACRoomAttributesFormFormData>({
const methods = useForm<AttributesFormFormData>({
defaultValues: {
name: '',
attributeValues: [{ value: '' }],
Expand All @@ -60,7 +60,7 @@ WithLockedAttributes.args = {

WithLockedAttributes.decorators = [
(fn) => {
const methods = useForm<AdminABACRoomAttributesFormFormData>({
const methods = useForm<AttributesFormFormData>({
defaultValues: {
name: 'Room Type',
lockedAttributes: [{ value: 'Locked Value 1' }, { value: 'Locked Value 2' }, { value: 'Locked Value 3' }],
Expand Down
12 changes: 6 additions & 6 deletions ...dmin/ABAC/AdminABACRoomAttributesForm.tsx → ...ABAC/ABACAttributesTab/AttributesForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,25 +15,25 @@ import { useCallback, useId, useMemo } from 'react';
import { useFieldArray, useFormContext } from 'react-hook-form';
import { useTranslation } from 'react-i18next';

export type AdminABACRoomAttributesFormFormData = {
export type AttributesFormFormData = {
name: string;
attributeValues: { value: string }[];
lockedAttributes: { value: string }[];
};

type AdminABACRoomAttributesFormProps = {
onSave: (data: AdminABACRoomAttributesFormFormData) => void;
type AttributesFormProps = {
onSave: (data: AttributesFormFormData) => void;
onCancel: () => void;
description: string;
};

const AdminABACRoomAttributesForm = ({ onSave, onCancel, description }: AdminABACRoomAttributesFormProps) => {
const AttributesForm = ({ onSave, onCancel, description }: AttributesFormProps) => {
const {
handleSubmit,
register,
formState: { errors },
watch,
} = useFormContext<AdminABACRoomAttributesFormFormData>();
} = useFormContext<AttributesFormFormData>();

const { fields: lockedAttributesFields, remove: removeLockedAttribute } = useFieldArray({
name: 'lockedAttributes',
Expand Down Expand Up @@ -138,4 +138,4 @@ const AdminABACRoomAttributesForm = ({ onSave, onCancel, description }: AdminABA
);
};

export default AdminABACRoomAttributesForm;
export default AttributesForm;
18 changes: 9 additions & 9 deletions ...ws/admin/ABAC/AdminABACRoomAttributes.tsx → ...ABAC/ABACAttributesTab/AttributesPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,21 +5,21 @@ import { useQuery } from '@tanstack/react-query';
import { useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';

import AdminABACRoomAttributeMenu from './AdminABACRoomAttributeMenu';
import { useIsABACAvailable } from './hooks/useIsABACAvailable';
import GenericNoResults from '../../../components/GenericNoResults';
import AttributeMenu from './AttributeMenu';
import GenericNoResults from '../../../../components/GenericNoResults';
import {
GenericTable,
GenericTableBody,
GenericTableCell,
GenericTableHeader,
GenericTableHeaderCell,
GenericTableRow,
} from '../../../components/GenericTable';
import { usePagination } from '../../../components/GenericTable/hooks/usePagination';
import { ABACQueryKeys } from '../../../lib/queryKeys';
} from '../../../../components/GenericTable';
import { usePagination } from '../../../../components/GenericTable/hooks/usePagination';
import { ABACQueryKeys } from '../../../../lib/queryKeys';
import { useIsABACAvailable } from '../hooks/useIsABACAvailable';

const AdminABACRoomAttributes = () => {
const AttributesPage = () => {
const { t } = useTranslation();

const [text, setText] = useState('');
Expand Down Expand Up @@ -86,7 +86,7 @@ const AdminABACRoomAttributes = () => {
<GenericTableCell>{attribute.key}</GenericTableCell>
<GenericTableCell>{attribute.values.join(', ')}</GenericTableCell>
<GenericTableCell>
<AdminABACRoomAttributeMenu attribute={attribute} />
<AttributeMenu attribute={attribute} />
</GenericTableCell>
</GenericTableRow>
))}
Expand All @@ -107,4 +107,4 @@ const AdminABACRoomAttributes = () => {
);
};

export default AdminABACRoomAttributes;
export default AttributesPage;
4 changes: 2 additions & 2 deletions ...AdminABACRoomAttributesForm.spec.tsx.snap → ..._snapshots__/AttributesForm.spec.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing

exports[`AdminABACRoomAttributesForm renders NewAttribute without crashing 1`] = `
exports[`AttributesForm renders NewAttribute without crashing 1`] = `
<body>
<div>
<div
Expand Down Expand Up @@ -173,7 +173,7 @@ exports[`AdminABACRoomAttributesForm renders NewAttribute without crashing 1`] =
</body>
`;

exports[`AdminABACRoomAttributesForm renders WithLockedAttributes without crashing 1`] = `
exports[`AttributesForm renders WithLockedAttributes without crashing 1`] = `
<body>
<div>
<div
Expand Down
Loading
Loading