[feature-136] fix bug with models selection, delete models directly from their coresponding grid

src/main/services/request.service.ts

@@ -1,4 +1,4 @@
-import { get } from "https";
+import { RequestOptions, get } from "https";
 import { createWriteStream, unlink } from "fs";
 
 export class RequestService {
@@ -12,10 +12,10 @@ export class RequestService {
 
     private constructor(){}
 
-    public get<T = any>(url: string): Promise<T>{
+    public get<T = any>(options: string|RequestOptions): Promise<T>{
         return new Promise((resolve, reject) => {
             let body = ''
-            get(url, (res) => {
+            get(options, (res) => {
                 res.on('data', chunk => body += chunk);
                 res.on('end', () => {
                     resolve(JSON.parse(body));

src/renderer/components/modal/modal-types/models/delete-models-modal.component.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { ModalComponent, ModalExitCode } from 'renderer/services/modale.service'
 import { BsmLocalModel } from 'shared/models/models/bsm-local-model.interface'
 import BeatConflict from '../../../../../../assets/images/apngs/beat-conflict.png'
@@ -6,21 +6,30 @@ import { BsmImage } from 'renderer/components/shared/bsm-image.component'
 import { BsmCheckbox } from 'renderer/components/shared/bsm-checkbox.component'
 import { BsmButton } from 'renderer/components/shared/bsm-button.component'
 import { useTranslation } from 'renderer/hooks/use-translation.hook'
+import { useOnUpdate } from 'renderer/hooks/use-on-update.hook'
+import { useConstant } from 'renderer/hooks/use-constant.hook'
+import { ConfigurationService } from 'renderer/services/configuration.service'
+import { ModelsManagerService } from 'renderer/services/models-management/models-manager.service'
 
 export const DeleteModelsModal: ModalComponent<void, {models: BsmLocalModel[], linked: boolean}> = ({resolver, data}) => {
 
+    const config = useConstant(() => ConfigurationService.getInstance());
     const t = useTranslation();
     const [remember, setRemember] = useState(false);
 
+    useOnUpdate(() => {
+        config.set(ModelsManagerService.REMEMBER_CHOICE_DELETE_MODEL_KEY, remember);
+    }, [remember]);
+
     const isMultiple = data.models.length > 1;
-    console.log(isMultiple);
 
     return (
+        // TODO TRANSLATIONS
         <form className="text-gray-800 dark:text-gray-200">
-            <h1 className="text-3xl uppercase tracking-wide w-full text-center">TODO TITLE</h1>
+            <h1 className="text-3xl uppercase tracking-wide w-full text-center">{isMultiple ? "Supprimer les modèles" : "Supprimer le modèle"}</h1>
             <BsmImage className="mx-auto h-24" image={BeatConflict}/>
-            <p className="max-w-sm w-full">TODO DESK</p>
-            {data.linked && <p className="text-sm italic mt-2 cursor-help w-fit" title="TODO TITLE">TODO LINKED</p>}
+            <p className="max-w-sm w-full">{isMultiple ? `Es-tu sur de vouloir supprimer les ${data.models.length} modèles ?` : `Es-tu sur de vouloir supprimer le modèle ${data.models[0].model?.name ?? data.models[0].fileName}`}</p>
+            {data.linked && <p className="text-sm italic mt-2 cursor-help w-fit" title="TODO TITLE">{isMultiple ? "Ces modèles seront égalements supprimées des versions utilisant les maps partagées" : "Ce modèle sera également supprimée des versions utilisant les maps partagées"}</p>}
             {!isMultiple && (
                 <div className="flex items-center relative py-2 gap-1 mt-1">
                     <BsmCheckbox className="h-5 relative z-[1]" checked={remember} onChange={(val) => setRemember(val)}/>

src/renderer/components/models-management/models-grid.component.tsx

@@ -24,8 +24,8 @@ export const ModelsGrid = forwardRef(({className, version, type}: Props, forward
     const ref = useRef();
     const isVisible = useInView(ref, {once: true, amount: .1});
 
-    const [models, setModelsLoadObservable] = useSwitchableObservable<Progression<BsmLocalModel[]>>();
-    const [modelsSelected, modelsSelected$] = useBehaviorSubject<Set<BsmLocalModel>>(new Set());
+    const [models, setModelsLoadObservable,, setModels] = useSwitchableObservable<Progression<BsmLocalModel[]>>();
+    const [modelsSelected, modelsSelected$] = useBehaviorSubject<BsmLocalModel[]>([]);
     const isLoading = !models || !models?.extra;
     const hasModels = !isLoading && models?.extra.length;
 
@@ -35,10 +35,19 @@ export const ModelsGrid = forwardRef(({className, version, type}: Props, forward
             return models?.extra ?? [];
         },
         getSelectedModels: () => {
-            return Array.from(modelsSelected)
+            return modelsSelected;
         },
         reloadModels: () => {
             setModelsLoadObservable(() => modelsManager.$getModels(type, version));
+        },
+        deleteSelectedModels: () => {
+            modelsManager.deleteModels(modelsSelected, version).then(deleted => {
+                if(!deleted){ return; }
+                models.extra = models.extra.filter(m => !modelsSelected.some(d => d.hash === m.hash));
+                setModels(() => models);
+                modelsSelected$.next([]);
+            });
+
         }
     }), [modelsSelected, models]);
 
@@ -48,14 +57,14 @@ export const ModelsGrid = forwardRef(({className, version, type}: Props, forward
     }, [version, isVisible, type]);
 
     const handleModelClick = (model: BsmLocalModel) => {
-        const newSet = new Set(modelsSelected);
-        if(newSet.has(model)){
-            newSet.delete(model);
+        const prunedArray = Array.from(new Set(modelsSelected));
+        if(prunedArray.some(m => m.hash === model.hash)){
+            prunedArray.splice(prunedArray.findIndex(m => m.hash === model.hash), 1);
         } 
         else {
-            newSet.add(model);
+            prunedArray.push(model);
         }
-        modelsSelected$.next(newSet);
+        modelsSelected$.next(prunedArray);
     }
 
     return (
@@ -76,7 +85,7 @@ export const ModelsGrid = forwardRef(({className, version, type}: Props, forward
                             discord={localModel.model?.discord}
                             discordid={localModel.model?.discordid}
                             tags={localModel.model?.tags}
-                            selected={modelsSelected.has(localModel)}
+                            selected={modelsSelected.some(m => m.hash === localModel.hash)}
                             path={localModel.path}
                             onClick={() => handleModelClick(localModel)}
                         />

src/renderer/components/models-management/models-panel.component.tsx

@@ -37,11 +37,7 @@ export function ModelsPanel({version}: {version?: BSVersion}) {
 
     const deleteModels = () => {
         const activeTab = getActiveTabRef(modelTypeTab);
-        const models = getSelectedModels(activeTab)?.length ? getSelectedModels(activeTab) : getAllModels(activeTab);
-        modelsManager.deleteModels(models, version).then(deleted => {
-            if(!deleted){ return; }
-            reloadModels(activeTab);
-        });
+        activeTab.current?.deleteSelectedModels();
     }
 
     const threeDotsItems: DropDownItem[] = [

src/renderer/hooks/use-switchable-observable.hook.ts

@@ -1,7 +1,7 @@
 import { Observable } from "rxjs";
-import { useState, useEffect } from "react";
+import { useState, useEffect, Dispatch, SetStateAction } from "react";
 
-export function useSwitchableObservable<T>(observable?: Observable<T>, clearOnSwitch = true): [T, React.Dispatch<React.SetStateAction<Observable<T>>>, Observable<T>]{
+export function useSwitchableObservable<T>(observable?: Observable<T>, clearOnSwitch = true): [T, React.Dispatch<React.SetStateAction<Observable<T>>>, Observable<T>, Dispatch<SetStateAction<T>>]{
     
     const [currentObs, setCurrentObs] = useState(observable);
     const [obsValue, setObsValue] = useState<T>();
@@ -15,5 +15,5 @@ export function useSwitchableObservable<T>(observable?: Observable<T>, clearOnSw
         }
     }, [currentObs])
     
-    return [obsValue, setCurrentObs, currentObs];
+    return [obsValue, setCurrentObs, currentObs, setObsValue];
 }

src/renderer/services/models-management/models-manager.service.ts

@@ -21,7 +21,7 @@ export class ModelsManagerService {
 
     private static instance: ModelsManagerService;
 
-    private static readonly REMEMBER_CHOICE_DELETE_MODEL_KEY = "not-confirm-delete-model"
+    public static readonly REMEMBER_CHOICE_DELETE_MODEL_KEY = "not-confirm-delete-model"
 
     public static getInstance(): ModelsManagerService{
         if(!ModelsManagerService.instance){ ModelsManagerService.instance = new ModelsManagerService(); }