Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-22 19:07:54 +01:00
Code Issues Projects Releases Wiki Activity

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

Browse Source 
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
1 changed files with 19 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/src/component/user/Profile/PersonalAPITokensTab/PersonalAPITokensTab.tsx
View File

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