diff --git a/WebUI/electron/electron-env.d.ts b/WebUI/electron/electron-env.d.ts index 2227f50e..bc0bd0d6 100644 --- a/WebUI/electron/electron-env.d.ts +++ b/WebUI/electron/electron-env.d.ts @@ -68,4 +68,4 @@ type SetupData = { version:string, } -type BackendStatus = 'notYetStarted' | 'starting' | 'running' | 'stopped' | 'failed' | 'notInstalled' | 'installationFailed' | 'installing' | 'uninitializedStatus' +type BackendStatus = 'notYetStarted' | 'starting' | 'running' | 'stopped' | 'stopping' | 'failed' | 'notInstalled' | 'installationFailed' | 'installing' | 'uninitializedStatus' diff --git a/WebUI/electron/subprocesses/aiBackendService.ts b/WebUI/electron/subprocesses/aiBackendService.ts index d23a5874..97324e30 100644 --- a/WebUI/electron/subprocesses/aiBackendService.ts +++ b/WebUI/electron/subprocesses/aiBackendService.ts @@ -17,7 +17,7 @@ export class AiBackendService extends LongLivedPythonApiService { isSetUp = this.serviceIsSetUp(); async *set_up(): AsyncIterable { - this.currentStatus = 'installing' + this.setStatus('installing') this.appLogger.info("setting up service", this.name) const self = this @@ -47,14 +47,12 @@ export class AiBackendService extends LongLivedPythonApiService { yield {serviceName: self.name, step: `move python environment to target`, status: "executing", debugMessage: `Moving python environment to target place at ${self.pythonEnvDir}`}; await self.commonSetupSteps.moveToFinalTarget(pythonEnvContainmentDir, self.pythonEnvDir) yield {serviceName: self.name, step: `move python environment to target`, status: "executing", debugMessage: `Moved to ${self.pythonEnvDir}`}; - self.currentStatus = 'notYetStarted' - this.updateStatus() + this.setStatus('notYetStarted') yield {serviceName: self.name, step: "end", status: "success", debugMessage: `service set up completely`}; } catch (e) { self.appLogger.warn(`Set up of service failed due to ${e}`, self.name, true) self.appLogger.warn(`Aborting set up of ${self.name} service environment`, self.name, true) - self.currentStatus = 'installationFailed' - this.updateStatus() + this.setStatus('installationFailed') yield {serviceName: self.name, step: "end", status: "failed", debugMessage: `Failed to setup python environment due to ${e}`}; } } diff --git a/WebUI/electron/subprocesses/apiService.ts b/WebUI/electron/subprocesses/apiService.ts index a0d88c50..9b5d9efa 100644 --- a/WebUI/electron/subprocesses/apiService.ts +++ b/WebUI/electron/subprocesses/apiService.ts @@ -73,6 +73,11 @@ export abstract class LongLivedPythonApiService implements ApiService { abstract serviceIsSetUp(): boolean + setStatus(status: BackendStatus) { + this.currentStatus = status + this.updateStatus() + } + updateStatus() { this.isSetUp = this.serviceIsSetUp(); this.win.webContents.send("serviceInfoUpdate", this.get_info()); @@ -106,6 +111,7 @@ export abstract class LongLivedPythonApiService implements ApiService { } this.desiredStatus = "running" + this.setStatus('starting') try { this.appLogger.info(` trying to start ${this.name} python API`, this.name) const trackedProcess = await this.spawnAPIProcess() @@ -137,6 +143,7 @@ export abstract class LongLivedPythonApiService implements ApiService { async stop(): Promise { this.appLogger.info(`Stopping backend ${this.name}. It was in state ${this.currentStatus}`, this.name) this.desiredStatus = "stopped" + this.setStatus('stopping') this.encapsulatedProcess?.kill() await new Promise(resolve => { setTimeout(() => { diff --git a/WebUI/electron/subprocesses/comfyUIBackendService.ts b/WebUI/electron/subprocesses/comfyUIBackendService.ts index 2583a48c..054390ae 100644 --- a/WebUI/electron/subprocesses/comfyUIBackendService.ts +++ b/WebUI/electron/subprocesses/comfyUIBackendService.ts @@ -32,7 +32,7 @@ export class ComfyUiBackendService extends LongLivedPythonApiService { async *set_up(): AsyncIterable { this.appLogger.info("setting up service", this.name) - this.currentStatus = "installing" + this.setStatus('installing') const self = this const logToFileHandler = (data: string) => self.appLogger.logMessageToFile(data, self.name) @@ -184,14 +184,12 @@ export class ComfyUiBackendService extends LongLivedPythonApiService { await this.commonSetupSteps.moveToFinalTarget(comfyUiTmpServiceDir, self.serviceDir) yield {serviceName: self.name, step: `move service to target`, status: "executing", debugMessage: `Moved to ${self.pythonEnvDir}`}; - this.currentStatus = "notYetStarted" - this.updateStatus() + this.setStatus('notYetStarted') yield {serviceName: self.name, step: "end", status: "success", debugMessage: `service set up completely`}; } catch (e) { self.appLogger.warn(`Set up of service failed due to ${e}`, self.name, true) self.appLogger.warn(`Aborting set up of ${self.name} service environment`, self.name, true) - this.currentStatus = "installationFailed" - this.updateStatus() + this.setStatus('installationFailed') yield {serviceName: self.name, step: "end", status: "failed", debugMessage: `Failed to setup comfyUI service due to ${e}`}; } } diff --git a/WebUI/electron/subprocesses/llamaCppBackendService.ts b/WebUI/electron/subprocesses/llamaCppBackendService.ts index e10b3e3d..9a1e34fe 100644 --- a/WebUI/electron/subprocesses/llamaCppBackendService.ts +++ b/WebUI/electron/subprocesses/llamaCppBackendService.ts @@ -25,7 +25,7 @@ export class LlamaCppBackendService extends LongLivedPythonApiService { isSetUp = this.serviceIsSetUp(); async *set_up(): AsyncIterable { - this.currentStatus = 'installing' + this.setStatus('installing') this.appLogger.info("setting up service", this.name) const self = this @@ -50,14 +50,12 @@ export class LlamaCppBackendService extends LongLivedPythonApiService { yield {serviceName: self.name, step: `move python environment to target`, status: "executing", debugMessage: `Moving python environment to target place at ${self.pythonEnvDir}`}; await self.commonSetupSteps.moveToFinalTarget(pythonEnvContainmentDir, self.pythonEnvDir) yield {serviceName: self.name, step: `move python environment to target`, status: "executing", debugMessage: `Moved to ${self.pythonEnvDir}`}; - self.currentStatus = 'notYetStarted' - this.updateStatus() + this.setStatus('notYetStarted') yield {serviceName: self.name, step: "end", status: "success", debugMessage: `service set up completely`}; } catch (e) { self.appLogger.warn(`Set up of service failed due to ${e}`, self.name, true) self.appLogger.warn(`Aborting set up of ${self.name} service environment`, self.name, true) - self.currentStatus = 'installationFailed' - this.updateStatus() + this.setStatus('installationFailed') yield {serviceName: self.name, step: "end", status: "failed", debugMessage: `Failed to setup python environment due to ${e}`}; } } diff --git a/WebUI/src/assets/i18n/en-US.json b/WebUI/src/assets/i18n/en-US.json index e56c6742..164f21a3 100644 --- a/WebUI/src/assets/i18n/en-US.json +++ b/WebUI/src/assets/i18n/en-US.json @@ -97,7 +97,8 @@ "SETTINGS_MODEL_SD_STANDARD_INPAINT_MODEL": "Standard Default Inpaint/OutPaint Model", "SETTINGS_MODEL_SD_HD_MODEL": "HD Default Model", "SETTINGS_MODEL_RAG_MODEL": "Rag Query Model", - "SETTINGS_MODEL_BACKEND": "Backend Components", + "SETTINGS_MODEL_BACKEND": "Inference Backends", + "SETTINGS_BACKEND_STATUS": "Backend Status", "SETTINGS_MODEL_MANAGE_BACKEND": "Manage Backend Components", "SETTINGS_MODEL_EXIST": "The model already exist. Repeating the download is unnecessary.", "SETTINGS_MODEL_DOWNLOAD": "Model Download", diff --git a/WebUI/src/components/InstallationManagement.vue b/WebUI/src/components/InstallationManagement.vue index 0ba95318..a16604c8 100644 --- a/WebUI/src/components/InstallationManagement.vue +++ b/WebUI/src/components/InstallationManagement.vue @@ -109,8 +109,7 @@ \ No newline at end of file diff --git a/WebUI/src/components/SettingsModel.vue b/WebUI/src/components/SettingsModel.vue index 11aba292..f723587e 100644 --- a/WebUI/src/components/SettingsModel.vue +++ b/WebUI/src/components/SettingsModel.vue @@ -13,34 +13,6 @@ -
-

{{ languages.SETTINGS_MODEL_BACKEND }}

-
-

{{ languages.BACKEND_REQUIRED_COMPONENTS }}

- - - - - - - -
{{ item.serviceName }}{{ mapToDisplayStatus(item.status) }}
-

{{ languages.BACKEND_OPTIONAL_COMPONENTS }}

- - - - - - - -
{{ item.serviceName }}{{ mapToDisplayStatus(item.status) }}
-
- -
-
-

{{ languages.SETTINGS_MODEL_SD_PRESET_MODEL }}

@@ -320,8 +292,6 @@ const presetModelChange = ref(false); const paths = reactive(Object.assign({}, toRaw(globalSetup.paths))); const pathsChange = ref(false); -const apiServiceInformation = ref([]) - const emits = defineEmits<{ (e: "showDownloadModelConfirm", downloadList: DownloadModelParam[], success?: () => void, fail?: () => void): void }>(); @@ -330,11 +300,6 @@ onMounted(() => { cancelPathsSettings(); }) -//TODO: Change to continuous update -onBeforeMount(async () => { - apiServiceInformation.value = await window.electronAPI.getServices() -}) - async function customPathsSettings(key: string, path: string) { if (!await window.electronAPI.existsPath(path)) { toast.error(i18n.state.ERROR_FOLDER_NOT_EXISTS); diff --git a/WebUI/src/lib/utils.ts b/WebUI/src/lib/utils.ts index af3605c7..9f5db491 100644 --- a/WebUI/src/lib/utils.ts +++ b/WebUI/src/lib/utils.ts @@ -7,18 +7,20 @@ export function cn(...inputs: ClassValue[]) { export function mapStatusToColor(componentState: BackendStatus) { switch (componentState) { - case "starting": - case "installing": case "running": - return 'green' + return '#66BB55' case "installationFailed": case "failed": - return 'red' + return '#ef335e' case "notInstalled": - return 'gray' + return '#bbc2c5' case "notYetStarted": case "stopped": return 'orange' + case "starting": + case "stopping": + case "installing": + return "#e1cb50" default: return 'blue' } @@ -28,15 +30,34 @@ export function mapToDisplayStatus(componentState: BackendStatus) { switch (componentState) { case "running": return "Running" + case "stopping": + return "Stopping" + case "starting": + return "Starting" case "stopped": case "notYetStarted": - return "Not Running" + return "Installed" case "installationFailed": case "failed": return "Failed" case "notInstalled": return "Not Installed" + case "installing": + return "Installing" default: return componentState } } + +export function mapServiceNameToDisplayName(serviceName: string) { + switch (serviceName) { + case "comfyui-backend": + return "ComfyUI" + case "ai-backend": + return "AI Playground" + case "llamacpp-backend": + return "Llama.cpp - GGUF" + default: + return serviceName + } +}