Implement resetStates hook and integrate it into Header component for state management

This commit is contained in:
2025-06-24 11:04:56 +05:30
parent b49f431ebf
commit a5afcd5757
5 changed files with 56 additions and 3 deletions

View File

@@ -5,16 +5,25 @@ import FileMenu from "../../ui/FileMenu";
import { useToggleStore } from "../../../store/useUIToggleStore";
import useModuleStore from "../../../store/useModuleStore";
import { useNavigate } from "react-router-dom";
import useRestStates from "../../../hooks/useResetStates";
const Header: React.FC = () => {
const { toggleUILeft, toggleUIRight, setToggleUI } = useToggleStore();
const { activeModule } = useModuleStore();
const navigate = useNavigate();
const { resetStates } = useRestStates();
return (
<div className="header-container">
<div className="header-content">
<button className="logo-container" onClick={() => navigate("/Dashboard")} title="Back to Dashboard">
<button
className="logo-container"
onClick={() => {
resetStates();
navigate("/Dashboard")
}}
title="Back to Dashboard"
>
<LogoIcon />
</button>
<div className="header-title">

View File

View File

@@ -0,0 +1,26 @@
import { useVersionContext } from "../modules/builder/version/versionContext";
import { useSceneContext } from "../modules/scene/sceneContext";
import { useProductContext } from "../modules/simulation/products/productContext";
import { useVersionHistoryStore } from "../store/builder/useVersionHistoryStore";
const useRestStates = () => {
const { selectedVersionStore } = useVersionContext();
const { clearSelectedVersion } = selectedVersionStore();
const { selectedProductStore } = useProductContext();
const { clearSelectedProduct } = selectedProductStore();
const { clearVersions } = useVersionHistoryStore();
const { clearStores } = useSceneContext();
const resetStates = () => {
clearSelectedVersion();
clearSelectedProduct();
clearVersions();
clearStores();
};
return {
resetStates,
};
};
export default useRestStates;

View File

@@ -28,6 +28,8 @@ type SceneContextValue = {
vehicleStore: VehicleStoreType;
storageUnitStore: StorageUnitStoreType;
clearStores: () => void;
layout: 'Main Layout' | 'Comparison Layout';
};
@@ -55,8 +57,17 @@ export function SceneProvider({
const storageUnitStore = useMemo(() => createStorageUnitStore(), []);
const clearStores = useMemo(() => () => {
assetStore().clearAssets();
}, [assetStore]);
assetStore.getState().clearAssets();
aisleStore.getState().clearAisles();
eventStore.getState().clearEvents();
productStore.getState().clearProducts();
materialStore.getState().clearMaterials();
armBotStore.getState().clearArmBots();
machineStore.getState().clearMachines();
conveyorStore.getState().clearConveyors();
vehicleStore.getState().clearVehicles();
storageUnitStore.getState().clearStorageUnits();
}, [assetStore, aisleStore, eventStore, productStore, materialStore, armBotStore, machineStore, conveyorStore, vehicleStore, storageUnitStore]);
const contextValue = useMemo(() => (
{

View File

@@ -8,6 +8,7 @@ interface AisleStore {
updateAisle: (uuid: string, updated: Partial<Aisle>) => void;
removeAisle: (uuid: string) => void;
removePoint: (uuid: string) => Aisles;
clearAisles: () => void;
setPosition: (
pointUuid: string,
position: [number, number, number]
@@ -92,6 +93,12 @@ export const createAisleStore = () => {
return removedAisles;
},
clearAisles: () => {
set((state) => {
state.aisles = [];
})
},
setPosition: (pointUuid, position) => {
let updatedAisle: Aisle | undefined;
set((state) => {