diff --git a/backend/invoke_ai_web_server.py b/backend/invoke_ai_web_server.py index 123a6d206a..d431e684e0 100644 --- a/backend/invoke_ai_web_server.py +++ b/backend/invoke_ai_web_server.py @@ -9,8 +9,6 @@ import io import base64 import os import json -import tkinter as tk -import sys from werkzeug.utils import secure_filename from flask import Flask, redirect, send_from_directory, request, make_response @@ -301,21 +299,8 @@ class InvokeAIWebServer: socketio.emit("systemConfig", config) @socketio.on('searchForModels') - def handle_search_models(): + def handle_search_models(search_folder: str): try: - # Using tkinter to get the filepath because JS doesn't allow - root = tk.Tk() - root.title('InvokeAI') - root.withdraw() - root.iconbitmap(default=os.path.join(os.getcwd(), '../backend/logo.ico')) - if root.wm_state() == 'withdrawn': - root.iconify() - root.wm_attributes('-topmost', 1) - root.focus_force() - search_folder = filedialog.askdirectory(parent=root, title='Select Checkpoint Folder') - root.quit() - root.destroy() - if not search_folder: socketio.emit( "foundModels", diff --git a/frontend/src/app/socketio/actions.ts b/frontend/src/app/socketio/actions.ts index 869b515930..e07b12ebf4 100644 --- a/frontend/src/app/socketio/actions.ts +++ b/frontend/src/app/socketio/actions.ts @@ -30,9 +30,7 @@ export const requestSystemConfig = createAction( 'socketio/requestSystemConfig' ); -export const searchForModels = createAction( - 'socketio/searchForModels' -); +export const searchForModels = createAction('socketio/searchForModels'); export const addNewModel = createAction( 'socketio/addNewModel' diff --git a/frontend/src/app/socketio/emitters.ts b/frontend/src/app/socketio/emitters.ts index 7c4bef9ce4..af7fd6ddc9 100644 --- a/frontend/src/app/socketio/emitters.ts +++ b/frontend/src/app/socketio/emitters.ts @@ -159,8 +159,8 @@ const makeSocketIOEmitters = ( emitRequestSystemConfig: () => { socketio.emit('requestSystemConfig'); }, - emitSearchForModels: () => { - socketio.emit('searchForModels'); + emitSearchForModels: (modelFolder: string) => { + socketio.emit('searchForModels', modelFolder); }, emitAddNewModel: (modelConfig: InvokeAI.InvokeModelConfigProps) => { socketio.emit('addNewModel', modelConfig); diff --git a/frontend/src/app/socketio/middleware.ts b/frontend/src/app/socketio/middleware.ts index aadd212306..f00274e956 100644 --- a/frontend/src/app/socketio/middleware.ts +++ b/frontend/src/app/socketio/middleware.ts @@ -185,7 +185,7 @@ export const socketioMiddleware = () => { } case 'socketio/searchForModels': { - emitSearchForModels(); + emitSearchForModels(action.payload); break; } diff --git a/frontend/src/common/components/IAIInput.tsx b/frontend/src/common/components/IAIInput.tsx index 4ee501e8a8..50f78f30f1 100644 --- a/frontend/src/common/components/IAIInput.tsx +++ b/frontend/src/common/components/IAIInput.tsx @@ -6,6 +6,7 @@ interface IAIInputProps extends InputProps { label?: string; width?: string | number; value?: string; + size?: string; onChange?: (e: ChangeEvent) => void; } @@ -16,6 +17,7 @@ export default function IAIInput(props: IAIInputProps) { isDisabled = false, fontSize = 'sm', width, + size = 'sm', isInvalid, ...rest } = props; @@ -39,7 +41,7 @@ export default function IAIInput(props: IAIInputProps) { {label} )} - + ); } diff --git a/frontend/src/features/system/components/ModelManager/SearchModels.tsx b/frontend/src/features/system/components/ModelManager/SearchModels.tsx index 861412873b..793f234827 100644 --- a/frontend/src/features/system/components/ModelManager/SearchModels.tsx +++ b/frontend/src/features/system/components/ModelManager/SearchModels.tsx @@ -5,7 +5,7 @@ import IAIIconButton from 'common/components/IAIIconButton'; import { createSelector } from '@reduxjs/toolkit'; import { systemSelector } from 'features/system/store/systemSelectors'; -import { Box, Flex, VStack } from '@chakra-ui/react'; +import { Box, Flex, FormControl, HStack, VStack } from '@chakra-ui/react'; import { useAppDispatch, useAppSelector } from 'app/storeHooks'; import { useTranslation } from 'react-i18next'; @@ -24,6 +24,8 @@ import _ from 'lodash'; import type { RootState } from 'app/store'; import type { ReactNode, ChangeEvent } from 'react'; import type { FoundModel } from 'app/invokeai'; +import IAIInput from 'common/components/IAIInput'; +import { Field, Formik } from 'formik'; const existingModelsSelector = createSelector([systemSelector], (system) => { const { model_list } = system; @@ -136,8 +138,8 @@ export default function SearchModels() { setModelsToAdd([]); }; - const findModelsHandler = () => { - dispatch(searchForModels()); + const findModelsHandler = (values: { checkpointFolder: string }) => { + dispatch(searchForModels(values.checkpointFolder)); }; const addAllToSelected = () => { @@ -250,15 +252,36 @@ export default function SearchModels() { /> ) : ( - { + findModelsHandler(values); + }} > - - - {t('modelmanager:selectFolder')} - - + {({ handleSubmit }) => ( +
+ + + + + } + aria-label={t('modelmanager:findModels')} + tooltip={t('modelmanager:findModels')} + type="submit" + /> + +
+ )} + )} {foundModels && (