mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +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:
		
							parent
							
								
									564c287025
								
							
						
					
					
						commit
						348bbfeda3
					
				@ -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 = {};
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
		Reference in New Issue
	
	Block a user