mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
chore(ui): clean up unused files/packages
This commit is contained in:
psychedelicious
@ -1,67 +0,0 @@
|
||||
import { Flex, Icon, Image } from '@chakra-ui/react';
|
||||
import { createSelector } from '@reduxjs/toolkit';
|
||||
import { useAppSelector } from 'app/store/storeHooks';
|
||||
import { systemSelector } from 'features/system/store/systemSelectors';
|
||||
import { isEqual } from 'lodash-es';
|
||||
import { memo } from 'react';
|
||||
import { FaImage } from 'react-icons/fa';
|
||||
|
||||
const selector = createSelector(
|
||||
[systemSelector],
|
||||
(system) => {
|
||||
const { progressImage } = system;
|
||||
|
||||
return {
|
||||
progressImage,
|
||||
};
|
||||
},
|
||||
{
|
||||
memoizeOptions: {
|
||||
resultEqualityCheck: isEqual,
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
const ProgressImage = () => {
|
||||
const { progressImage } = useAppSelector(selector);
|
||||
return progressImage ? (
|
||||
<Flex
|
||||
sx={{
|
||||
position: 'relative',
|
||||
w: 'full',
|
||||
h: 'full',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
draggable={false}
|
||||
src={progressImage.dataURL}
|
||||
width={progressImage.width}
|
||||
height={progressImage.height}
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
objectFit: 'contain',
|
||||
maxWidth: '100%',
|
||||
maxHeight: '100%',
|
||||
height: 'auto',
|
||||
borderRadius: 'base',
|
||||
p: 2,
|
||||
}}
|
||||
/>
|
||||
</Flex>
|
||||
) : (
|
||||
<Flex
|
||||
sx={{
|
||||
w: 'full',
|
||||
h: 'full',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
}}
|
||||
>
|
||||
<Icon color="base.400" boxSize={32} as={FaImage} />
|
||||
</Flex>
|
||||
);
|
||||
};
|
||||
|
||||
export default memo(ProgressImage);
|
||||
@ -1,159 +0,0 @@
|
||||
import { Flex, Text } from '@chakra-ui/react';
|
||||
import { createSelector } from '@reduxjs/toolkit';
|
||||
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
|
||||
import { systemSelector } from 'features/system/store/systemSelectors';
|
||||
import { memo } from 'react';
|
||||
import { FaStopwatch } from 'react-icons/fa';
|
||||
import { uiSelector } from 'features/ui/store/uiSelectors';
|
||||
import IAIIconButton from 'common/components/IAIIconButton';
|
||||
import { CloseIcon } from '@chakra-ui/icons';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import {
|
||||
floatingProgressImageMoved,
|
||||
floatingProgressImageResized,
|
||||
setShouldShowProgressImages,
|
||||
} from 'features/ui/store/uiSlice';
|
||||
import { Rnd } from 'react-rnd';
|
||||
import { Rect } from 'features/ui/store/uiTypes';
|
||||
import { isEqual } from 'lodash-es';
|
||||
import ProgressImage from './ProgressImage';
|
||||
|
||||
const selector = createSelector(
|
||||
[systemSelector, uiSelector],
|
||||
(system, ui) => {
|
||||
const { isProcessing } = system;
|
||||
const {
|
||||
floatingProgressImageRect,
|
||||
shouldShowProgressImages,
|
||||
shouldAutoShowProgressImages,
|
||||
} = ui;
|
||||
|
||||
const showProgressWindow =
|
||||
shouldAutoShowProgressImages && isProcessing
|
||||
? true
|
||||
: shouldShowProgressImages;
|
||||
|
||||
return {
|
||||
floatingProgressImageRect,
|
||||
showProgressWindow,
|
||||
};
|
||||
},
|
||||
{
|
||||
memoizeOptions: {
|
||||
resultEqualityCheck: isEqual,
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
const ProgressImagePreview = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const { showProgressWindow, floatingProgressImageRect } =
|
||||
useAppSelector(selector);
|
||||
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<>
|
||||
<IAIIconButton
|
||||
onClick={() =>
|
||||
dispatch(setShouldShowProgressImages(!showProgressWindow))
|
||||
}
|
||||
tooltip={t('ui.showProgressImages')}
|
||||
isChecked={showProgressWindow}
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
bottom: 4,
|
||||
insetInlineStart: 4,
|
||||
}}
|
||||
aria-label={t('ui.showProgressImages')}
|
||||
icon={<FaStopwatch />}
|
||||
/>
|
||||
{showProgressWindow && (
|
||||
<Rnd
|
||||
bounds="window"
|
||||
minHeight={200}
|
||||
minWidth={200}
|
||||
size={{
|
||||
width: floatingProgressImageRect.width,
|
||||
height: floatingProgressImageRect.height,
|
||||
}}
|
||||
position={{
|
||||
x: floatingProgressImageRect.x,
|
||||
y: floatingProgressImageRect.y,
|
||||
}}
|
||||
onDragStop={(e, d) => {
|
||||
dispatch(floatingProgressImageMoved({ x: d.x, y: d.y }));
|
||||
}}
|
||||
onResizeStop={(e, direction, ref, delta, position) => {
|
||||
const newRect: Partial<Rect> = {};
|
||||
|
||||
if (ref.style.width) {
|
||||
newRect.width = ref.style.width;
|
||||
}
|
||||
if (ref.style.height) {
|
||||
newRect.height = ref.style.height;
|
||||
}
|
||||
if (position.x) {
|
||||
newRect.x = position.x;
|
||||
}
|
||||
if (position.x) {
|
||||
newRect.y = position.y;
|
||||
}
|
||||
|
||||
dispatch(floatingProgressImageResized(newRect));
|
||||
}}
|
||||
>
|
||||
<Flex
|
||||
sx={{
|
||||
position: 'relative',
|
||||
w: 'full',
|
||||
h: 'full',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
flexDir: 'column',
|
||||
boxShadow: 'dark-lg',
|
||||
bg: 'base.800',
|
||||
borderRadius: 'base',
|
||||
}}
|
||||
>
|
||||
<Flex
|
||||
sx={{
|
||||
w: 'full',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
p: 1.5,
|
||||
pl: 4,
|
||||
pr: 3,
|
||||
bg: 'base.700',
|
||||
borderTopRadius: 'base',
|
||||
}}
|
||||
>
|
||||
<Flex
|
||||
sx={{
|
||||
flexGrow: 1,
|
||||
userSelect: 'none',
|
||||
cursor: 'move',
|
||||
}}
|
||||
>
|
||||
<Text fontSize="sm" fontWeight={500}>
|
||||
Progress Images
|
||||
</Text>
|
||||
</Flex>
|
||||
<IAIIconButton
|
||||
onClick={() => dispatch(setShouldShowProgressImages(false))}
|
||||
aria-label={t('ui.hideProgressImages')}
|
||||
size="xs"
|
||||
icon={<CloseIcon />}
|
||||
variant="ghost"
|
||||
/>
|
||||
</Flex>
|
||||
<ProgressImage />
|
||||
</Flex>
|
||||
</Rnd>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default memo(ProgressImagePreview);
|
||||
@ -1,97 +0,0 @@
|
||||
import type { PayloadAction } from '@reduxjs/toolkit';
|
||||
import { createSlice } from '@reduxjs/toolkit';
|
||||
|
||||
export interface HiresState {
|
||||
codeformerFidelity: number;
|
||||
facetoolStrength: number;
|
||||
facetoolType: FacetoolType;
|
||||
hiresFix: boolean;
|
||||
hiresStrength: number;
|
||||
shouldLoopback: boolean;
|
||||
shouldRunESRGAN: boolean;
|
||||
shouldRunFacetool: boolean;
|
||||
upscalingLevel: UpscalingLevel;
|
||||
upscalingDenoising: number;
|
||||
upscalingStrength: number;
|
||||
}
|
||||
|
||||
export const initialHiresState: HiresState = {
|
||||
codeformerFidelity: 0.75,
|
||||
facetoolStrength: 0.75,
|
||||
facetoolType: 'gfpgan',
|
||||
hiresFix: false,
|
||||
hiresStrength: 0.75,
|
||||
hiresSteps: 30,
|
||||
hiresWidth: 512,
|
||||
hiresHeight: 512,
|
||||
hiresModel: '',
|
||||
shouldLoopback: false,
|
||||
shouldRunESRGAN: false,
|
||||
shouldRunFacetool: false,
|
||||
upscalingLevel: 4,
|
||||
upscalingDenoising: 0.75,
|
||||
upscalingStrength: 0.75,
|
||||
};
|
||||
|
||||
export const postprocessingSlice = createSlice({
|
||||
name: 'postprocessing',
|
||||
initialState: initialPostprocessingState,
|
||||
reducers: {
|
||||
setFacetoolStrength: (state, action: PayloadAction<number>) => {
|
||||
state.facetoolStrength = action.payload;
|
||||
},
|
||||
setCodeformerFidelity: (state, action: PayloadAction<number>) => {
|
||||
state.codeformerFidelity = action.payload;
|
||||
},
|
||||
setUpscalingLevel: (state, action: PayloadAction<UpscalingLevel>) => {
|
||||
state.upscalingLevel = action.payload;
|
||||
},
|
||||
setUpscalingDenoising: (state, action: PayloadAction<number>) => {
|
||||
state.upscalingDenoising = action.payload;
|
||||
},
|
||||
setUpscalingStrength: (state, action: PayloadAction<number>) => {
|
||||
state.upscalingStrength = action.payload;
|
||||
},
|
||||
setHiresFix: (state, action: PayloadAction<boolean>) => {
|
||||
state.hiresFix = action.payload;
|
||||
},
|
||||
setHiresStrength: (state, action: PayloadAction<number>) => {
|
||||
state.hiresStrength = action.payload;
|
||||
},
|
||||
resetPostprocessingState: (state) => {
|
||||
return {
|
||||
...state,
|
||||
...initialPostprocessingState,
|
||||
};
|
||||
},
|
||||
setShouldRunFacetool: (state, action: PayloadAction<boolean>) => {
|
||||
state.shouldRunFacetool = action.payload;
|
||||
},
|
||||
setFacetoolType: (state, action: PayloadAction<FacetoolType>) => {
|
||||
state.facetoolType = action.payload;
|
||||
},
|
||||
setShouldRunESRGAN: (state, action: PayloadAction<boolean>) => {
|
||||
state.shouldRunESRGAN = action.payload;
|
||||
},
|
||||
setShouldLoopback: (state, action: PayloadAction<boolean>) => {
|
||||
state.shouldLoopback = action.payload;
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export const {
|
||||
resetPostprocessingState,
|
||||
setCodeformerFidelity,
|
||||
setFacetoolStrength,
|
||||
setFacetoolType,
|
||||
setHiresFix,
|
||||
setHiresStrength,
|
||||
setShouldLoopback,
|
||||
setShouldRunESRGAN,
|
||||
setShouldRunFacetool,
|
||||
setUpscalingLevel,
|
||||
setUpscalingDenoising,
|
||||
setUpscalingStrength,
|
||||
} = postprocessingSlice.actions;
|
||||
|
||||
export default postprocessingSlice.reducer;
|
||||
Reference in New Issue
Block a user