Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-07-26 13:48:33 +02:00
Code Issues Projects Releases Wiki Activity

fix: project access table (#2404)

Browse Source 
* Tweaks the project access table so it fits with the new design
This commit is contained in:
Fredrik Strand Oseberg 2022-11-11 12:09:04 +01:00 committed by GitHub
parent 2fa154a3e4
commit 70e020ffeb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
frontend/src/component/project/ProjectAccess/ProjectAccessTable/ProjectAccessTable.tsx
View File

@ -75,13 +75,8 @@ const StyledGroupAvatar = styled(UserAvatar)(({ theme }) => ({
outline: `${theme.spacing(0.25)} solid ${theme.palette.background.paper}`, outline: `${theme.spacing(0.25)} solid ${theme.palette.background.paper}`,
})); }));
const hiddenColumnsSmall = [ const hiddenColumnsSmall = ['imageUrl', 'role', 'added', 'lastLogin'];
'imageUrl', const hiddenColumnsMedium = ['lastLogin', 'added'];
'username',
'role',
'added',
'lastLogin',
];
export const ProjectAccessTable: VFC = () => { export const ProjectAccessTable: VFC = () => {
const projectId = useRequiredPathParam('projectId'); const projectId = useRequiredPathParam('projectId');
@ -93,6 +88,7 @@ export const ProjectAccessTable: VFC = () => {
const navigate = useNavigate(); const navigate = useNavigate();
const theme = useTheme(); const theme = useTheme();
const isSmallScreen = useMediaQuery(theme.breakpoints.down('md')); const isSmallScreen = useMediaQuery(theme.breakpoints.down('md'));
const isMediumScreen = useMediaQuery(theme.breakpoints.down('lg'));
const { setToastData } = useToast(); const { setToastData } = useToast();
const { access, refetchProjectAccess } = useProjectAccess(projectId); const { access, refetchProjectAccess } = useProjectAccess(projectId);
@ -140,7 +136,7 @@ export const ProjectAccessTable: VFC = () => {
elseShow={<HighlightCell value={value} />} elseShow={<HighlightCell value={value} />}
/> />
), ),
minWidth: 100, maxWidth: 125,
searchable: true, searchable: true,
}, },
{ {
@ -169,7 +165,7 @@ export const ProjectAccessTable: VFC = () => {
value={value} value={value}
/> />
), ),
minWidth: 120, maxWidth: 125,
filterName: 'role', filterName: 'role',
}, },
{ {
@ -183,7 +179,7 @@ export const ProjectAccessTable: VFC = () => {
<TimeAgoCell value={value} emptyText="Never" /> <TimeAgoCell value={value} emptyText="Never" />
), ),
sortType: 'date', sortType: 'date',
maxWidth: 150, maxWidth: 100,
}, },
{ {
id: 'lastLogin', id: 'lastLogin',
@ -203,14 +199,14 @@ export const ProjectAccessTable: VFC = () => {
<TimeAgoCell value={value} emptyText="Never" /> <TimeAgoCell value={value} emptyText="Never" />
), ),
sortType: 'date', sortType: 'date',
maxWidth: 150, maxWidth: 100,
}, },
{ {
id: 'actions', id: 'actions',
Header: 'Actions', Header: 'Actions',
disableSortBy: true, disableSortBy: true,
align: 'center', align: 'center',
maxWidth: 200, maxWidth: 150,
Cell: ({ Cell: ({
row: { original: row }, row: { original: row },
}: { }: {
@ -304,6 +300,7 @@ export const ProjectAccessTable: VFC = () => {
); );
useHiddenColumns(setHiddenColumns, hiddenColumnsSmall, isSmallScreen); useHiddenColumns(setHiddenColumns, hiddenColumnsSmall, isSmallScreen);
useHiddenColumns(setHiddenColumns, hiddenColumnsMedium, isMediumScreen);
useEffect(() => { useEffect(() => {
const tableState: PageQueryType = {}; const tableState: PageQueryType = {};