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(ui): rename ad-hoc upscale stuff to post-processing

Browse Source
This commit is contained in:
psychedelicious 2024-07-24 07:32:33 +10:00
parent 94b5b2a467
commit a26f050cbb
5 changed files with 76 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
invokeai/frontend/web/public/locales/en.json
View File

@ -636,9 +636,9 @@
"title": "Undo Stroke"
},
"unifiedCanvasHotkeys": "Unified Canvas",
"upscale": {
"desc": "Upscale the current image",
"title": "Upscale"
"postProcess": {
"desc": "Process the current image using the selected post-processing model",
"title": "Process Image"
},
"toggleViewer": {
"desc": "Switches between the Image Viewer and workspace for the current tab.",
@ -1035,8 +1035,8 @@
"symmetry": "Symmetry",
"tileSize": "Tile Size",
"type": "Type",
"upscale": "Upscale (Shift + U)",
"upscaleImage": "Upscale Image",
"postProcessing": "Post-Processing (Shift + U)",
"processImage": "Process Image",
"upscaling": "Upscaling",
"useAll": "Use All",
"useSize": "Use Size",
@ -1645,8 +1645,9 @@
"creativity": "Creativity",
"structure": "Structure",
"upscaleModel": "Upscale Model",
"postProcessingModel": "Post-Processing Model",
"scale": "Scale",
"simpleUpscaleMissingModelWarning": "Visit the <LinkComponent>Model Manager</LinkComponent> to install an upscale (image to image) model.",
"simpleUpscaleMissingModelWarning": "Visit the <LinkComponent>Model Manager</LinkComponent> to install a post-processing (image to image) model.",
"missingModelsWarning": "Visit the <LinkComponent>Model Manager</LinkComponent> to install the required models:",
"mainModelDesc": "Main model (SD1.5 or SDXL architecture)",
"tileControlNetModelDesc": "Tile ControlNet model for the chosen main model architecture",

57
invokeai/frontend/web/src/features/parameters/components/Upscale/ParamPostProcessingModel.tsx Normal file
View File

@ -0,0 +1,57 @@
import { Box, Combobox, FormControl, FormLabel, Tooltip } from '@invoke-ai/ui-library';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { useModelCombobox } from 'common/hooks/useModelCombobox';
import { simpleUpscaleModelChanged } from 'features/parameters/store/upscaleSlice';
import { memo, useCallback, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { useSpandrelImageToImageModels } from 'services/api/hooks/modelsByType';
import type { SpandrelImageToImageModelConfig } from 'services/api/types';
const ParamPostProcessingModel = () => {
const { t } = useTranslation();
const [modelConfigs, { isLoading }] = useSpandrelImageToImageModels();
const model = useAppSelector((s) => s.upscale.simpleUpscaleModel);
const dispatch = useAppDispatch();
const tooltipLabel = useMemo(() => {
if (!modelConfigs.length || !model) {
return;
}
return modelConfigs.find((m) => m.key === model?.key)?.description;
}, [modelConfigs, model]);
const _onChange = useCallback(
(v: SpandrelImageToImageModelConfig | null) => {
dispatch(simpleUpscaleModelChanged(v));
},
[dispatch]
);
const { options, value, onChange, placeholder, noOptionsMessage } = useModelCombobox({
modelConfigs,
onChange: _onChange,
selectedModel: model,
isLoading,
});
return (
<FormControl orientation="vertical">
<FormLabel>{t('upscaling.postProcessingModel')}</FormLabel>
<Tooltip label={tooltipLabel}>
<Box w="full">
<Combobox
value={value}
placeholder={placeholder}
options={options}
onChange={onChange}
noOptionsMessage={noOptionsMessage}
isDisabled={options.length === 0}
/>
</Box>
</Tooltip>
</FormControl>
);
};
export default memo(ParamPostProcessingModel);

18
invokeai/frontend/web/src/features/parameters/components/Upscale/ParamSpandrelModel.tsx
View File

@ -1,21 +1,17 @@
import { Box, Combobox, FormControl, FormLabel, Tooltip } from '@invoke-ai/ui-library';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { useModelCombobox } from 'common/hooks/useModelCombobox';
import { simpleUpscaleModelChanged, upscaleModelChanged } from 'features/parameters/store/upscaleSlice';
import { upscaleModelChanged } from 'features/parameters/store/upscaleSlice';
import { memo, useCallback, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { useSpandrelImageToImageModels } from 'services/api/hooks/modelsByType';
import type { SpandrelImageToImageModelConfig } from 'services/api/types';
interface Props {
isMultidiffusion: boolean;
}
const ParamSpandrelModel = ({ isMultidiffusion }: Props) => {
const ParamSpandrelModel = () => {
const { t } = useTranslation();
const [modelConfigs, { isLoading }] = useSpandrelImageToImageModels();
const model = useAppSelector((s) => (isMultidiffusion ? s.upscale.upscaleModel : s.upscale.simpleUpscaleModel));
const model = useAppSelector((s) => s.upscale.upscaleModel);
const dispatch = useAppDispatch();
const tooltipLabel = useMemo(() => {
@ -27,13 +23,9 @@ const ParamSpandrelModel = ({ isMultidiffusion }: Props) => {
const _onChange = useCallback(
(v: SpandrelImageToImageModelConfig | null) => {
if (isMultidiffusion) {
dispatch(upscaleModelChanged(v));
} else {
dispatch(simpleUpscaleModelChanged(v));
}
dispatch(upscaleModelChanged(v));
},
[isMultidiffusion, dispatch]
[dispatch]
);
const { options, value, onChange, placeholder, noOptionsMessage } = useModelCombobox({

10
invokeai/frontend/web/src/features/parameters/components/Upscale/ParamUpscaleSettings.tsx
View File

@ -12,6 +12,7 @@ import {
import { upscaleRequested } from 'app/store/middleware/listenerMiddleware/listeners/upscaleRequested';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { $installModelsTab } from 'features/modelManagerV2/subpanels/InstallModels';
import ParamPostProcessingModel from 'features/parameters/components/Upscale/ParamPostProcessingModel';
import { useIsQueueMutationInProgress } from 'features/queue/hooks/useIsQueueMutationInProgress';
import { setActiveTab } from 'features/ui/store/uiSlice';
import { memo, useCallback } from 'react';
@ -19,7 +20,6 @@ import { Trans, useTranslation } from 'react-i18next';
import { PiFrameCornersBold } from 'react-icons/pi';
import type { ImageDTO } from 'services/api/types';
import ParamSpandrelModel from './ParamSpandrelModel';
type Props = { imageDTO?: ImageDTO };
@ -43,19 +43,19 @@ const ParamUpscalePopover = (props: Props) => {
<Popover isOpen={isOpen} onClose={onClose} isLazy>
<PopoverTrigger>
<IconButton
tooltip={t('parameters.upscale')}
tooltip={t('parameters.postProcessing')}
onClick={onOpen}
icon={<PiFrameCornersBold />}
aria-label={t('parameters.upscale')}
aria-label={t('parameters.postProcessing')}
/>
</PopoverTrigger>
<PopoverContent>
<PopoverBody w={96}>
<Flex flexDirection="column" gap={4}>
<ParamSpandrelModel isMultidiffusion={false} />
<ParamPostProcessingModel />
{!simpleUpscaleModel && <MissingModelWarning />}
<Button size="sm" isDisabled={!imageDTO || inProgress || !simpleUpscaleModel} onClick={handleClickUpscale}>
{t('parameters.upscaleImage')}
{t('parameters.processImage')}
</Button>
</Flex>
</PopoverBody>

4
invokeai/frontend/web/src/features/system/components/HotkeysModal/useHotkeyData.ts
View File

@ -102,8 +102,8 @@ export const useHotkeyData = (): HotkeyGroup[] => {
hotkeys: [['A']],
},
{
title: t('hotkeys.upscale.title'),
desc: t('hotkeys.upscale.desc'),
title: t('hotkeys.postProcess.title'),
desc: t('hotkeys.postProcess.desc'),
hotkeys: [['Shift', 'U']],
},
{