## Context This PR introduces the "assignment" tab in the Role edit page, currently allowing admin users to assign workspace members to specific roles. Note: For now, a user can only have one role and a modal will warn you if you try to re-assign a user to a new role. ## Test <img width="648" alt="Screenshot 2025-02-10 at 17 59 21" src="https://github.com/user-attachments/assets/dabd7a17-6aca-4d2b-95d8-46182f53e1e8" /> <img width="668" alt="Screenshot 2025-02-10 at 17 59 33" src="https://github.com/user-attachments/assets/802aab7a-db67-4f83-9a44-35773df100f7" /> <img width="629" alt="Screenshot 2025-02-10 at 17 59 42" src="https://github.com/user-attachments/assets/277db061-3f05-4ccd-8a83-7a96d6c1673e" />
26 lines
843 B
TypeScript
26 lines
843 B
TypeScript
import { Table } from '@/ui/layout/table/components/Table';
|
|
import { TableHeader } from '@/ui/layout/table/components/TableHeader';
|
|
import { TableRow } from '@/ui/layout/table/components/TableRow';
|
|
import styled from '@emotion/styled';
|
|
import { t } from '@lingui/core/macro';
|
|
|
|
const StyledTableHeaderRow = styled(Table)`
|
|
margin-bottom: ${({ theme }) => theme.spacing(1.5)};
|
|
`;
|
|
|
|
type RoleAssignmentTableHeaderProps = {
|
|
className?: string;
|
|
};
|
|
|
|
export const RoleAssignmentTableHeader = ({
|
|
className,
|
|
}: RoleAssignmentTableHeaderProps) => (
|
|
<StyledTableHeaderRow className={className}>
|
|
<TableRow gridAutoColumns="150px 1fr 1fr">
|
|
<TableHeader>{t`Name`}</TableHeader>
|
|
<TableHeader>{t`Email`}</TableHeader>
|
|
<TableHeader align={'right'} aria-label={t`Actions`}></TableHeader>
|
|
</TableRow>
|
|
</StyledTableHeaderRow>
|
|
);
|