Refactor sidebar toggle functionality to support independent left and right UI states; update related components and styles for improved usability
This commit is contained in:
@@ -25,7 +25,7 @@ import EventProperties from "./properties/eventProperties/EventProperties";
|
||||
|
||||
const SideBarRight: React.FC = () => {
|
||||
const { activeModule } = useModuleStore();
|
||||
const { toggleUI } = useToggleStore();
|
||||
const { toggleUIRight } = useToggleStore();
|
||||
const { subModule, setSubModule } = useSubModuleStore();
|
||||
const { selectedFloorItem } = useSelectedFloorItem();
|
||||
const { selectedEventData } = useSelectedEventData();
|
||||
@@ -55,9 +55,9 @@ const SideBarRight: React.FC = () => {
|
||||
}, [activeModule, selectedEventData, selectedEventSphere, setSubModule]);
|
||||
|
||||
return (
|
||||
<div className={`sidebar-right-wrapper ${toggleUI ? "open" : "closed"}`}>
|
||||
<div className={`sidebar-right-wrapper ${toggleUIRight ? "open" : "closed"}`}>
|
||||
<Header />
|
||||
{toggleUI && (
|
||||
{toggleUIRight && (
|
||||
<div className="sidebar-actions-container">
|
||||
{activeModule !== "simulation" && (
|
||||
<button
|
||||
@@ -104,7 +104,7 @@ const SideBarRight: React.FC = () => {
|
||||
</div>
|
||||
)}
|
||||
{/* process builder */}
|
||||
{toggleUI &&
|
||||
{toggleUIRight &&
|
||||
subModule === "properties" &&
|
||||
activeModule !== "visualization" &&
|
||||
!selectedFloorItem && (
|
||||
@@ -114,7 +114,7 @@ const SideBarRight: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{toggleUI &&
|
||||
{toggleUIRight &&
|
||||
subModule === "properties" &&
|
||||
activeModule !== "visualization" &&
|
||||
selectedFloorItem && (
|
||||
@@ -124,7 +124,7 @@ const SideBarRight: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{toggleUI &&
|
||||
{toggleUIRight &&
|
||||
subModule === "zoneProperties" &&
|
||||
(activeModule === "builder" || activeModule === "simulation") && (
|
||||
<div className="sidebar-right-container">
|
||||
@@ -134,7 +134,7 @@ const SideBarRight: React.FC = () => {
|
||||
</div>
|
||||
)}
|
||||
{/* simulation */}
|
||||
{toggleUI && activeModule === "simulation" && (
|
||||
{toggleUIRight && activeModule === "simulation" && (
|
||||
<>
|
||||
{subModule === "simulations" && (
|
||||
<div className="sidebar-right-container">
|
||||
@@ -160,7 +160,7 @@ const SideBarRight: React.FC = () => {
|
||||
</>
|
||||
)}
|
||||
{/* realtime visualization */}
|
||||
{toggleUI && activeModule === "visualization" && <Visualization />}
|
||||
{toggleUIRight && activeModule === "visualization" && <Visualization />}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user