github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-01-15 06:18:03 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): workflow library overflow

Browse Source
This commit is contained in:
psychedelicious
2025-03-06 14:12:55 +10:00
parent ec6cea6705
commit 93ec9a048f
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
invokeai/frontend/web/src/features/nodes/components/sidePanel/workflow/WorkflowLibrary/WorkflowLibrarySideNav.tsx
View File

@@ -1,5 +1,5 @@
import type { ButtonProps, CheckboxProps } from '@invoke-ai/ui-library';
import { Box, Button, Checkbox, Collapse, Flex, Spacer, Text } from '@invoke-ai/ui-library';
import { Button, Checkbox, Collapse, Flex, Spacer, Text } from '@invoke-ai/ui-library';
import { useStore } from '@nanostores/react';
import { $workflowCategories } from 'app/store/nanostores/workflowCategories';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
@@ -66,7 +66,7 @@ export const WorkflowLibrarySideNav = () => {
return (
<Flex flexDir="column" h="full">
<Box w="full" pb={2}>
<Flex w="full" pb={2}>
<CategoryButton isSelected={isYourWorkflowsSelected} onClick={selectYourWorkflows}>
{t('workflows.yourWorkflows')}
</CategoryButton>
@@ -96,13 +96,13 @@ export const WorkflowLibrarySideNav = () => {
</Flex>
</Collapse>
)}
</Box>
<Box w="full">
</Flex>
<Flex w="full" h="full" minH={0} overflow="hidden" flexDir="column">
<CategoryButton isSelected={isDefaultWorkflowsExclusivelySelected} onClick={selectDefaultWorkflows}>
{t('workflows.browseWorkflows')}
</CategoryButton>
<Collapse in={isDefaultWorkflowsExclusivelySelected}>
<Flex flexDir="column" gap={2} pl={4} py={2} overflow="hidden">
<Flex flexDir="column" gap={2} pl={4} py={2} overflow="hidden" h="100%" minH={0}>
<Button
isDisabled={!isDefaultWorkflowsExclusivelySelected || selectedTags.length === 0}
onClick={resetTags}
@@ -128,7 +128,7 @@ export const WorkflowLibrarySideNav = () => {
</Flex>
</Flex>
</Collapse>
</Box>
</Flex>
</Flex>
);
};