mirror of
https://github.com/Unleash/unleash.git
synced 2024-12-22 19:07:54 +01:00
feat: feature table tags (#5659)
- tags on project overview - refactor of tags cell
This commit is contained in:
parent
d429f51cbd
commit
50ff36cbce
@ -1,5 +1,5 @@
|
||||
import { VFC } from 'react';
|
||||
import { FeatureSchema } from 'openapi';
|
||||
import { FeatureSchema, TagSchema } from 'openapi';
|
||||
import { styled, Typography } from '@mui/material';
|
||||
import { TextCell } from '../TextCell/TextCell';
|
||||
import { Highlighter } from 'component/common/Highlighter/Highlighter';
|
||||
@ -14,21 +14,25 @@ interface IFeatureTagCellProps {
|
||||
row: {
|
||||
original: FeatureSchema;
|
||||
};
|
||||
value: string;
|
||||
}
|
||||
|
||||
export const FeatureTagCell: VFC<IFeatureTagCellProps> = ({ row, value }) => {
|
||||
export const FeatureTagCell: VFC<IFeatureTagCellProps> = ({ row }) => {
|
||||
const { searchQuery } = useSearchHighlightContext();
|
||||
|
||||
if (!row.original.tags || row.original.tags.length === 0)
|
||||
return <TextCell />;
|
||||
|
||||
const value =
|
||||
row.original.tags
|
||||
?.map(({ type, value }) => `${type}:${value}`)
|
||||
.join('\n') || '';
|
||||
|
||||
return (
|
||||
<TextCell>
|
||||
<TooltipLink
|
||||
highlighted={
|
||||
searchQuery.length > 0 &&
|
||||
value.toLowerCase().includes(searchQuery.toLowerCase())
|
||||
value?.toLowerCase().includes(searchQuery.toLowerCase())
|
||||
}
|
||||
tooltip={
|
||||
<>
|
||||
|
@ -197,9 +197,7 @@ const FeatureToggleListTableComponent: VFC = () => {
|
||||
.join('\n') || '',
|
||||
{
|
||||
header: 'Tags',
|
||||
cell: ({ getValue, row }) => (
|
||||
<FeatureTagCell value={getValue()} row={row} />
|
||||
),
|
||||
cell: FeatureTagCell,
|
||||
enableSorting: false,
|
||||
},
|
||||
),
|
||||
|
@ -49,6 +49,7 @@ import { useDefaultColumnVisibility } from './hooks/useDefaultColumnVisibility';
|
||||
import { Placeholder } from './TablePlaceholder/TablePlaceholder';
|
||||
import { useRowActions } from './hooks/useRowActions';
|
||||
import { useUiFlag } from 'hooks/useUiFlag';
|
||||
import { FeatureTagCell } from 'component/common/Table/cells/FeatureTagCell/FeatureTagCell';
|
||||
|
||||
interface IPaginatedProjectFeatureTogglesProps {
|
||||
environments: IProject['environments'];
|
||||
@ -208,6 +209,14 @@ export const PaginatedProjectFeatureToggles = ({
|
||||
width: '50%',
|
||||
},
|
||||
}),
|
||||
columnHelper.accessor('tags', {
|
||||
id: 'tags',
|
||||
header: 'Tags',
|
||||
cell: FeatureTagCell,
|
||||
meta: {
|
||||
width: '1%',
|
||||
},
|
||||
}),
|
||||
columnHelper.accessor('createdAt', {
|
||||
id: 'createdAt',
|
||||
header: 'Created',
|
||||
@ -396,6 +405,11 @@ export const PaginatedProjectFeatureToggles = ({
|
||||
isVisible: columnVisibility.name,
|
||||
isStatic: true,
|
||||
},
|
||||
{
|
||||
header: 'Tags',
|
||||
id: 'tags',
|
||||
isVisible: columnVisibility.tags,
|
||||
},
|
||||
{
|
||||
header: 'Created',
|
||||
id: 'createdAt',
|
||||
|
@ -57,6 +57,7 @@ export const useDefaultColumnVisibility = (allColumnIds: string[]) => {
|
||||
'lastSeenAt',
|
||||
'createdAt',
|
||||
'type',
|
||||
...showEnvironments(3),
|
||||
'tags',
|
||||
...showEnvironments(2),
|
||||
]);
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user