Update styles, add marketplace components, and enhance drag-and-drop functionality
This commit is contained in:
@@ -11,6 +11,9 @@ interface DisplayZoneProps {
|
||||
panelOrder: Side[];
|
||||
lockedPanels: Side[];
|
||||
widgets: Widget[];
|
||||
zoneId: string;
|
||||
zoneViewPortTarget: number[];
|
||||
zoneViewPortPosition: number[];
|
||||
};
|
||||
};
|
||||
selectedZone: {
|
||||
@@ -18,6 +21,9 @@ interface DisplayZoneProps {
|
||||
activeSides: Side[];
|
||||
panelOrder: Side[];
|
||||
lockedPanels: Side[];
|
||||
zoneId: string;
|
||||
zoneViewPortTarget: number[];
|
||||
zoneViewPortPosition: number[];
|
||||
widgets: {
|
||||
id: string;
|
||||
type: string;
|
||||
@@ -32,6 +38,9 @@ interface DisplayZoneProps {
|
||||
activeSides: Side[];
|
||||
panelOrder: Side[];
|
||||
lockedPanels: Side[];
|
||||
zoneId: string;
|
||||
zoneViewPortTarget: number[];
|
||||
zoneViewPortPosition: number[];
|
||||
widgets: {
|
||||
id: string;
|
||||
type: string;
|
||||
@@ -152,21 +161,32 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
|
||||
return (
|
||||
<div
|
||||
ref={containerRef}
|
||||
className={`zoon-wrapper ${
|
||||
selectedZone.activeSides.includes("bottom") && "bottom"
|
||||
}`}
|
||||
className={`zoon-wrapper ${selectedZone?.activeSides?.includes("bottom") && "bottom"
|
||||
}`}
|
||||
>
|
||||
{Object.keys(zonesData).map((zoneName, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className={`zone ${
|
||||
selectedZone.zoneName === zoneName ? "active" : ""
|
||||
}`}
|
||||
className={`zone ${selectedZone.zoneName === zoneName ? "active" : ""
|
||||
}`}
|
||||
onClick={() => {
|
||||
|
||||
|
||||
setSelectedZone({
|
||||
zoneName,
|
||||
...zonesData[zoneName],
|
||||
activeSides: zonesData[zoneName].activeSides || [],
|
||||
panelOrder: zonesData[zoneName].panelOrder || [],
|
||||
lockedPanels: zonesData[zoneName].lockedPanels || [],
|
||||
widgets: zonesData[zoneName].widgets || [],
|
||||
zoneId: zonesData[zoneName]?.zoneId || "",
|
||||
zoneViewPortTarget: zonesData[zoneName].zoneViewPortTarget || [],
|
||||
zoneViewPortPosition:
|
||||
zonesData[zoneName].zoneViewPortPosition || [],
|
||||
});
|
||||
// setSelectedZone({
|
||||
// zoneName,
|
||||
// ...zonesData[zoneName],
|
||||
// });
|
||||
}}
|
||||
>
|
||||
{zoneName}
|
||||
@@ -176,4 +196,4 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
|
||||
);
|
||||
};
|
||||
|
||||
export default DisplayZone;
|
||||
export default DisplayZone;
|
||||
|
||||
Reference in New Issue
Block a user