From 11819d01636137973c9e48fb76c39166572d029b Mon Sep 17 00:00:00 2001 From: MathieuG-P <40181755+Zagrios@users.noreply.github.com> Date: Wed, 10 May 2023 22:53:54 +0200 Subject: [PATCH] [feature-136] fix bug with models selection, delete models directly from their coresponding grid --- src/main/services/request.service.ts | 6 ++--- .../models/delete-models-modal.component.tsx | 19 +++++++++---- .../models-grid.component.tsx | 27 ++++++++++++------- .../models-panel.component.tsx | 6 +---- .../hooks/use-switchable-observable.hook.ts | 6 ++--- .../models-manager.service.ts | 2 +- 6 files changed, 40 insertions(+), 26 deletions(-) diff --git a/src/main/services/request.service.ts b/src/main/services/request.service.ts index b03eb16f..00b4544e 100644 --- a/src/main/services/request.service.ts +++ b/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(url: string): Promise{ + public get(options: string|RequestOptions): Promise{ 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)); diff --git a/src/renderer/components/modal/modal-types/models/delete-models-modal.component.tsx b/src/renderer/components/modal/modal-types/models/delete-models-modal.component.tsx index cb78accc..d1c87772 100644 --- a/src/renderer/components/modal/modal-types/models/delete-models-modal.component.tsx +++ b/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 = ({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
-

TODO TITLE

+

{isMultiple ? "Supprimer les modèles" : "Supprimer le modèle"}

-

TODO DESK

- {data.linked &&

TODO LINKED

} +

{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}`}

+ {data.linked &&

{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"}

} {!isMultiple && (
setRemember(val)}/> diff --git a/src/renderer/components/models-management/models-grid.component.tsx b/src/renderer/components/models-management/models-grid.component.tsx index 48166e1d..96d689c5 100644 --- a/src/renderer/components/models-management/models-grid.component.tsx +++ b/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>(); - const [modelsSelected, modelsSelected$] = useBehaviorSubject>(new Set()); + const [models, setModelsLoadObservable,, setModels] = useSwitchableObservable>(); + const [modelsSelected, modelsSelected$] = useBehaviorSubject([]); 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)} /> diff --git a/src/renderer/components/models-management/models-panel.component.tsx b/src/renderer/components/models-management/models-panel.component.tsx index 614304f6..42796cbf 100644 --- a/src/renderer/components/models-management/models-panel.component.tsx +++ b/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[] = [ diff --git a/src/renderer/hooks/use-switchable-observable.hook.ts b/src/renderer/hooks/use-switchable-observable.hook.ts index a7b4d7ad..08dbf05d 100644 --- a/src/renderer/hooks/use-switchable-observable.hook.ts +++ b/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(observable?: Observable, clearOnSwitch = true): [T, React.Dispatch>>, Observable]{ +export function useSwitchableObservable(observable?: Observable, clearOnSwitch = true): [T, React.Dispatch>>, Observable, Dispatch>]{ const [currentObs, setCurrentObs] = useState(observable); const [obsValue, setObsValue] = useState(); @@ -15,5 +15,5 @@ export function useSwitchableObservable(observable?: Observable, clearOnSw } }, [currentObs]) - return [obsValue, setCurrentObs, currentObs]; + return [obsValue, setCurrentObs, currentObs, setObsValue]; } \ No newline at end of file diff --git a/src/renderer/services/models-management/models-manager.service.ts b/src/renderer/services/models-management/models-manager.service.ts index 058490c2..66aa30e9 100644 --- a/src/renderer/services/models-management/models-manager.service.ts +++ b/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(); }