// import { isObject, isEqual } from '/lodash';

const hasPlainChildren = (obj: any) => {
  for (const key of Object.keys(obj)) {
    const child = obj[key] as any;
    if (!_.isObject(child)) continue;
    for (const childKey of Object.keys(child)) {
      const newChild = (child as any)[childKey];
      if (_.isObject(newChild)) return false;
    }
  }
  return true;
};

const promoteValues = (obj: any, ignoreList: string[]) => {
  const newObj = { ...obj };
  const items = [] as { key: string; value: any; presentIn: string[] }[];
  if (!_.isObject(newObj)) {
    return newObj;
  }
  for (const key of Object.keys(newObj)) {
    const child = (newObj as any)[key];
    if (!_.isObject(child)) continue;
    for (const prop in child) {
      if (_.isObject((child as any)[prop])) continue;
      const valueInSet = items.find(
        (item) => item.key === prop && item.value === (child as any)[prop],
      );
      if (valueInSet) {
        valueInSet.presentIn.push(key);
      } else {
        items.push({
          key: prop,
          value: (child as any)[prop],
          presentIn: [key],
        });
      }
    }
  }
  for (const item of items.filter((item) =>
    _.isEqual(
      item.presentIn,
      Object.keys(newObj).filter((key) => !ignoreList.includes(key)),
    ),
  )) {
    (newObj as any)[item.key] = item.value;
    for (const key of Object.keys(newObj)) {
      const child = (newObj as any)[key] as any;
      if (_.isObject(child)) {
        (child as any)[item.key] = undefined;
      }
    }
  }
  return newObj;
};

export const simplifyObject = (obj: object, ignoreList: string[]) => {
  let newObject = { ...obj } as any;
  if (!hasPlainChildren(newObject)) {
    for (const key of Object.keys(newObject)) {
      if (!_.isObject(newObject[key])) continue;
      newObject[key] = simplifyObject(newObject[key], ignoreList);
    }
  }
  newObject = promoteValues(newObject, ignoreList);
  return newObject;
};
const foo = {
  button: {
    idle: {
      margin: "16px 8px",
      backgroundColor: "white"
    },
    hover: {
    margin: "16px 8px",
    backgroundColor: "lightblue"
  },
  focus: {
    margin: "16px 8px",
    backgroundColor: "darkblue"
  }
}
};

window.time.innerHTML = Date.now(); 
window.before.innerHTML = JSON.stringify(foo, null, ' ');
window.after.innerHTML = JSON.stringify(simplifyObject(foo,[]), null, ' ');