export interface NavigationItem {
  text: string;
  href: string;
}

export interface HeaderData {
  logo: {
    lightSrc: string;
    darkSrc: string;
    alt: string;
    href: string;
  };
  navigation: NavigationItem[];
  buttons: {
    search: {
      href: string;
      ariaLabel: string;
      iconSrc: string;
      alt: string;
    };
    login: {
      href: string;
      id: string;
      text: string;
    };
    signup: {
      href: string;
      text: string;
      className: string;
    };
  };
  mobileMenu: {
    navigation: NavigationItem[];
    closeIcon: {
      src: string;
      alt: string;
    };
  };
  searchPopup: {
    placeholder: string;
    submitIcon: {
      src: string;
      alt: string;
    };
  };
}

export const headerData: HeaderData = {
  logo: {
    lightSrc: "/assets/images/logo.svg",
    darkSrc: "/assets/images/dark-logo.svg",
    alt: "Sasico Logo",
    href: "/",
  },
  navigation: [
    { text: "Home", href: "/" },
    { text: "Features", href: "/features" },
    { text: "Templates", href: "/templates" },
    { text: "Pricing", href: "/pricing" },
    { text: "Contact", href: "/contact" },
  ],
  buttons: {
    search: {
      href: "#",
      ariaLabel: "Search",
      iconSrc: "/assets/images/icon/search.svg",
      alt: "Search Icon",
    },
    login: {
      href: "#",
      id: "openMenu",
      text: "Log In",
    },
    signup: {
      href: "#",
      text: "Sign Up",
      className: "menu-btn",
    },
  },
  mobileMenu: {
    navigation: [
      { text: "Home", href: "/" },
      { text: "Features", href: "/features" },
      { text: "Templates", href: "/templates" },
      { text: "Pricing", href: "/pricing" },
      { text: "Contact", href: "/contact" },
    ],
    closeIcon: {
      src: "/assets/images/icon/xmark2.svg",
      alt: "Close Menu",
    },
  },
  searchPopup: {
    placeholder: "Enter Keywords...",
    submitIcon: {
      src: "/assets/images/icon/search.svg",
      alt: "Search Icon",
    },
  },
};