diff --git a/invokeai/frontend/web/public/locales/en.json b/invokeai/frontend/web/public/locales/en.json index 173cd1fa51..f169b742e8 100644 --- a/invokeai/frontend/web/public/locales/en.json +++ b/invokeai/frontend/web/public/locales/en.json @@ -679,6 +679,7 @@ "swapSizes": "Swap Sizes" }, "nodes": { + "reloadSchema": "Reload Schema", "saveNodes": "Save Nodes", "loadNodes": "Load Nodes" } diff --git a/invokeai/frontend/web/src/features/nodes/components/panels/TopCenterPanel.tsx b/invokeai/frontend/web/src/features/nodes/components/panels/TopCenterPanel.tsx index fab68d7599..10e59f2af9 100644 --- a/invokeai/frontend/web/src/features/nodes/components/panels/TopCenterPanel.tsx +++ b/invokeai/frontend/web/src/features/nodes/components/panels/TopCenterPanel.tsx @@ -1,27 +1,19 @@ import { HStack } from '@chakra-ui/react'; -import { useAppDispatch } from 'app/store/storeHooks'; -import IAIButton from 'common/components/IAIButton'; import CancelButton from 'features/parameters/components/ProcessButtons/CancelButton'; -import { memo, useCallback } from 'react'; +import { memo } from 'react'; import { Panel } from 'reactflow'; -import { receivedOpenAPISchema } from 'services/api/thunks/schema'; import LoadNodesButton from '../ui/LoadNodesButton'; import NodeInvokeButton from '../ui/NodeInvokeButton'; +import ReloadSchemaButton from '../ui/ReloadSchemaButton'; import SaveNodesButton from '../ui/SaveNodesButton'; const TopCenterPanel = () => { - const dispatch = useAppDispatch(); - - const handleReloadSchema = useCallback(() => { - dispatch(receivedOpenAPISchema()); - }, [dispatch]); - return ( - Reload Schema + diff --git a/invokeai/frontend/web/src/features/nodes/components/ui/ReloadSchemaButton.tsx b/invokeai/frontend/web/src/features/nodes/components/ui/ReloadSchemaButton.tsx new file mode 100644 index 0000000000..613297d217 --- /dev/null +++ b/invokeai/frontend/web/src/features/nodes/components/ui/ReloadSchemaButton.tsx @@ -0,0 +1,25 @@ +import { useAppDispatch } from 'app/store/storeHooks'; +import IAIIconButton from 'common/components/IAIIconButton'; +import { useCallback } from 'react'; +import { useTranslation } from 'react-i18next'; +import { BiRefresh } from 'react-icons/bi'; +import { receivedOpenAPISchema } from 'services/api/thunks/schema'; + +export default function ReloadSchemaButton() { + const { t } = useTranslation(); + const dispatch = useAppDispatch(); + + const handleReloadSchema = useCallback(() => { + dispatch(receivedOpenAPISchema()); + }, [dispatch]); + + return ( + } + fontSize={24} + tooltip={t('nodes.reloadSchema')} + aria-label={t('nodes.reloadSchema')} + onClick={handleReloadSchema} + /> + ); +}