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

update table search and columns width

Browse Source
This commit is contained in:
Tymoteusz Czech 2022-06-14 09:32:04 +02:00
parent 439d7c1745
commit f35d3a4881
1 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/src/component/archive/ArchiveTable/ArchiveTable.tsx
View File

@ -7,7 +7,6 @@ import {
TableCell, TableCell,
TablePlaceholder, TablePlaceholder,
TableRow, TableRow,
TableSearch,
} from 'component/common/Table'; } from 'component/common/Table';
import { SortingRule, useFlexLayout, useSortBy, useTable } from 'react-table'; import { SortingRule, useFlexLayout, useSortBy, useTable } from 'react-table';
import { SearchHighlightProvider } from 'component/common/Table/SearchHighlightContext/SearchHighlightContext'; import { SearchHighlightProvider } from 'component/common/Table/SearchHighlightContext/SearchHighlightContext';
@ -17,6 +16,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
import { HighlightCell } from 'component/common/Table/cells/HighlightCell/HighlightCell'; import { HighlightCell } from 'component/common/Table/cells/HighlightCell/HighlightCell';
import { DateCell } from 'component/common/Table/cells/DateCell/DateCell'; import { DateCell } from 'component/common/Table/cells/DateCell/DateCell';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender'; import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import { Search } from 'component/common/Search/Search';
import { FeatureTypeCell } from '../../common/Table/cells/FeatureTypeCell/FeatureTypeCell'; import { FeatureTypeCell } from '../../common/Table/cells/FeatureTypeCell/FeatureTypeCell';
import { FeatureSeenCell } from '../../common/Table/cells/FeatureSeenCell/FeatureSeenCell'; import { FeatureSeenCell } from '../../common/Table/cells/FeatureSeenCell/FeatureSeenCell';
import { LinkCell } from '../../common/Table/cells/LinkCell/LinkCell'; import { LinkCell } from '../../common/Table/cells/LinkCell/LinkCell';
@ -92,17 +92,19 @@ export const ArchiveTable = ({
{ {
id: 'Seen', id: 'Seen',
Header: 'Seen', Header: 'Seen',
maxWidth: 85, width: 85,
canSort: true, canSort: true,
Cell: FeatureSeenCell, Cell: FeatureSeenCell,
accessor: 'lastSeenAt', accessor: 'lastSeenAt',
align: 'center',
}, },
{ {
id: 'Type', id: 'Type',
Header: 'Type', Header: 'Type',
maxWidth: 80, width: 80,
canSort: true, canSort: true,
Cell: FeatureTypeCell, Cell: FeatureTypeCell,
align: 'center',
}, },
{ {
Header: 'Feature toggle name', Header: 'Feature toggle name',
@ -120,14 +122,14 @@ export const ArchiveTable = ({
{ {
Header: 'Created', Header: 'Created',
accessor: 'createdAt', accessor: 'createdAt',
minWidth: 120, width: 150,
Cell: DateCell, Cell: DateCell,
sortType: 'date', sortType: 'date',
}, },
{ {
Header: 'Archived', Header: 'Archived',
accessor: 'archivedAt', accessor: 'archivedAt',
minWidth: 120, width: 150,
Cell: FeatureArchivedCell, Cell: FeatureArchivedCell,
sortType: 'date', sortType: 'date',
}, },
@ -139,7 +141,7 @@ export const ArchiveTable = ({
sortType: 'alphanumeric', sortType: 'alphanumeric',
filterName: 'project', filterName: 'project',
searchable: true, searchable: true,
maxWidth: 150, maxWidth: 170,
Cell: ({ value }: any) => ( Cell: ({ value }: any) => (
<LinkCell <LinkCell
title={value} title={value}
@ -253,7 +255,7 @@ export const ArchiveTable = ({
replace: true, replace: true,
}); });
setStoredParams({ id: sortBy[0].id, desc: sortBy[0].desc || false }); setStoredParams({ id: sortBy[0].id, desc: sortBy[0].desc || false });
}, [loading, sortBy, searchValue]); }, [loading, sortBy, searchValue]); // eslint-disable-line react-hooks/exhaustive-deps
const [firstRenderedIndex, lastRenderedIndex] = const [firstRenderedIndex, lastRenderedIndex] =
useVirtualizedRange(rowHeight); useVirtualizedRange(rowHeight);
@ -270,7 +272,7 @@ export const ArchiveTable = ({
})`} })`}
actions={ actions={
<> <>
<TableSearch <Search
initialValue={searchValue} initialValue={searchValue}
onChange={setSearchValue} onChange={setSearchValue}
hasFilters hasFilters
@ -300,6 +302,7 @@ export const ArchiveTable = ({
> >
<SortableTableHeader <SortableTableHeader
headerGroups={headerGroups as any} headerGroups={headerGroups as any}
flex
/> />
<TableBody {...getTableBodyProps()}> <TableBody {...getTableBodyProps()}>
{rows.map((row, index) => { {rows.map((row, index) => {