simplify destination prop handling

This commit is contained in:
chainchompa 2024-07-31 18:06:22 -04:00
parent 31e270e32c
commit e78fb428f0
4 changed files with 9 additions and 37 deletions

View File

@ -17,6 +17,7 @@ import { configChanged } from 'features/system/store/configSlice';
import { languageSelector } from 'features/system/store/systemSelectors'; import { languageSelector } from 'features/system/store/systemSelectors';
import InvokeTabs from 'features/ui/components/InvokeTabs'; import InvokeTabs from 'features/ui/components/InvokeTabs';
import type { InvokeTabName } from 'features/ui/store/tabMap'; import type { InvokeTabName } from 'features/ui/store/tabMap';
import { setActiveTab } from 'features/ui/store/uiSlice';
import { AnimatePresence } from 'framer-motion'; import { AnimatePresence } from 'framer-motion';
import i18n from 'i18n'; import i18n from 'i18n';
import { size } from 'lodash-es'; import { size } from 'lodash-es';
@ -25,7 +26,6 @@ import { ErrorBoundary } from 'react-error-boundary';
import { useGetOpenAPISchemaQuery } from 'services/api/endpoints/appInfo'; import { useGetOpenAPISchemaQuery } from 'services/api/endpoints/appInfo';
import AppErrorBoundaryFallback from './AppErrorBoundaryFallback'; import AppErrorBoundaryFallback from './AppErrorBoundaryFallback';
import Destination from './Destination';
import PreselectedImage from './PreselectedImage'; import PreselectedImage from './PreselectedImage';
const DEFAULT_CONFIG = {}; const DEFAULT_CONFIG = {};
@ -70,6 +70,12 @@ const App = ({ config = DEFAULT_CONFIG, selectedImage, destination }: Props) =>
} }
}, [dispatch, config, logger]); }, [dispatch, config, logger]);
useEffect(() => {
if (destination) {
dispatch(setActiveTab(destination));
}
}, [dispatch, destination]);
useEffect(() => { useEffect(() => {
dispatch(appStarted()); dispatch(appStarted());
}, [dispatch]); }, [dispatch]);
@ -99,7 +105,6 @@ const App = ({ config = DEFAULT_CONFIG, selectedImage, destination }: Props) =>
<ChangeBoardModal /> <ChangeBoardModal />
<DynamicPromptsModal /> <DynamicPromptsModal />
<PreselectedImage selectedImage={selectedImage} /> <PreselectedImage selectedImage={selectedImage} />
<Destination destination={destination} />
</ErrorBoundary> </ErrorBoundary>
); );
}; };

View File

@ -1,14 +0,0 @@
import { useDestination } from 'features/parameters/hooks/useDestination';
import type { InvokeTabName } from 'features/ui/store/tabMap';
import { memo } from 'react';
type Props = {
destination: InvokeTabName | undefined;
};
const Destination = (props: Props) => {
useDestination(props.destination);
return null;
};
export default memo(Destination);

View File

@ -19,6 +19,7 @@ import type { PartialAppConfig } from 'app/types/invokeai';
import Loading from 'common/components/Loading/Loading'; import Loading from 'common/components/Loading/Loading';
import AppDndContext from 'features/dnd/components/AppDndContext'; import AppDndContext from 'features/dnd/components/AppDndContext';
import type { WorkflowCategory } from 'features/nodes/types/workflow'; import type { WorkflowCategory } from 'features/nodes/types/workflow';
import type { InvokeTabName } from 'features/ui/store/tabMap';
import type { PropsWithChildren, ReactNode } from 'react'; import type { PropsWithChildren, ReactNode } from 'react';
import React, { lazy, memo, useEffect, useMemo } from 'react'; import React, { lazy, memo, useEffect, useMemo } from 'react';
import { Provider } from 'react-redux'; import { Provider } from 'react-redux';
@ -43,7 +44,7 @@ interface Props extends PropsWithChildren {
imageName: string; imageName: string;
action: 'sendToImg2Img' | 'sendToCanvas' | 'useAllParameters'; action: 'sendToImg2Img' | 'sendToCanvas' | 'useAllParameters';
}; };
destination?: 'canvas' | 'workflows'; destination?: InvokeTabName;
customStarUi?: CustomStarUi; customStarUi?: CustomStarUi;
socketOptions?: Partial<ManagerOptions & SocketOptions>; socketOptions?: Partial<ManagerOptions & SocketOptions>;
isDebugging?: boolean; isDebugging?: boolean;

View File

@ -1,20 +0,0 @@
import { useAppDispatch } from 'app/store/storeHooks';
import type { InvokeTabName } from 'features/ui/store/tabMap';
import { setActiveTab } from 'features/ui/store/uiSlice';
import { useCallback, useEffect } from 'react';
export const useDestination = (destination: InvokeTabName | undefined) => {
const dispatch = useAppDispatch();
const handleSendToDestination = useCallback(() => {
if (destination) {
dispatch(setActiveTab(destination));
}
}, [dispatch, destination]);
useEffect(() => {
handleSendToDestination();
}, [destination, handleSendToDestination]);
return { handleSendToDestination };
};