Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: Add Image Count to Board Name

Browse Source
This commit is contained in:
blessedcoolant 2023-07-21 00:54:03 +12:00 committed by psychedelicious
parent 9e27fd9b90
commit 8dfe196c4f
1 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
invokeai/frontend/web/src/features/gallery/components/GalleryBoardName.tsx
View File

@ -6,6 +6,7 @@ import { useAppSelector } from 'app/store/storeHooks';
import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions'; import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
import { memo, useMemo } from 'react'; import { memo, useMemo } from 'react';
import { useBoardName } from 'services/api/hooks/useBoardName'; import { useBoardName } from 'services/api/hooks/useBoardName';
import { useBoardTotal } from 'services/api/hooks/useBoardTotal';
const selector = createSelector( const selector = createSelector(
[stateSelector], [stateSelector],
@ -26,12 +27,17 @@ const GalleryBoardName = (props: Props) => {
const { isOpen, onToggle } = props; const { isOpen, onToggle } = props;
const { selectedBoardId } = useAppSelector(selector); const { selectedBoardId } = useAppSelector(selector);
const boardName = useBoardName(selectedBoardId); const boardName = useBoardName(selectedBoardId);
const numOfBoardImages = useBoardTotal(selectedBoardId);
const formattedBoardName = useMemo(() => { const formattedBoardName = useMemo(() => {
if (boardName.length > 20) { if (!boardName || !numOfBoardImages) {
return `${boardName.substring(0, 20)}...`; return '';
} }
return boardName; if (boardName.length > 20) {
}, [boardName]); return `${boardName.substring(0, 20)}... (${numOfBoardImages})`;
}
return `${boardName} (${numOfBoardImages})`;
}, [boardName, numOfBoardImages]);
return ( return (
<Flex <Flex