// Enums for common types
export enum HorizontalAlignment {
  LEFT = "left",
  CENTER = "center",
  RIGHT = "right",
}

export enum VerticalAlignment {
  TOP = "top",
  MIDDLE = "middle",
  BOTTOM = "bottom",
}

export enum ButtonSize {
  SMALL = "small",
  MEDIUM = "medium",
  LARGE = "large",
}

export enum ImageSize {
  COVER = "cover",
  CONTAIN = "contain",
  AUTO = "auto",
  REPEAT = "repeat",
  REPEAT_X = "repeat-x",
  REPEAT_Y = "repeat-y",
  NO_REPEAT = "no-repeat",
}

export enum BackgroundSize {
  COVER = "cover",
  CONTAIN = "contain",
  ROUND = "round",
  CUSTOM = "custom",
}

export enum BackgroundPosition {
  CENTER = "center center",
  TOP_LEFT = "top left",
  TOP_CENTER = "top center",
  TOP_RIGHT = "top right",
  CENTER_LEFT = "center left",
  CENTER_RIGHT = "center right",
  BOTTOM_LEFT = "bottom left",
  BOTTOM_CENTER = "bottom center",
  BOTTOM_RIGHT = "bottom right",
}

export enum SectionName {
  HEADER = "header",
  CONTENT = "content",
  FOOTER = "footer",
}

// New enums for element selection
export enum ElementType {
  TEXT = "text",
  BUTTON = "button",
  IMAGE = "image",
  SOCIAL = "social",
}

// Social network types
export enum SocialNetworkType {
  FACEBOOK = "facebook",
  TWITTER = "twitter",
  INSTAGRAM = "instagram",
  LINKEDIN = "linkedin",
  YOUTUBE = "youtube",
  TELEGRAM = "telegram",
  WHATSAPP = "whatsapp",
  TIKTOK = "tiktok",
  PINTEREST = "pinterest",
  SNAPCHAT = "snapchat",
  GITHUB = "github",
  DISCORD = "discord",
}

export enum SocialIconSize {
  SMALL = "small",
  MEDIUM = "medium",
  LARGE = "large",
}

export enum SocialIconStyle {
  CIRCLE = "circle",
  SQUARE = "square",
  ROUNDED = "rounded",
}

// Icon pack types for social icons
export enum SocialIconPack {
  ORIGINAL = "original",
  ICON1 = "icon1",
  ICON2 = "icon2",
  ICON3 = "icon3",
}

// New type for selected element
export type SelectedElement = {
  type: ElementType;
  elementId: string;
  itemId: string;
  sectionKey: string;
} | null;

export type PersonalityDataType = {
  [key: string]: SectionType & { name: string; isContent?: boolean };
};

export type SectionType = {
  columnsCount: number;
  sortNumber: number;
  items: SectionItemType[];
  padding?: string;
  height?: string;
  border?: {
    width?: string;
    color?: string;
    style?: "solid" | "dashed" | "dotted" | "none";
    sides?: ("top" | "bottom" | "left" | "right")[];
  };
};

export type SectionItemType = {
  id: string;
  backgroundColor: string;
  backgroundImage?: string;
  texts: TextType[];
  buttons: ButtonType[];
  images: ImageType[];
  socials: SocialType[];
  alignment?: HorizontalAlignment;
  verticalAlignment?: VerticalAlignment;
  style?: {
    borderRadius?: number;
    padding?: string;
    fontFamily?: string;
    backgroundSize?: string;
    backgroundRepeat?: string;
    backgroundPosition?: string;
  };
};

export type TextType = {
  id: string;
  text: string;
  fontSize?: number;
  fontWeight?: number;
  fontFamily?: string;
  color?: string;
  alignment?: HorizontalAlignment;
  verticalAlignment?: VerticalAlignment;
};

export type ButtonType = {
  id: string;
  text: string;
  link: string;
  size: ButtonSize;
  isBorder: boolean;
  borderSize: number;
  textColor: string;
  backgroundColor: string;
  borderColor: string;
  alignment?: HorizontalAlignment;
  verticalAlignment?: VerticalAlignment;
};

export type ImageType = {
  id: string;
  src: string;
  alt?: string;
  size: ImageSize;
  width?: string;
  height?: string;
  alignment?: HorizontalAlignment;
  verticalAlignment?: VerticalAlignment;
};

export type SocialType = {
  id: string;
  networkType: SocialNetworkType;
  link: string;
  size: SocialIconSize;
  style: SocialIconStyle;
  color?: string;
  iconPack?: SocialIconPack; // default to ORIGINAL when not provided
  alignment?: HorizontalAlignment;
  verticalAlignment?: VerticalAlignment;
};

export type PersonalityStore = {
  data: PersonalityDataType;
  activeSection: string;
  activeItemIndex: number;
  selectedElement: SelectedElement; // New field for element selection
  isEditMode: boolean; // New field for edit mode

  setData: (data: PersonalityDataType) => void;
  setActiveSection: (section: string) => void;
  setActiveItemIndex: (index: number) => void;
  setSelectedElement: (element: SelectedElement) => void; // New method
  setEditMode: (isEdit: boolean) => void; // New method
  getSortedSectionKeys: () => string[]; // New method to get sorted section keys

  // Section management methods
  addSection: (afterSectionKey?: string) => void;
  removeSection: (sectionKey: string) => void;

  setItems: (sectionKey: string, items: SectionItemType[]) => void;
  addItem: (sectionKey: string, item: Omit<SectionItemType, "id">) => void;
  updateItem: (
    sectionKey: string,
    id: string,
    updates: Partial<SectionItemType>
  ) => void;
  updateActiveItem: (updates: Partial<SectionItemType>) => void;
  removeItem: (sectionKey: string, id: string) => void;
  setColumnsCount: (sectionKey: string, columnsCount: number) => void;
  setSectionPadding: (sectionKey: string, padding: string) => void;
  setSectionHeight: (sectionKey: string, height: string) => void;
  setSectionBorder: (
    sectionKey: string,
    border: {
      width?: string;
      color?: string;
      style?: "solid" | "dashed" | "dotted" | "none";
      sides?: ("top" | "bottom" | "left" | "right")[];
    }
  ) => void;
  addText: (
    sectionKey: string,
    itemId: string,
    text: Omit<TextType, "id">
  ) => void;
  addTextToActiveItem: (text: Omit<TextType, "id">) => void;
  addButton: (
    sectionKey: string,
    itemId: string,
    button: Omit<ButtonType, "id">
  ) => void;
  addButtonToActiveItem: (button: Omit<ButtonType, "id">) => void;
  updateText: (
    sectionKey: string,
    itemId: string,
    textId: string,
    updates: Partial<TextType>
  ) => void;
  updateButton: (
    sectionKey: string,
    itemId: string,
    buttonId: string,
    updates: Partial<ButtonType>
  ) => void;
  addImage: (
    sectionKey: string,
    itemId: string,
    image: Omit<ImageType, "id">
  ) => void;
  addImageToActiveItem: (image: Omit<ImageType, "id">) => void;
  updateImage: (
    sectionKey: string,
    itemId: string,
    imageId: string,
    updates: Partial<ImageType>
  ) => void;
  // Social network methods
  addSocial: (
    sectionKey: string,
    itemId: string,
    social: Omit<SocialType, "id">
  ) => void;
  addSocialToActiveItem: (social: Omit<SocialType, "id">) => void;
  updateSocial: (
    sectionKey: string,
    itemId: string,
    socialId: string,
    updates: Partial<SocialType>
  ) => void;
  deleteSocial: (sectionKey: string, itemId: string, socialId: string) => void;
  // New methods for deleting elements
  deleteText: (sectionKey: string, itemId: string, textId: string) => void;
  deleteButton: (sectionKey: string, itemId: string, buttonId: string) => void;
  deleteImage: (sectionKey: string, itemId: string, imageId: string) => void;
};

export type TemplateType = {
  name: string;
  rawHtml: string;
  structure: PersonalityDataType;
  thumbnailUrl: string;
};

export type GetTemplateResponse = {
  statusCode: number;
  success: boolean;
  data: {
    template: {
      id: string;
      createdAt: string;
      updatedAt: string;
      deletedAt: string | null;
      name: string;
      structure: PersonalityDataType;
      currentVersion: string;
      selected: boolean;
      business: BusinessType;
    };
  };
};

// API Response Types
export type BusinessType = {
  id: string;
  createdAt: string;
  updatedAt: string;
  deletedAt: string | null;
  danakSubscriptionId: string;
  name: string;
  slug: string;
  logoUrl: string | null;
  quota: number;
  usedQuota: string;
  remainingQuota: string;
  domain: string;
  emailSignature: string;
};

export type TemplateResponseType = {
  id: string;
  createdAt: string;
  updatedAt: string;
  deletedAt: string | null;
  name: string;
  currentVersion: string;
  selected: boolean;
  business: BusinessType;
  thumbnailUrl: string;
};

export type PagerType = {
  page: number;
  limit: number;
  totalItems: number;
  totalPages: number;
  prevPage: boolean;
  nextPage: boolean;
};

export type TemplatesResponseDataType = {
  pager: PagerType;
  templates: TemplateResponseType[];
  pagination: boolean;
};

export type TemplatesResponseType = {
  statusCode: number;
  success: boolean;
  data: TemplatesResponseDataType;
};
