add tooltips & status messages to model conversion

invokeai/backend/invoke_ai_web_server.py

@@ -448,7 +448,7 @@ class InvokeAIWebServer:
 
                 new_model_list = self.generate.model_manager.list_models()
                 socketio.emit(
-                    "newModelAdded",
+                    "modelConverted",
                     {"new_model_name": model_name,
                      "model_list": new_model_list, 'update': True},
                 )

invokeai/frontend/public/locales/common/en.json

@@ -58,5 +58,7 @@
   "statusUpscaling": "Upscaling",
   "statusUpscalingESRGAN": "Upscaling (ESRGAN)",
   "statusLoadingModel": "Loading Model",
-  "statusModelChanged": "Model Changed"
+  "statusModelChanged": "Model Changed",
+  "statusConvertingModel": "Converting Model",
+  "statusModelConverted": "Model Converted"
 }

invokeai/frontend/public/locales/modelmanager/en.json

@@ -72,14 +72,16 @@
   "convertToDiffusersHelpText4": "This is a one time process only. It might take around 30s-60s depending on the specifications of your computer.",
   "convertToDiffusersHelpText5": "Please make sure you have enough disk space. Models generally vary between 4GB-7GB in size.",
   "convertToDiffusersHelpText6": "Do you wish to convert this model?",
+  "convertToDiffusersSaveLocation": "Save Location",
   "v1": "v1",
   "v2": "v2",
   "inpainting": "v1 Inpainting",
-  "customConfig": "Custom Config",
+  "customConfig": "Custom Config",  
   "pathToCustomConfig": "Path To Custom Config",
   "statusConverting": "Converting",
-  "sameFolder": "Same Folder",
-  "invokeRoot": "Invoke Models",
+  "modelConverted": "Model Converted",
+  "sameFolder": "Same folder",
+  "invokeRoot": "InvokeAI folder",
   "custom": "Custom",
   "customSaveLocation": "Custom Save Location"
 }

invokeai/frontend/src/app/invokeai.d.ts

@@ -234,6 +234,11 @@ export declare type ModelChangeResponse = {
   model_list: ModelList;
 };
 
+export declare type ModelConvertedResponse = {
+  converted_model_name: string;
+  model_list: ModelList;
+};
+
 export declare type ModelAddedResponse = {
   new_model_name: string;
   model_list: ModelList;

invokeai/frontend/src/app/socketio/emitters.ts

@@ -15,6 +15,7 @@ import {
   addLogEntry,
   generationRequested,
   modelChangeRequested,
+  modelConvertRequested,
   setIsProcessing,
 } from 'features/system/store/systemSlice';
 import { InvokeTabName } from 'features/ui/store/tabMap';
@@ -181,6 +182,7 @@ const makeSocketIOEmitters = (
     emitConvertToDiffusers: (
       modelToConvert: InvokeAI.InvokeModelConversionProps
     ) => {
+      dispatch(modelConvertRequested());
       socketio.emit('convertToDiffusers', modelToConvert);
     },
     emitRequestModelChange: (modelName: string) => {

invokeai/frontend/src/app/socketio/listeners.ts

@@ -365,6 +365,7 @@ const makeSocketIOListeners = (
       const { new_model_name, model_list, update } = data;
       dispatch(setModelList(model_list));
       dispatch(setIsProcessing(false));
+      dispatch(setCurrentStatus(i18n.t('modelmanager:modelAdded')));
       dispatch(
         addLogEntry({
           timestamp: dateFormat(new Date(), 'isoDateTime'),
@@ -407,6 +408,30 @@ const makeSocketIOListeners = (
         })
       );
     },
+    onModelConverted: (data: InvokeAI.ModelConvertedResponse) => {
+      const { converted_model_name, model_list } = data;
+      dispatch(setModelList(model_list));
+      dispatch(setCurrentStatus(i18n.t('common:statusModelConverted')));
+      dispatch(setIsProcessing(false));
+      dispatch(setIsCancelable(true));
+      dispatch(
+        addLogEntry({
+          timestamp: dateFormat(new Date(), 'isoDateTime'),
+          message: `Model converted: ${converted_model_name}`,
+          level: 'info',
+        })
+      );
+      dispatch(
+        addToast({
+          title: `${i18n.t(
+            'modelmanager:modelConverted'
+          )}: ${converted_model_name}`,
+          status: 'success',
+          duration: 2500,
+          isClosable: true,
+        })
+      );
+    },
     onModelChanged: (data: InvokeAI.ModelChangeResponse) => {
       const { model_name, model_list } = data;
       dispatch(setModelList(model_list));

invokeai/frontend/src/app/socketio/middleware.ts

@@ -48,6 +48,7 @@ export const socketioMiddleware = () => {
       onFoundModels,
       onNewModelAdded,
       onModelDeleted,
+      onModelConverted,
       onModelChangeFailed,
       onTempFolderEmptied,
     } = makeSocketIOListeners(store);
@@ -126,6 +127,10 @@ export const socketioMiddleware = () => {
         onModelDeleted(data);
       });
 
+      socketio.on('modelConverted', (data: InvokeAI.ModelConvertedResponse) => {
+        onModelConverted(data);
+      });
+
       socketio.on('modelChanged', (data: InvokeAI.ModelChangeResponse) => {
         onModelChanged(data);
       });

invokeai/frontend/src/features/system/components/ModelManager/ModelConvert.tsx

@@ -5,6 +5,7 @@ import {
   RadioGroup,
   Text,
   UnorderedList,
+  Tooltip,
 } from '@chakra-ui/react';
 import { convertToDiffusers } from 'app/socketio/actions';
 import { RootState } from 'app/store';
@@ -12,7 +13,6 @@ import { useAppDispatch, useAppSelector } from 'app/storeHooks';
 import IAIAlertDialog from 'common/components/IAIAlertDialog';
 import IAIButton from 'common/components/IAIButton';
 import IAIInput from 'common/components/IAIInput';
-import { setIsProcessing } from 'features/system/store/systemSlice';
 import { useState, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -60,7 +60,6 @@ export default function ModelConvert(props: ModelConvertProps) {
           ? customSaveLocation
           : null,
     };
-    dispatch(setIsProcessing(true));
     dispatch(convertToDiffusers(modelToConvert));
   };
 
@@ -98,12 +97,28 @@ export default function ModelConvert(props: ModelConvertProps) {
 
       <Flex flexDir="column" gap={4}>
         <Flex marginTop="1rem" flexDir="column" gap={2}>
-          <Text fontWeight="bold">Save Location</Text>
+          <Text fontWeight="bold">
+            {t('modelmanager:convertToDiffusersSaveLocation')}
+          </Text>
           <RadioGroup value={saveLocation} onChange={(v) => setSaveLocation(v)}>
             <Flex gap={4}>
-              <Radio value="same">{t('modelmanager:sameFolder')}</Radio>
-              <Radio value="root">{t('modelmanager:invokeRoot')}</Radio>
-              <Radio value="custom">{t('modelmanager:custom')}</Radio>
+              <Radio value="same">
+                <Tooltip label="Save converted model in the same folder">
+                  {t('modelmanager:sameFolder')}
+                </Tooltip>
+              </Radio>
+
+              <Radio value="root">
+                <Tooltip label="Save converted model in the InvokeAI root folder">
+                  {t('modelmanager:invokeRoot')}
+                </Tooltip>
+              </Radio>
+
+              <Radio value="custom">
+                <Tooltip label="Save converted model in a custom folder">
+                  {t('modelmanager:custom')}
+                </Tooltip>
+              </Radio>
             </Flex>
           </RadioGroup>
         </Flex>

invokeai/frontend/src/features/system/store/systemSlice.ts

@@ -214,6 +214,12 @@ export const systemSlice = createSlice({
       state.isProcessing = true;
       state.currentStatusHasSteps = false;
     },
+    modelConvertRequested: (state) => {
+      state.currentStatus = i18n.t('common:statusConvertingModel');
+      state.isCancelable = false;
+      state.isProcessing = true;
+      state.currentStatusHasSteps = false;
+    },
     setSaveIntermediatesInterval: (state, action: PayloadAction<number>) => {
       state.saveIntermediatesInterval = action.payload;
     },
@@ -265,6 +271,7 @@ export const {
   setModelList,
   setIsCancelable,
   modelChangeRequested,
+  modelConvertRequested,
   setSaveIntermediatesInterval,
   setEnableImageDebugging,
   generationRequested,