mirror of
https://github.com/invoke-ai/InvokeAI.git
synced 2026-02-19 04:04:22 -05:00
This introduces the core functionality for batch operations on images and multiple selection in the gallery/batch manager. A number of other substantial changes are included: - `imagesSlice` is consolidated into `gallerySlice`, allowing for simpler selection of filtered images - `batchSlice` is added to manage the batch - The wonky context pattern for image deletion has been changed, much simpler now using a `imageDeletionSlice` and redux listeners; this needs to be implemented still for the other image modals - Minimum gallery size in px implemented as a hook - Many style fixes & several bug fixes TODO: - The UI and UX need to be figured out, especially for controlnet - Batch processing is not hooked up; generation does not do anything with batch - Routes to support batch image operations, specifically delete and add/remove to/from boards
59 lines
1.5 KiB
TypeScript
59 lines
1.5 KiB
TypeScript
import { Box, Flex } from '@chakra-ui/react';
|
|
import { createSelector } from '@reduxjs/toolkit';
|
|
import { useAppSelector } from 'app/store/storeHooks';
|
|
import { PropsWithChildren, memo } from 'react';
|
|
import { PARAMETERS_PANEL_WIDTH } from 'theme/util/constants';
|
|
import { uiSelector } from '../store/uiSelectors';
|
|
import PinParametersPanelButton from './PinParametersPanelButton';
|
|
import OverlayScrollable from './common/OverlayScrollable';
|
|
|
|
const selector = createSelector(uiSelector, (ui) => {
|
|
const { shouldPinParametersPanel, shouldShowParametersPanel } = ui;
|
|
|
|
return {
|
|
shouldPinParametersPanel,
|
|
shouldShowParametersPanel,
|
|
};
|
|
});
|
|
|
|
type ParametersPinnedWrapperProps = PropsWithChildren;
|
|
|
|
const ParametersPinnedWrapper = (props: ParametersPinnedWrapperProps) => {
|
|
const { shouldPinParametersPanel, shouldShowParametersPanel } =
|
|
useAppSelector(selector);
|
|
|
|
if (!(shouldPinParametersPanel && shouldShowParametersPanel)) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<Box
|
|
sx={{
|
|
position: 'relative',
|
|
h: 'full',
|
|
w: PARAMETERS_PANEL_WIDTH,
|
|
flexShrink: 0,
|
|
}}
|
|
>
|
|
<Flex
|
|
sx={{
|
|
gap: 2,
|
|
flexDirection: 'column',
|
|
h: 'full',
|
|
w: 'full',
|
|
position: 'absolute',
|
|
overflowY: 'auto',
|
|
}}
|
|
>
|
|
{props.children}
|
|
</Flex>
|
|
|
|
<PinParametersPanelButton
|
|
sx={{ position: 'absolute', top: 0, insetInlineEnd: 0 }}
|
|
/>
|
|
</Box>
|
|
);
|
|
};
|
|
|
|
export default memo(ParametersPinnedWrapper);
|