From 37fa469faf3a6be5573dbfb200d5afdc15c056cf Mon Sep 17 00:00:00 2001 From: Tymoteusz Czech <2625371+Tymek@users.noreply.github.com> Date: Wed, 15 Jun 2022 15:16:42 +0200 Subject: [PATCH] Archive table updates (#1097) * minor archive table updates * archived date cell * archive import paths --- .../Reporting/ReportTable/ReportTable.tsx | 8 +++- .../apiToken/ApiTokenTable/ApiTokenTable.tsx | 23 ++++----- .../archive/ArchiveTable/ArchiveTable.tsx | 47 ++++++++++--------- .../FeatureArchivedCell.tsx | 43 +++++++++++------ .../ReviveArchivedFeatureCell.tsx | 2 +- .../archive/FeaturesArchiveTable.tsx | 9 ++-- .../archive/ProjectFeaturesArchiveTable.tsx | 4 +- .../FeatureStaleDialog/FeatureStaleDialog.tsx | 14 +++--- .../FeatureToggleListItem.tsx | 2 +- .../feature/FeatureView/FeatureView.tsx | 2 +- 10 files changed, 85 insertions(+), 69 deletions(-) diff --git a/frontend/src/component/Reporting/ReportTable/ReportTable.tsx b/frontend/src/component/Reporting/ReportTable/ReportTable.tsx index ab35369951..a64756cab9 100644 --- a/frontend/src/component/Reporting/ReportTable/ReportTable.tsx +++ b/frontend/src/component/Reporting/ReportTable/ReportTable.tsx @@ -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, }, ]; diff --git a/frontend/src/component/admin/apiToken/ApiTokenTable/ApiTokenTable.tsx b/frontend/src/component/admin/apiToken/ApiTokenTable/ApiTokenTable.tsx index 90801c8197..273ca43376 100644 --- a/frontend/src/component/admin/apiToken/ApiTokenTable/ApiTokenTable.tsx +++ b/frontend/src/component/admin/apiToken/ApiTokenTable/ApiTokenTable.tsx @@ -56,24 +56,21 @@ export const ApiTokenTable = () => { setHiddenColumns(hiddenColumns); }, [setHiddenColumns, hiddenColumns]); - const headerSearch = ( - - ); - - const headerActions = ( - <> - {headerSearch} - - - - ); - return ( + + + + + } /> } > diff --git a/frontend/src/component/archive/ArchiveTable/ArchiveTable.tsx b/frontend/src/component/archive/ArchiveTable/ArchiveTable.tsx index 1978526139..b0f94005a0 100644 --- a/frontend/src/component/archive/ArchiveTable/ArchiveTable.tsx +++ b/frontend/src/component/archive/ArchiveTable/ArchiveTable.tsx @@ -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) => ( 0} - show={ - - No feature toggles found matching “ - {searchValue}” - - } - /> - - None of the feature toggles where archived yet. - - } + condition={rows.length === 0} + show={() => ( + 0} + show={ + + No feature toggles found matching “ + {searchValue}” + + } + elseShow={ + + None of the feature toggles were archived yet. + + } + /> + )} /> ); diff --git a/frontend/src/component/archive/ArchiveTable/FeatureArchivedCell/FeatureArchivedCell.tsx b/frontend/src/component/archive/ArchiveTable/FeatureArchivedCell/FeatureArchivedCell.tsx index 75c94812f0..7cd1177199 100644 --- a/frontend/src/component/archive/ArchiveTable/FeatureArchivedCell/FeatureArchivedCell.tsx +++ b/frontend/src/component/archive/ArchiveTable/FeatureArchivedCell/FeatureArchivedCell.tsx @@ -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 = ({ value: archivedAt, }) => { const { locationSettings } = useLocationSettings(); + const theme = useTheme(); - if (!archivedAt) return ; + if (!archivedAt) + return ( + + + not available + + + ); return ( - {archivedAt && ( - - - - - - )} + + + + + ); }; diff --git a/frontend/src/component/archive/ArchiveTable/ReviveArchivedFeatureCell/ReviveArchivedFeatureCell.tsx b/frontend/src/component/archive/ArchiveTable/ReviveArchivedFeatureCell/ReviveArchivedFeatureCell.tsx index 995810c38c..8a9b7c5029 100644 --- a/frontend/src/component/archive/ArchiveTable/ReviveArchivedFeatureCell/ReviveArchivedFeatureCell.tsx +++ b/frontend/src/component/archive/ArchiveTable/ReviveArchivedFeatureCell/ReviveArchivedFeatureCell.tsx @@ -19,7 +19,7 @@ export const ReviveArchivedFeatureCell: VFC = ({ onClick={onRevive} projectId={project} permission={UPDATE_FEATURE} - tooltipProps={{ title: 'Revive feature' }} + tooltipProps={{ title: 'Revive feature toggle' }} > diff --git a/frontend/src/component/archive/FeaturesArchiveTable.tsx b/frontend/src/component/archive/FeaturesArchiveTable.tsx index 23e57da625..1fde18d557 100644 --- a/frontend/src/component/archive/FeaturesArchiveTable.tsx +++ b/frontend/src/component/archive/FeaturesArchiveTable.tsx @@ -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 = { id: 'createdAt', desc: true }; +const defaultSort: SortingRule = { 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 ( = { id: 'archivedAt', desc: true }; +const defaultSort: SortingRule = { id: 'archivedAt' }; interface IProjectFeaturesTable { projectId: string; diff --git a/frontend/src/component/common/FeatureStaleDialog/FeatureStaleDialog.tsx b/frontend/src/component/common/FeatureStaleDialog/FeatureStaleDialog.tsx index 1897eacf57..eeef302ec3 100644 --- a/frontend/src/component/common/FeatureStaleDialog/FeatureStaleDialog.tsx +++ b/frontend/src/component/common/FeatureStaleDialog/FeatureStaleDialog.tsx @@ -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} > - <> - - + ); }; diff --git a/frontend/src/component/feature/FeatureToggleList/FeatureToggleListItem/FeatureToggleListItem.tsx b/frontend/src/component/feature/FeatureToggleList/FeatureToggleListItem/FeatureToggleListItem.tsx index 1733d5c274..b2e6bbf20d 100644 --- a/frontend/src/component/feature/FeatureToggleList/FeatureToggleListItem/FeatureToggleListItem.tsx +++ b/frontend/src/component/feature/FeatureToggleList/FeatureToggleListItem/FeatureToggleListItem.tsx @@ -196,7 +196,7 @@ export const FeatureToggleListItem = memo( !projectExists() } onClick={reviveFeature} - tooltipProps={{ title: 'Revive feature' }} + tooltipProps={{ title: 'Revive feature toggle' }} > diff --git a/frontend/src/component/feature/FeatureView/FeatureView.tsx b/frontend/src/component/feature/FeatureView/FeatureView.tsx index a1da3d7c56..2d66d81db2 100644 --- a/frontend/src/component/feature/FeatureView/FeatureView.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureView.tsx @@ -144,7 +144,7 @@ export const FeatureView = () => { permission={UPDATE_FEATURE} projectId={projectId} tooltipProps={{ - title: 'Toggle stale status', + title: 'Toggle stale state', }} data-loading >