mirror of
https://github.com/Unleash/unleash.git
synced 2025-03-18 00:19:49 +01:00
Archive table updates (#1097)
* minor archive table updates * archived date cell * archive import paths
This commit is contained in:
parent
522f4aed41
commit
37fa469faf
@ -173,6 +173,7 @@ const COLUMNS = [
|
||||
align: 'center',
|
||||
Cell: FeatureSeenCell,
|
||||
disableGlobalFilter: true,
|
||||
minWidth: 85,
|
||||
},
|
||||
{
|
||||
Header: 'Type',
|
||||
@ -180,6 +181,7 @@ const COLUMNS = [
|
||||
align: 'center',
|
||||
Cell: FeatureTypeCell,
|
||||
disableGlobalFilter: true,
|
||||
minWidth: 85,
|
||||
},
|
||||
{
|
||||
Header: 'Name',
|
||||
@ -194,18 +196,21 @@ const COLUMNS = [
|
||||
sortType: 'date',
|
||||
Cell: DateCell,
|
||||
disableGlobalFilter: true,
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
Header: 'Expired',
|
||||
accessor: 'expiredAt',
|
||||
Cell: ReportExpiredCell,
|
||||
disableGlobalFilter: true,
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
Header: 'Status',
|
||||
accessor: 'status',
|
||||
id: 'status',
|
||||
Cell: ReportStatusCell,
|
||||
disableGlobalFilter: true,
|
||||
minWidth: 200,
|
||||
},
|
||||
{
|
||||
Header: 'State',
|
||||
@ -213,5 +218,6 @@ const COLUMNS = [
|
||||
sortType: 'boolean',
|
||||
Cell: FeatureStaleCell,
|
||||
disableGlobalFilter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
];
|
||||
|
@ -56,24 +56,21 @@ export const ApiTokenTable = () => {
|
||||
setHiddenColumns(hiddenColumns);
|
||||
}, [setHiddenColumns, hiddenColumns]);
|
||||
|
||||
const headerSearch = (
|
||||
<Search initialValue={globalFilter} onChange={setGlobalFilter} />
|
||||
);
|
||||
|
||||
const headerActions = (
|
||||
<>
|
||||
{headerSearch}
|
||||
<PageHeader.Divider />
|
||||
<CreateApiTokenButton />
|
||||
</>
|
||||
);
|
||||
|
||||
return (
|
||||
<PageContent
|
||||
header={
|
||||
<PageHeader
|
||||
title={`API access (${rows.length})`}
|
||||
actions={headerActions}
|
||||
actions={
|
||||
<>
|
||||
<Search
|
||||
initialValue={globalFilter}
|
||||
onChange={setGlobalFilter}
|
||||
/>
|
||||
<PageHeader.Divider />
|
||||
<CreateApiTokenButton />
|
||||
</>
|
||||
}
|
||||
/>
|
||||
}
|
||||
>
|
||||
|
@ -17,13 +17,13 @@ import { HighlightCell } from 'component/common/Table/cells/HighlightCell/Highli
|
||||
import { DateCell } from 'component/common/Table/cells/DateCell/DateCell';
|
||||
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
|
||||
import { Search } from 'component/common/Search/Search';
|
||||
import { FeatureTypeCell } from '../../common/Table/cells/FeatureTypeCell/FeatureTypeCell';
|
||||
import { FeatureSeenCell } from '../../common/Table/cells/FeatureSeenCell/FeatureSeenCell';
|
||||
import { LinkCell } from '../../common/Table/cells/LinkCell/LinkCell';
|
||||
import { FeatureStaleCell } from '../../feature/FeatureToggleList/FeatureStaleCell/FeatureStaleCell';
|
||||
import { FeatureTypeCell } from 'component/common/Table/cells/FeatureTypeCell/FeatureTypeCell';
|
||||
import { FeatureSeenCell } from 'component/common/Table/cells/FeatureSeenCell/FeatureSeenCell';
|
||||
import { LinkCell } from 'component/common/Table/cells/LinkCell/LinkCell';
|
||||
import { FeatureStaleCell } from 'component/feature/FeatureToggleList/FeatureStaleCell/FeatureStaleCell';
|
||||
import { ReviveArchivedFeatureCell } from 'component/archive/ArchiveTable/ReviveArchivedFeatureCell/ReviveArchivedFeatureCell';
|
||||
import { useStyles } from '../../feature/FeatureToggleList/styles';
|
||||
import { featuresPlaceholder } from '../../feature/FeatureToggleList/FeatureToggleListTable';
|
||||
import { useStyles } from 'component/feature/FeatureToggleList/styles';
|
||||
import { featuresPlaceholder } from 'component/feature/FeatureToggleList/FeatureToggleListTable';
|
||||
import theme from 'themes/theme';
|
||||
import { FeatureSchema } from 'openapi';
|
||||
import { useFeatureArchiveApi } from 'hooks/api/actions/useFeatureArchiveApi/useReviveFeatureApi';
|
||||
@ -152,7 +152,7 @@ export const ArchiveTable = ({
|
||||
]
|
||||
: []),
|
||||
{
|
||||
Header: 'Status',
|
||||
Header: 'State',
|
||||
accessor: 'stale',
|
||||
Cell: FeatureStaleCell,
|
||||
sortType: 'boolean',
|
||||
@ -166,7 +166,6 @@ export const ArchiveTable = ({
|
||||
align: 'center',
|
||||
maxWidth: 85,
|
||||
canSort: false,
|
||||
disableGlobalFilter: true,
|
||||
Cell: ({ row: { original } }: any) => (
|
||||
<ReviveArchivedFeatureCell
|
||||
project={original.project}
|
||||
@ -339,21 +338,23 @@ export const ArchiveTable = ({
|
||||
</Table>
|
||||
</SearchHighlightProvider>
|
||||
<ConditionallyRender
|
||||
condition={rows.length === 0 && searchValue?.length > 0}
|
||||
show={
|
||||
<TablePlaceholder>
|
||||
No feature toggles found matching “
|
||||
{searchValue}”
|
||||
</TablePlaceholder>
|
||||
}
|
||||
/>
|
||||
<ConditionallyRender
|
||||
condition={rows.length === 0 && searchValue?.length === 0}
|
||||
show={
|
||||
<TablePlaceholder>
|
||||
None of the feature toggles where archived yet.
|
||||
</TablePlaceholder>
|
||||
}
|
||||
condition={rows.length === 0}
|
||||
show={() => (
|
||||
<ConditionallyRender
|
||||
condition={searchValue?.length > 0}
|
||||
show={
|
||||
<TablePlaceholder>
|
||||
No feature toggles found matching “
|
||||
{searchValue}”
|
||||
</TablePlaceholder>
|
||||
}
|
||||
elseShow={
|
||||
<TablePlaceholder>
|
||||
None of the feature toggles were archived yet.
|
||||
</TablePlaceholder>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</PageContent>
|
||||
);
|
||||
|
@ -1,6 +1,6 @@
|
||||
import { VFC } from 'react';
|
||||
import TimeAgo from 'react-timeago';
|
||||
import { Tooltip, Typography } from '@mui/material';
|
||||
import { Tooltip, Typography, useTheme } from '@mui/material';
|
||||
import { formatDateYMD } from 'utils/formatDate';
|
||||
import { TextCell } from 'component/common/Table/cells/TextCell/TextCell';
|
||||
import { useLocationSettings } from 'hooks/useLocationSettings';
|
||||
@ -13,24 +13,37 @@ export const FeatureArchivedCell: VFC<IFeatureArchivedCellProps> = ({
|
||||
value: archivedAt,
|
||||
}) => {
|
||||
const { locationSettings } = useLocationSettings();
|
||||
const theme = useTheme();
|
||||
|
||||
if (!archivedAt) return <TextCell />;
|
||||
if (!archivedAt)
|
||||
return (
|
||||
<TextCell>
|
||||
<Typography
|
||||
variant="body2"
|
||||
color={theme.palette.text.secondary}
|
||||
>
|
||||
not available
|
||||
</Typography>
|
||||
</TextCell>
|
||||
);
|
||||
|
||||
return (
|
||||
<TextCell>
|
||||
{archivedAt && (
|
||||
<Tooltip
|
||||
title={`Archived on: ${formatDateYMD(
|
||||
archivedAt,
|
||||
locationSettings.locale
|
||||
)}`}
|
||||
arrow
|
||||
>
|
||||
<Typography noWrap variant="body2" data-loading>
|
||||
<TimeAgo date={new Date(archivedAt)} />
|
||||
</Typography>
|
||||
</Tooltip>
|
||||
)}
|
||||
<Tooltip
|
||||
title={`Archived on: ${formatDateYMD(
|
||||
archivedAt,
|
||||
locationSettings.locale
|
||||
)}`}
|
||||
arrow
|
||||
>
|
||||
<Typography noWrap variant="body2" data-loading>
|
||||
<TimeAgo
|
||||
date={new Date(archivedAt)}
|
||||
title=""
|
||||
live={false}
|
||||
/>
|
||||
</Typography>
|
||||
</Tooltip>
|
||||
</TextCell>
|
||||
);
|
||||
};
|
||||
|
@ -19,7 +19,7 @@ export const ReviveArchivedFeatureCell: VFC<IReviveArchivedFeatureCell> = ({
|
||||
onClick={onRevive}
|
||||
projectId={project}
|
||||
permission={UPDATE_FEATURE}
|
||||
tooltipProps={{ title: 'Revive feature' }}
|
||||
tooltipProps={{ title: 'Revive feature toggle' }}
|
||||
>
|
||||
<Undo />
|
||||
</PermissionIconButton>
|
||||
|
@ -1,17 +1,18 @@
|
||||
import { useFeaturesArchive } from '../../hooks/api/getters/useFeaturesArchive/useFeaturesArchive';
|
||||
import { useFeaturesArchive } from 'hooks/api/getters/useFeaturesArchive/useFeaturesArchive';
|
||||
import { ArchiveTable } from './ArchiveTable/ArchiveTable';
|
||||
import { SortingRule } from 'react-table';
|
||||
import { usePageTitle } from 'hooks/usePageTitle';
|
||||
import { createLocalStorage } from 'utils/createLocalStorage';
|
||||
|
||||
const defaultSort: SortingRule<string> = { id: 'createdAt', desc: true };
|
||||
const defaultSort: SortingRule<string> = { id: 'createdAt' };
|
||||
const { value, setValue } = createLocalStorage(
|
||||
'FeaturesArchiveTable:v1',
|
||||
defaultSort
|
||||
);
|
||||
|
||||
export const FeaturesArchiveTable = () => {
|
||||
usePageTitle('Archived');
|
||||
usePageTitle('Archive');
|
||||
|
||||
const {
|
||||
archivedFeatures = [],
|
||||
loading,
|
||||
@ -20,7 +21,7 @@ export const FeaturesArchiveTable = () => {
|
||||
|
||||
return (
|
||||
<ArchiveTable
|
||||
title="Archived"
|
||||
title="Archive"
|
||||
archivedFeatures={archivedFeatures}
|
||||
loading={loading}
|
||||
storedParams={value}
|
||||
|
@ -1,9 +1,9 @@
|
||||
import { ArchiveTable } from './ArchiveTable/ArchiveTable';
|
||||
import { SortingRule } from 'react-table';
|
||||
import { useProjectFeaturesArchive } from '../../hooks/api/getters/useProjectFeaturesArchive/useProjectFeaturesArchive';
|
||||
import { useProjectFeaturesArchive } from 'hooks/api/getters/useProjectFeaturesArchive/useProjectFeaturesArchive';
|
||||
import { createLocalStorage } from 'utils/createLocalStorage';
|
||||
|
||||
const defaultSort: SortingRule<string> = { id: 'archivedAt', desc: true };
|
||||
const defaultSort: SortingRule<string> = { id: 'archivedAt' };
|
||||
|
||||
interface IProjectFeaturesTable {
|
||||
projectId: string;
|
||||
|
@ -68,17 +68,15 @@ export const FeatureStaleDialog = ({
|
||||
open={isOpen}
|
||||
secondaryButtonText={'Cancel'}
|
||||
primaryButtonText={`Flip to ${toggleActionText}`}
|
||||
title={`Set feature status to ${toggleActionText}`}
|
||||
title={`Set feature state to ${toggleActionText}`}
|
||||
onClick={onSubmit}
|
||||
onClose={onClose}
|
||||
>
|
||||
<>
|
||||
<ConditionallyRender
|
||||
condition={isStale}
|
||||
show={toggleToActiveContent}
|
||||
elseShow={toggleToStaleContent}
|
||||
/>
|
||||
</>
|
||||
<ConditionallyRender
|
||||
condition={isStale}
|
||||
show={toggleToActiveContent}
|
||||
elseShow={toggleToStaleContent}
|
||||
/>
|
||||
</Dialogue>
|
||||
);
|
||||
};
|
||||
|
@ -196,7 +196,7 @@ export const FeatureToggleListItem = memo<IFeatureToggleListItemProps>(
|
||||
!projectExists()
|
||||
}
|
||||
onClick={reviveFeature}
|
||||
tooltipProps={{ title: 'Revive feature' }}
|
||||
tooltipProps={{ title: 'Revive feature toggle' }}
|
||||
>
|
||||
<Undo />
|
||||
</PermissionIconButton>
|
||||
|
@ -144,7 +144,7 @@ export const FeatureView = () => {
|
||||
permission={UPDATE_FEATURE}
|
||||
projectId={projectId}
|
||||
tooltipProps={{
|
||||
title: 'Toggle stale status',
|
||||
title: 'Toggle stale state',
|
||||
}}
|
||||
data-loading
|
||||
>
|
||||
|
Loading…
Reference in New Issue
Block a user