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

fix(ui): duplicate gallery in nodes editor

Browse Source
This commit is contained in:
psychedelicious 2023-05-09 18:27:16 +10:00
parent 279468c0e8
commit 15e57e3a3d
1 changed files with 1 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
invokeai/frontend/web/src/features/ui/components/tabs/Nodes/NodesTab.tsx
View File

@ -1,65 +1,8 @@
import { TabPanel } from '@chakra-ui/react';
import { memo } from 'react';
import { Panel, PanelGroup, PanelResizeHandle } from 'react-resizable-panels';
import PinParametersPanelButton from '../../PinParametersPanelButton';
import ImageGalleryContent from 'features/gallery/components/ImageGalleryContent';
import { createSelector } from '@reduxjs/toolkit';
import { uiSelector } from 'features/ui/store/uiSelectors';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { requestCanvasRescale } from 'features/canvas/store/thunks/requestCanvasScale';
import ResizeHandle from '../ResizeHandle';
import NodeEditor from 'features/nodes/components/NodeEditor';
const selector = createSelector(uiSelector, (ui) => {
const {
shouldPinGallery,
shouldShowGallery,
shouldPinParametersPanel,
shouldShowParametersPanel,
} = ui;
return {
shouldPinGallery,
shouldShowGallery,
shouldPinParametersPanel,
shouldShowParametersPanel,
};
});
const NodesTab = () => {
const dispatch = useAppDispatch();
const {
shouldPinGallery,
shouldShowGallery,
shouldPinParametersPanel,
shouldShowParametersPanel,
} = useAppSelector(selector);
return (
<PanelGroup
autoSaveId="nodesTab"
direction="horizontal"
style={{ height: '100%', width: '100%' }}
>
<Panel
order={1}
minSize={30}
onResize={() => {
dispatch(requestCanvasRescale());
}}
>
<NodeEditor />
</Panel>
{shouldPinGallery && shouldShowGallery && (
<>
<ResizeHandle />
<Panel order={2} defaultSize={10} minSize={10} collapsible={true}>
<ImageGalleryContent />
</Panel>
</>
)}
</PanelGroup>
);
return <NodeEditor />;
};
export default memo(NodesTab);