Dwinzo-Beta/Dwinzo_dev
4
0
Fork 3
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor keyboard shortcut handling and improve module switching logic

Browse Source
This commit is contained in:
Vishnu
2025-05-08 13:42:42 +05:30
parent 8bf48bfcfe
commit a2480748a8
9 changed files with 174 additions and 204 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
app/src/components/ui/ModuleToggle.tsx
View File

@@ -1,4 +1,4 @@
import React, { useEffect } from "react";
import React from "react";
import useModuleStore from "../../store/useModuleStore";
import {
BuilderIcon,
@@ -14,45 +14,60 @@ const ModuleToggle: React.FC = () => {
return (
<div className="module-toggle-container">
<div
className={`module-list ${activeModule === "builder" && "active"}`}
<button
className={`module-list ${activeModule === "builder" ? "active" : ""}`}
onClick={() => {
setActiveModule("builder");
setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true)
setToggleUI(
localStorage.getItem("navBarUi")
? localStorage.getItem("navBarUi") === "true"
: true
);
}}
>
<div className="icon">
<BuilderIcon isActive={activeModule === "builder"} />
</div>
<div className="module">Builder</div>
</div>
<div
className={`module-list ${activeModule === "simulation" && "active"}`}
</button>
<button
className={`module-list ${
activeModule === "simulation" ? "active" : ""
}`}
onClick={() => {
setActiveModule("simulation");
setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true)
setToggleUI(
localStorage.getItem("navBarUi")
? localStorage.getItem("navBarUi") === "true"
: true
);
}}
>
<div className="icon">
<SimulationIcon isActive={activeModule === "simulation"} />
</div>
<div className="module">Simulation</div>
</div>
<div
className={`module-list ${activeModule === "visualization" && "active"
}`}
</button>
<button
className={`module-list ${
activeModule === "visualization" ? "active" : ""
}`}
onClick={() => {
setActiveModule("visualization");
setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true)
setToggleUI(
localStorage.getItem("navBarUi")
? localStorage.getItem("navBarUi") === "true"
: true
);
}}
>
<div className="icon">
<VisualizationIcon isActive={activeModule === "visualization"} />
</div>
<div className="module">Visualization</div>
</div>
<div
className={`module-list ${activeModule === "market" && "active"}`}
</button>
<button
className={`module-list ${activeModule === "market" ? "active" : ""}`}
onClick={() => {
setActiveModule("market");
setToggleUI(false);
@@ -62,7 +77,7 @@ const ModuleToggle: React.FC = () => {
<CartIcon isActive={activeModule === "market"} />
</div>
<div className="module">Market Place</div>
</div>
</button>
</div>
);
};