feat: using podman-desktop modals instead of custom one (#210)

* feat: using podman-desktop modals instead of custom one Signed-off-by: axel7083 <[email protected]> * fix: prettier Signed-off-by: axel7083 <[email protected]> * fix: linter & comments Signed-off-by: axel7083 <[email protected]> * fix: linter Signed-off-by: axel7083 <[email protected]> * fix: resolving comment Signed-off-by: axel7083 <[email protected]> * fix: prettier Signed-off-by: axel7083 <[email protected]> --------- Signed-off-by: axel7083 <[email protected]>
containers · Feb 6, 2024 · 786d748 · 786d748
1 parent 4d9d79b
commit 786d748
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 39 deletions.
diff --git a/packages/backend/src/studio-api-impl.ts b/packages/backend/src/studio-api-impl.ts
@@ -115,8 +115,30 @@ export class StudioApiImpl implements StudioAPI {
     return this.catalogManager.getCatalog();
   }
 
-  async deleteLocalModel(modelId: string): Promise<void> {
-    await this.modelsManager.deleteLocalModel(modelId);
+  async requestRemoveLocalModel(modelId: string): Promise<void> {
+    const modelInfo = this.modelsManager.getLocalModelInfo(modelId);
+
+    // Do not wait on the promise as the api would probably timeout before the user answer.
+    podmanDesktopApi.window
+      .showWarningMessage(
+        `Are you sure you want to delete ${modelId} ? The following files will be removed from disk "${modelInfo.file}".`,
+        'Confirm',
+        'Cancel',
+      )
+      .then((result: string) => {
+        if (result === 'Confirm') {
+          this.modelsManager.deleteLocalModel(modelId).catch((err: unknown) => {
+            console.error('Something went wrong while deleting the models', err);
+            // Lets reloads the models (could fix the issue)
+            this.modelsManager.loadLocalModels().catch((err: unknown) => {
+              console.error('Cannot reload the models', err);
+            });
+          });
+        }
+      })
+      .catch((err: unknown) => {
+        console.error(`Something went wrong with confirmation modals`, err);
+      });
   }
 
   async getModelsDirectory(): Promise<string> {

diff --git a/packages/frontend/src/lib/table/model/ModelColumnActions.svelte b/packages/frontend/src/lib/table/model/ModelColumnActions.svelte
@@ -4,19 +4,12 @@ import { faTrash } from "@fortawesome/free-solid-svg-icons";
 import { faFolderOpen } from "@fortawesome/free-solid-svg-icons";
 import ListItemButtonIcon from "../../button/ListItemButtonIcon.svelte";
 import { studioClient } from "/@/utils/client";
-import Modal from "../../Modal.svelte";
-import Button from "../../button/Button.svelte";
 export let object: ModelInfo;
 
-let deleteConfirmVisible: boolean = false;
-
 function deleteModel() {
-  deleteConfirmVisible= true;
-}
-
-async function goDeleteModel() {
-  await studioClient.deleteLocalModel(object.id);
-  deleteConfirmVisible= false;
+  studioClient.requestRemoveLocalModel(object.id).catch((err) => {
+    console.error(`Something went wrong while trying to delete model ${String(err)}.`);
+  });
 }
 
 function openModelFolder() {
@@ -37,29 +30,3 @@ function openModelFolder() {
   title="Delete Model"
   enabled={!object.state}
 />
-
-{#if deleteConfirmVisible}
-  <Modal
-    on:close="{() => {
-      deleteConfirmVisible = false;
-    }}">
-    <div class="flex items-center justify-between bg-black px-5 py-4 border-b-2 border-violet-700">
-      <h1 class="text-xl font-bold">Delete a model</h1>
-
-      <button class="hover:text-gray-300 px-2 py-1" on:click="{() => deleteConfirmVisible = false}">
-        <i class="fas fa-times" aria-hidden="true"></i>
-      </button>
-    </div>
-    <div class="bg-charcoal-600 p-5 h-full flex flex-col justify-items-center">
-      <span class="pb-3">The folder on disk containing the model will be deleted, it contains:</span>
-      <ul class="list-disc ml-8 space-y-2">
-        <li>{object.file?.file}</li>
-      </ul>
-
-      <div class="pt-5 grid grid-cols-2 gap-10 place-content-center w-full">
-        <Button type="primary" on:click="{() => goDeleteModel()}">Delete</Button>
-        <Button type="secondary" on:click="{() => deleteConfirmVisible = false}">Cancel</Button>
-      </div>
-    </div>
-  </Modal>
-{/if}
diff --git a/packages/shared/src/StudioAPI.ts b/packages/shared/src/StudioAPI.ts
@@ -19,7 +19,7 @@ export abstract class StudioAPI {
   /**
    * Delete the folder containing the model from local storage
    */
-  abstract deleteLocalModel(modelId: string): Promise<void>;
+  abstract requestRemoveLocalModel(modelId: string): Promise<void>;
   abstract startPlayground(modelId: string): Promise<void>;
   abstract stopPlayground(modelId: string): Promise<void>;
   abstract askPlayground(modelId: string, prompt: string): Promise<number>;