Dwinzo_dev/app/src/store/useDroppedObjectsStore.ts

import { create } from "zustand";

type DroppedObject = {
  className: string;
  id: string;
  position: {
    top: number | "auto";
    left: number | "auto";
    right: number | "auto";
    bottom: number | "auto";
  };
  value?: number;
  per?: string;
  header?: string;
  Data: {};
};

type Zone = {
  zoneName: string;
  zoneId: string;
  objects: DroppedObject[];
};

type DroppedObjectsState = {
  zones: Record<string, Zone>;
  setZone: (zoneName: string, zoneId: string) => void;
  addObject: (zoneName: string, newObject: DroppedObject) => void;
  updateObjectPosition: (
    zoneName: string,
    index: number,
    newPosition: {
      top: number | "auto";
      left: number | "auto";
      right: number | "auto";
      bottom: number | "auto";
    }
  ) => void;
};

export const useDroppedObjectsStore = create<DroppedObjectsState>((set) => ({
  zones: {},

  setZone: (zoneName: string, zoneId: string) =>
    set((state) => ({
      zones: {
        [zoneName]: state.zones[zoneName] || { zoneName, zoneId, objects: [] }, // Keep existing zone if it exists
      },
    })),

  addObject: (zoneName: string, newObject: DroppedObject) =>
    set((state) => ({
      zones: {
        ...state.zones,
        [zoneName]: {
          ...state.zones[zoneName],
          objects: [...state.zones[zoneName].objects, newObject], // Append new object
        },
      },
    })),

  updateObjectPosition: (zoneName, index, newPosition) =>
    set((state) => {
      const zone = state.zones[zoneName];
      if (!zone) return state;
      return {
        zones: {
          [zoneName]: {
            ...zone,
            objects: zone.objects.map((obj, i) =>
              i === index ? { ...obj, position: newPosition } : obj
            ),
          },
        },
      };
    }),
}));

export interface DroppedObjects {
  header: string;
  id: string;
  Data: {};
  value: string | number; // ✅ Allows both numbers and formatted strings
  per: string;
  className: string;
  position: { top: number; left: number; right: number; bottom: number }; // ✅ Ensures position is a tuple
}

export interface Zones {
  zoneName: string;
  zoneId: string;
  objects: DroppedObject[];
}