1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-09-28 17:55:15 +02:00

feat: remove sort by user on flags overview (#9826)

We don't aggregate all users, for filters on flags overview. Let's drop this filter
This commit is contained in:
Tymoteusz Czech 2025-04-24 13:37:30 +02:00 committed by GitHub
parent f6eb572a14
commit a38bf8ea4c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 32 additions and 30 deletions

View File

@ -102,11 +102,6 @@ export const FeatureToggleListTable: FC = () => {
tableState, tableState,
setTableState, setTableState,
); );
const onAvatarClick = useTableStateFilter(
['createdBy', 'IS'],
tableState,
setTableState,
);
const { projects } = useProjects(); const { projects } = useProjects();
const bodyLoadingRef = useLoading(loading); const bodyLoadingRef = useLoading(loading);
@ -172,7 +167,7 @@ export const FeatureToggleListTable: FC = () => {
columnHelper.accessor('createdBy', { columnHelper.accessor('createdBy', {
id: 'createdBy', id: 'createdBy',
header: 'By', header: 'By',
cell: AvatarCell(onAvatarClick), cell: AvatarCell(),
meta: { width: '1%', align: 'center' }, meta: { width: '1%', align: 'center' },
enableSorting: false, enableSorting: false,
}), }),
@ -347,12 +342,11 @@ export const FeatureToggleListTable: FC = () => {
], ],
[tableState.favoritesFirst], [tableState.favoritesFirst],
); );
const data = useMemo( const data = useMemo<FeatureSearchResponseSchema[]>(
() => () =>
features?.length === 0 && loading ? featuresPlaceholder : features, features?.length === 0 && loading ? featuresPlaceholder : features,
[initialLoad, features, loading], [initialLoad, features, loading],
); );
const table = useReactTable( const table = useReactTable(
withTableState(tableState, setTableState, { withTableState(tableState, setTableState, {
columns, columns,

View File

@ -41,12 +41,12 @@ const StyledAvatar = styled(UserAvatar)(({ theme }) => ({
})); }));
export const AvatarCell = export const AvatarCell =
(onAvatarClick: (userId: number) => void): FC<AvatarCellProps> => (onAvatarClick?: (userId: number) => void): FC<AvatarCellProps> =>
({ row: { original } }) => { ({ row: { original } }) => {
const ariaDisabled = original.createdBy.id === 0; const ariaDisabled = original.createdBy.id === 0;
const clickAction = ariaDisabled const clickAction = ariaDisabled
? () => {} ? () => {}
: () => onAvatarClick(original.createdBy.id); : () => onAvatarClick?.(original.createdBy.id);
const tooltipContent = ariaDisabled ? ( const tooltipContent = ariaDisabled ? (
<> <>
<p>{original.createdBy.name}</p> <p>{original.createdBy.name}</p>
@ -58,20 +58,13 @@ export const AvatarCell =
<p>{original.createdBy.name}</p> <p>{original.createdBy.name}</p>
); );
return ( const content = (
<StyledContainer> <>
<HtmlTooltip arrow describeChild title={tooltipContent}>
<StyledAvatarButton
aria-disabled={ariaDisabled}
onClick={clickAction}
>
<ScreenReaderOnly> <ScreenReaderOnly>
<span> <span>
Show only flags created by{' '} Show only flags created by {original.createdBy.name}
{original.createdBy.name}
</span> </span>
</ScreenReaderOnly> </ScreenReaderOnly>
<StyledAvatar <StyledAvatar
disableTooltip disableTooltip
user={{ user={{
@ -80,7 +73,22 @@ export const AvatarCell =
imageUrl: original.createdBy.imageUrl, imageUrl: original.createdBy.imageUrl,
}} }}
/> />
</>
);
return (
<StyledContainer>
<HtmlTooltip arrow describeChild title={tooltipContent}>
{onAvatarClick ? (
<StyledAvatarButton
aria-disabled={ariaDisabled}
onClick={clickAction}
>
{content}
</StyledAvatarButton> </StyledAvatarButton>
) : (
<div>{content}</div>
)}
</HtmlTooltip> </HtmlTooltip>
</StyledContainer> </StyledContainer>
); );