1
0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-22 19:07:54 +01:00

feat: add last seen column to PAT table (#2519)

https://linear.app/unleash/issue/2-452/add-table-column-to-pats-table-ui
This commit is contained in:
Nuno Góis 2022-11-29 20:15:34 +00:00 committed by GitHub
parent 564c287025
commit 348bbfeda3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -35,6 +35,8 @@ import { sortTypes } from 'utils/sortTypes';
import { CreatePersonalAPIToken } from './CreatePersonalAPIToken/CreatePersonalAPIToken';
import { DeletePersonalAPIToken } from './DeletePersonalAPIToken/DeletePersonalAPIToken';
import { PersonalAPITokenDialog } from './PersonalAPITokenDialog/PersonalAPITokenDialog';
import { TimeAgoCell } from 'component/common/Table/cells/TimeAgoCell/TimeAgoCell';
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
const StyledAlert = styled(Alert)(({ theme }) => ({
marginBottom: theme.spacing(3),
@ -80,6 +82,7 @@ interface IPersonalAPITokensTabProps {
}
export const PersonalAPITokensTab = ({ user }: IPersonalAPITokensTabProps) => {
const { uiConfig } = useUiConfig();
const theme = useTheme();
const isSmallScreen = useMediaQuery(theme.breakpoints.down('md'));
const isExtraSmallScreen = useMediaQuery(theme.breakpoints.down('sm'));
@ -135,6 +138,13 @@ export const PersonalAPITokensTab = ({ user }: IPersonalAPITokensTabProps) => {
sortType: 'date',
maxWidth: 150,
},
{
Header: 'Last seen',
accessor: 'seenAt',
Cell: TimeAgoCell,
sortType: 'date',
maxWidth: 150,
},
{
Header: 'Actions',
id: 'Actions',
@ -198,6 +208,9 @@ export const PersonalAPITokensTab = ({ user }: IPersonalAPITokensTabProps) => {
useEffect(() => {
const hiddenColumns = [];
if (!uiConfig.flags.tokensLastSeen) {
hiddenColumns.push('seenAt');
}
if (isSmallScreen) {
hiddenColumns.push('createdAt');
}
@ -205,7 +218,12 @@ export const PersonalAPITokensTab = ({ user }: IPersonalAPITokensTabProps) => {
hiddenColumns.push('expiresAt');
}
setHiddenColumns(hiddenColumns);
}, [setHiddenColumns, isSmallScreen, isExtraSmallScreen]);
}, [
setHiddenColumns,
isSmallScreen,
isExtraSmallScreen,
uiConfig.flags.tokensLastSeen,
]);
useEffect(() => {
const tableState: PageQueryType = {};