import { nanoid } from "nanoid";
import { Background, ICompKeys, Layout } from "../../typings";
import { cloneDeep } from "lodash";

export class DesignComp {
  id = nanoid();
  compKey: ICompKeys = "Text";
  value: any = undefined;
  layout: Layout = {};
  background: Background = {};
  children: Record<string, DesignComp> = {};

  constructor(data?: Partial<DesignComp>) {
    if (!data) return;
    const newData = filterObj(data);

    if (newData.children) {
      Object.entries(newData.children).forEach(([key, value]) => {
        newData.children[key] = new DesignComp(value as any);
      });
    }
    Object.assign(this, cloneDeep(newData));
  }
}

function filterObj(obj: any) {
  const filteredObj: any = {};
  Object.keys(obj).forEach((key) => {
    if (obj[key] !== null && obj[key] !== undefined) {
      filteredObj[key] = obj[key];
    }
  });
  return filteredObj;
}