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

Refactor Simulations component layout: streamline event handling and add comparison functionality

This commit is contained in:
Jerald-Golden-B 2025-04-30 12:46:00 +05:30
parent 73f9bb29f7
commit 304d6689c1
1 changed files with 60 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

101
app/src/components/layout/sidebarRight/simulation/Simulations.tsx
View File

@ -153,54 +153,73 @@ const Simulations: React.FC = () => {
/>
</div>
{products.length > 1 && (
<>
<div
className="remove-button"
onClick={() => handleRemoveProduct(product.productId)}
>
<RemoveIcon />
</div>
<div className="simulation-process section">
<button
className="collapse-header-container"
onClick={() => setOpenObjects(!openObjects)}
>
<div className="header">Events</div>
<div className="arrow-container">
<ArrowIcon />
</div>
</button>
{openObjects && events.map((event, index) => <List key={index} val={event} />)}
</div>
</>
)}
{selectedAsset && (
<RenderOverlay>
<EditWidgetOption
options={["Add to Product", "Remove from Product"]}
onClick={(option) => {
if (option === "Add to Product") {
handleAddEventToProduct({
event: getEventByModelUuid(selectedAsset.modelUuid),
addEvent,
selectedProduct,
clearSelectedAsset
});
} else {
handleRemoveEventFromProduct();
}
}}
/>
</RenderOverlay>
<div
className="remove-button"
onClick={() => handleRemoveProduct(product.productId)}
>
<RemoveIcon />
</div>
)}
</div>
))}
</div>
<div
className="resize-icon"
id="action-resize"
onMouseDown={(e) => handleResize(e, productsContainerRef)}
>
<ResizeHeightIcon />
</div>
</div>
</div>
<div className="simulation-process section">
<button
className="collapse-header-container"
onClick={() => setOpenObjects(!openObjects)}
>
<div className="header">Events</div>
<div className="arrow-container">
<ArrowIcon />
</div>
</button>
{openObjects &&
events.map((event, index) => <List key={index} val={event} />)}
</div>
<div className="compare-simulations-container">
<div className="compare-simulations-header">
Need to Compare Layout?
</div>
<div className="content">
Click <span>'Compare'</span> to review and analyze the layout
differences between them.
</div>
<div className="input">
<input type="button" value={"Compare"} className="submit" />
</div>
</div>
</div>
{selectedAsset && (
<RenderOverlay>
<EditWidgetOption
options={["Add to Product", "Remove from Product"]}
onClick={(option) => {
if (option === "Add to Product") {
handleAddEventToProduct({
event: getEventByModelUuid(selectedAsset.modelUuid),
addEvent,
selectedProduct,
clearSelectedAsset
});
} else {
handleRemoveEventFromProduct();
}
}}
/>
</RenderOverlay>
)}
</div>
)
};