Fixes https://github.com/twentyhq/core-team-issues/issues/566 ## Before <img width="712" alt="Screenshot 2025-03-18 at 17 17 38" src="https://github.com/user-attachments/assets/5c2dd8c6-e0cc-4610-b858-071d50de692c" /> <img width="775" alt="Screenshot 2025-03-18 at 17 17 30" src="https://github.com/user-attachments/assets/52bdde22-f26d-4698-8138-5f2af28ddd50" /> ## After <img width="949" alt="Screenshot 2025-03-18 at 16 58 31" src="https://github.com/user-attachments/assets/71b77032-0f5d-452b-b088-7af7e306d0a6" /> <img width="946" alt="Screenshot 2025-03-18 at 16 58 38" src="https://github.com/user-attachments/assets/dc2ddf95-1622-419a-a35b-3037da7bdd4d" />
38 lines
1.1 KiB
TypeScript
38 lines
1.1 KiB
TypeScript
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';
|
|
import { Checkbox } from 'twenty-ui';
|
|
|
|
const StyledNameHeader = styled(TableHeader)`
|
|
flex: 1;
|
|
padding-left: ${({ theme }) => theme.spacing(2)};
|
|
`;
|
|
|
|
const StyledActionsHeader = styled(TableHeader)`
|
|
align-items: center;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
padding-right: ${({ theme }) => theme.spacing(4)};
|
|
`;
|
|
|
|
const StyledTypeHeader = styled(TableHeader)`
|
|
flex: 1;
|
|
`;
|
|
|
|
type RolePermissionsSettingsTableHeaderProps = {
|
|
allPermissions: boolean;
|
|
};
|
|
|
|
export const RolePermissionsSettingsTableHeader = ({
|
|
allPermissions,
|
|
}: RolePermissionsSettingsTableHeaderProps) => (
|
|
<TableRow gridAutoColumns="3fr 4fr 24px">
|
|
<StyledNameHeader>{t`Name`}</StyledNameHeader>
|
|
<StyledTypeHeader>{t`Description`}</StyledTypeHeader>
|
|
<StyledActionsHeader aria-label={t`Actions`}>
|
|
<Checkbox checked={allPermissions} disabled />
|
|
</StyledActionsHeader>
|
|
</TableRow>
|
|
);
|