diff --git a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetModel.tsx b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetModel.tsx index a9525a0450..e17eb6a54b 100644 --- a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetModel.tsx +++ b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetModel.tsx @@ -1,10 +1,6 @@ import { createSelector } from '@reduxjs/toolkit'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; -import IAICustomSelect, { - IAICustomSelectOption, -} from 'common/components/IAICustomSelect'; import IAIMantineSelect from 'common/components/IAIMantineSelect'; -import IAISelect from 'common/components/IAISelect'; import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke'; import { CONTROLNET_MODELS, @@ -13,7 +9,7 @@ import { import { controlNetModelChanged } from 'features/controlNet/store/controlNetSlice'; import { configSelector } from 'features/system/store/configSelectors'; import { map } from 'lodash-es'; -import { ChangeEvent, memo, useCallback } from 'react'; +import { memo, useCallback } from 'react'; type ParamControlNetModelProps = { controlNetId: string; @@ -24,15 +20,14 @@ const selector = createSelector(configSelector, (config) => { return map(CONTROLNET_MODELS, (m) => ({ label: m.label, value: m.type, - })).filter((d) => !config.sd.disabledControlNetModels.includes(d.value)); + })).filter( + (d) => + !config.sd.disabledControlNetModels.includes( + d.value as ControlNetModelName + ) + ); }); -const DATA = map(CONTROLNET_MODELS, (m) => ({ - value: m.type, - label: m.label, - tooltip: m.type, -})); - const ParamControlNetModel = (props: ParamControlNetModelProps) => { const { controlNetId, model } = props; const controlNetModels = useAppSelector(selector); @@ -57,18 +52,6 @@ const ParamControlNetModel = (props: ParamControlNetModelProps) => { tooltip={model} /> ); - // return ( - // - // ); }; export default memo(ParamControlNetModel); diff --git a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetProcessorSelect.tsx b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetProcessorSelect.tsx index f692198ae6..328bd56673 100644 --- a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetProcessorSelect.tsx +++ b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetProcessorSelect.tsx @@ -1,10 +1,8 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; -import IAIMantineSelect, { - IAISelectDataType, -} from 'common/components/IAIMantineSelect'; +import IAIMantineSelect from 'common/components/IAIMantineSelect'; import { map } from 'lodash-es'; -import { ChangeEvent, memo, useCallback } from 'react'; +import { memo, useCallback } from 'react'; import { CONTROLNET_PROCESSORS } from '../../store/constants'; import { controlNetProcessorTypeChanged } from '../../store/controlNetSlice'; import { @@ -14,60 +12,38 @@ import { import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke'; import { createSelector } from '@reduxjs/toolkit'; import { configSelector } from 'features/system/store/configSelectors'; +import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions'; type ParamControlNetProcessorSelectProps = { controlNetId: string; processorNode: ControlNetProcessorNode; }; -const CONTROLNET_PROCESSOR_TYPES: IAISelectDataType[] = map( - CONTROLNET_PROCESSORS, - (p) => ({ - value: p.type, - label: p.label, - tooltip: p.description, - }) -).sort((a, b) => - // sort 'none' to the top - a.value === 'none' - ? -1 - : b.value === 'none' - ? 1 - : a.label.localeCompare(b.label) +const selector = createSelector( + configSelector, + (config) => { + return map(CONTROLNET_PROCESSORS, (p) => ({ + value: p.type, + key: p.label, + })) + .sort((a, b) => + // sort 'none' to the top + a.value === 'none' + ? -1 + : b.value === 'none' + ? 1 + : a.key.localeCompare(b.key) + ) + .filter( + (d) => + !config.sd.disabledControlNetProcessors.includes( + d.value as ControlNetProcessorType + ) + ); + }, + defaultSelectorOptions ); -const selector = createSelector(configSelector, (config) => { - return map(CONTROLNET_PROCESSORS, (p) => ({ - value: p.type, - key: p.label, - })) - .sort((a, b) => - // sort 'none' to the top - a.value === 'none' - ? -1 - : b.value === 'none' - ? 1 - : a.key.localeCompare(b.key) - ) - .filter((d) => !config.sd.disabledControlNetProcessors.includes(d.value)); -}); - -// const CONTROLNET_PROCESSOR_TYPES: IAICustomSelectOption[] = map( -// CONTROLNET_PROCESSORS, -// (p) => ({ -// value: p.type, -// label: p.label, -// tooltip: p.description, -// }) -// ).sort((a, b) => -// // sort 'none' to the top -// a.value === 'none' -// ? -1 -// : b.value === 'none' -// ? 1 -// : a.label.localeCompare(b.label) -// ); - const ParamControlNetProcessorSelect = ( props: ParamControlNetProcessorSelectProps ) => { @@ -76,17 +52,6 @@ const ParamControlNetProcessorSelect = ( const isReady = useIsReadyToInvoke(); const controlNetProcessors = useAppSelector(selector); - // const handleProcessorTypeChanged = useCallback( - // (e: ChangeEvent) => { - // dispatch( - // controlNetProcessorTypeChanged({ - // controlNetId, - // processorType: e.target.value as ControlNetProcessorType, - // }) - // ); - // }, - // [controlNetId, dispatch] - // ); const handleProcessorTypeChanged = useCallback( (v: string | null) => { dispatch( @@ -108,16 +73,6 @@ const ParamControlNetProcessorSelect = ( disabled={!isReady} /> ); - // return ( - // - // ); }; export default memo(ParamControlNetProcessorSelect); diff --git a/invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamScheduler.tsx b/invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamScheduler.tsx index 66d712209d..e276ba2302 100644 --- a/invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamScheduler.tsx +++ b/invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamScheduler.tsx @@ -6,19 +6,13 @@ import IAIMantineSelect from 'common/components/IAIMantineSelect'; import { generationSelector } from 'features/parameters/store/generationSelectors'; import { setScheduler } from 'features/parameters/store/generationSlice'; import { uiSelector } from 'features/ui/store/uiSelectors'; -import { ChangeEvent, memo, useCallback } from 'react'; +import { memo, useCallback } from 'react'; import { useTranslation } from 'react-i18next'; const selector = createSelector( [uiSelector, generationSelector], (ui, generation) => { - // TODO: DPMSolverSinglestepScheduler is fixed in https://github.com/huggingface/diffusers/pull/3413 - // but we need to wait for the next release before removing this special handling. - const allSchedulers = ui.schedulers - .filter((scheduler) => { - return !['dpmpp_2s'].includes(scheduler); - }) - .sort((a, b) => a.localeCompare(b)); + const allSchedulers = ui.schedulers.sort((a, b) => a.localeCompare(b)); return { scheduler: generation.scheduler, @@ -35,39 +29,23 @@ const ParamScheduler = () => { const { t } = useTranslation(); const handleChange = useCallback( - (e: ChangeEvent) => { - dispatch(setScheduler(e.target.value as Scheduler)); + (v: string | null) => { + if (!v) { + return; + } + dispatch(setScheduler(v as Scheduler)); }, [dispatch] ); - // const handleChange = useCallback( - // (v: string | null | undefined) => { - // if (!v) { - // return; - // } - // dispatch(setScheduler(v as Scheduler)); - // }, - // [dispatch] - // ); return ( ); - - // return ( - // - // ); }; export default memo(ParamScheduler); diff --git a/invokeai/frontend/web/src/features/system/components/ModelSelect.tsx b/invokeai/frontend/web/src/features/system/components/ModelSelect.tsx index a0293361da..a38ab150dd 100644 --- a/invokeai/frontend/web/src/features/system/components/ModelSelect.tsx +++ b/invokeai/frontend/web/src/features/system/components/ModelSelect.tsx @@ -23,13 +23,6 @@ const selector = createSelector( label: m.name, })) .sort((a, b) => a.label.localeCompare(b.label)); - // const modelData = selectModelsAll(state) - // .map((m) => ({ - // value: m.name, - // label: m.name, - // tooltip: m.description, - // })) - // .sort((a, b) => a.label.localeCompare(b.label)); return { selectedModel, modelData, @@ -46,12 +39,6 @@ const ModelSelect = () => { const dispatch = useAppDispatch(); const { t } = useTranslation(); const { selectedModel, modelData } = useAppSelector(selector); - // const handleChangeModel = useCallback( - // (e: ChangeEvent) => { - // dispatch(modelSelected(e.target.value)); - // }, - // [dispatch] - // ); const handleChangeModel = useCallback( (v: string | null) => { if (!v) { @@ -72,18 +59,6 @@ const ModelSelect = () => { onChange={handleChangeModel} /> ); - - // return ( - // - // ); }; export default memo(ModelSelect);