only show selected when greater than 0

This commit is contained in:
Mary Hipp 2024-06-24 14:41:14 -04:00 committed by psychedelicious
parent afb0651f91
commit bdff5c4e87

View File

@ -1,4 +1,4 @@
import { Flex, IconButton, Tag, TagCloseButton, TagLabel, Tooltip } from '@invoke-ai/ui-library'; import { Flex, IconButton, Spacer, Tag, TagCloseButton, TagLabel, Tooltip } from '@invoke-ai/ui-library';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { useGalleryImages } from 'features/gallery/hooks/useGalleryImages'; import { useGalleryImages } from 'features/gallery/hooks/useGalleryImages';
import { selectionChanged } from 'features/gallery/store/gallerySlice'; import { selectionChanged } from 'features/gallery/store/gallerySlice';
@ -22,16 +22,18 @@ export const GalleryBulkSelect = () => {
return ( return (
<Flex alignItems="center" justifyContent="space-between"> <Flex alignItems="center" justifyContent="space-between">
{selection.length > 0 ? (
<Tag> <Tag>
<TagLabel> <TagLabel>
{selection.length} {t('common.selected')} {selection.length} {t('common.selected')}
</TagLabel> </TagLabel>
{selection.length > 0 && (
<Tooltip label="Clear selection"> <Tooltip label="Clear selection">
<TagCloseButton onClick={onClickClearSelection} /> <TagCloseButton onClick={onClickClearSelection} />
</Tooltip> </Tooltip>
)}
</Tag> </Tag>
) : (
<Spacer />
)}
<Tooltip label={t('gallery.selectAllOnPage')}> <Tooltip label={t('gallery.selectAllOnPage')}>
<IconButton <IconButton