export type PortfolioItem = {
  id: number;
  categories: string[];
  img: string;
  alt: string;
  title: string;
  href: string;
  tags: string[];
};

export type PortfolioGridFilterValue =
  (typeof portfolioGridFilters)[number]["value"];
export type PortfolioMasonryFilterValue =
  (typeof portfolioMasonryFilters)[number]["value"];

export const portfolioGridItems: PortfolioItem[] = [
  {
    id: 1,
    categories: ["design", "dev"],
    img: "/assets/images/project/pro1-1.webp",
    alt: "Mobile Application Design project image",
    title: "Mobile Application Design",
    href: "/layout-2",
    tags: ["Design", "Development"],
  },
  {
    id: 2,
    categories: ["design", "saas"],
    img: "/assets/images/project/pro1-2.webp",
    alt: "Smart Watch UI/UX Design project image",
    title: "Smart Watch UI/UX Design",
    href: "/layout-3",
    tags: ["Design", "SaaS"],
  },
  {
    id: 3,
    categories: ["dev", "saas"],
    img: "/assets/images/project/pro1-3.webp",
    alt: "Digital Agency Design project image",
    title: "Digital Agency Design",
    href: "/layout-2",
    tags: ["Development", "SaaS"],
  },
  {
    id: 4,
    categories: ["saas"],
    img: "/assets/images/project/pro1-4.webp",
    alt: "Book Cover Print Design project image",
    title: "Book Cover Print Design",
    href: "/layout-1",
    tags: ["Dashboard", "SaaS"],
  },
  {
    id: 5,
    categories: ["design"],
    img: "/assets/images/project/pro1-5.webp",
    alt: "Cosmetic Bottle with Label project image",
    title: "Cosmetic Bottle with Label",
    href: "/layout-3",
    tags: ["Dashboard", "Design"],
  },
  {
    id: 6,
    categories: ["dev", "saas"],
    img: "/assets/images/project/pro1-6.webp",
    alt: "Hoodie Design and Branding project image",
    title: "Hoodie Design and Branding",
    href: "/layout-2",
    tags: ["Development", "SaaS"],
  },
  {
    id: 7,
    categories: ["design"],
    img: "/assets/images/project/pro1-7.webp",
    alt: "Crafted for Modern Design project image",
    title: "Crafted for Modern Design",
    href: "/layout-1",
    tags: ["Dashboard", "Design"],
  },
  {
    id: 8,
    categories: ["marketing"],
    img: "/assets/images/project/pro1-8.webp",
    alt: "Elegant iPhone Pro Mockup project image",
    title: "Elegant iPhone Pro Mockup",
    href: "/layout-3",
    tags: ["Marketing", "Software"],
  },
];

export const portfolioGridFilters = [
  { label: "Show All", value: "*" },
  { label: "Design", value: ".design" },
  { label: "Development", value: ".dev" },
  { label: "Marketing", value: ".marketing" },
  { label: "SaaS", value: ".saas" },
] as const;

export const portfolioMasonry2Items: PortfolioItem[] = [
  {
    id: 1,
    categories: ["design", "dev"],
    img: "/assets/images/project/pro4-1.webp",
    alt: "Mobile Application Design project image",
    title: "Mobile Application Design",
    href: "/layout-2",
    tags: ["Design", "Development"],
  },
  {
    id: 2,
    categories: ["design", "saas"],
    img: "/assets/images/project/pro4-2.webp",
    alt: "Smart Watch UI/UX Design project image",
    title: "Smart Watch UI/UX Design",
    href: "/layout-3",
    tags: ["Design", "SaaS"],
  },
  {
    id: 3,
    categories: ["dev", "saas"],
    img: "/assets/images/project/pro4-3.webp",
    alt: "Digital Agency Design project image",
    title: "Digital Agency Design",
    href: "/layout-2",
    tags: ["Development", "SaaS"],
  },
  {
    id: 4,
    categories: ["saas", "marketing"],
    img: "/assets/images/project/pro4-4.webp",
    alt: "Book Cover Print Design project image",
    title: "Book Cover Print Design",
    href: "/layout-1",
    tags: ["marketing", "SaaS"],
  },
  {
    id: 5,
    categories: ["design", "marketing"],
    img: "/assets/images/project/pro4-5.webp",
    alt: "Cosmetic Bottle with Label project image",
    title: "Cosmetic Bottle with Label",
    href: "/layout-3",
    tags: ["Dashboard", "Design"],
  },
  {
    id: 6,
    categories: ["dev", "saas"],
    img: "/assets/images/project/pro4-6.webp",
    alt: "Hoodie Design and Branding project image",
    title: "Hoodie Design and Branding",
    href: "/layout-2",
    tags: ["Development", "SaaS"],
  },
  {
    id: 7,
    categories: ["design"],
    img: "/assets/images/project/pro4-7.webp",
    alt: "Crafted for Modern Design project image",
    title: "Crafted for Modern Design",
    href: "/layout-1",
    tags: ["Dashboard", "Design"],
  },
];

export const portfolioMasonry3Items: PortfolioItem[] = [
  {
    id: 1,
    categories: ["design", "dev"],
    img: "/assets/images/project/pro6-1.png",
    alt: "Mobile Application Design project image",
    title: "Mobile Application Design",
    href: "/layout-2",
    tags: ["Design", "Development"],
  },
  {
    id: 2,
    categories: ["design", "saas"],
    img: "/assets/images/project/pro6-2.png",
    alt: "Smart Watch UI/UX Design project image",
    title: "Smart Watch UI/UX Design",
    href: "/layout-3",
    tags: ["Design", "SaaS"],
  },
  {
    id: 3,
    categories: ["dev", "saas"],
    img: "/assets/images/project/pro6-3.png",
    alt: "Digital Agency Design project image",
    title: "Digital Agency Design",
    href: "/layout-2",
    tags: ["Development", "SaaS"],
  },
  {
    id: 4,
    categories: ["saas", "marketing"],
    img: "/assets/images/project/pro6-4.png",
    alt: "Book Cover Print Design project image",
    title: "Book Cover Print Design",
    href: "/layout-1",
    tags: ["marketing", "SaaS"],
  },
  {
    id: 5,
    categories: ["design", "marketing"],
    img: "/assets/images/project/pro6-5.png",
    alt: "Cosmetic Bottle with Label project image",
    title: "Cosmetic Bottle with Label",
    href: "/layout-3",
    tags: ["Dashboard", "Design"],
  },
  {
    id: 6,
    categories: ["dev", "saas"],
    img: "/assets/images/project/pro6-6.png",
    alt: "Hoodie Design and Branding project image",
    title: "Hoodie Design and Branding",
    href: "/layout-2",
    tags: ["Development", "SaaS"],
  },
  {
    id: 7,
    categories: ["design"],
    img: "/assets/images/project/pro6-7.png",
    alt: "Crafted for Modern Design project image",
    title: "Crafted for Modern Design",
    href: "/layout-1",
    tags: ["Dashboard", "Design"],
  },
];

export const portfolioMasonryFilters = [
  { label: "Show All", value: "*" },
  { label: "Mobile", value: ".design" },
  { label: "Mockup", value: ".dev" },
  { label: "Product", value: ".marketing" },
  { label: "Software", value: ".saas" },
] as const;

export type RelatedProjectItem = Pick<
  PortfolioItem,
  "id" | "img" | "alt" | "title" | "href" | "tags"
> & {
  aosDelay: number;
};

export const relatedProjects: RelatedProjectItem[] = [
  {
    id: 2,
    img: "/assets/images/project/pro1-2.webp",
    alt: "Smart Watch UI/UX Design mockup",
    title: "Smart Watch UI/UX Design",
    href: "/layout-3",
    tags: ["Design", "SaaS"],
    aosDelay: 300,
  },
  {
    id: 4,
    img: "/assets/images/project/pro1-4.webp",
    alt: "Book Cover Print Design example",
    title: "Book Cover Print Design",
    href: "/layout-1",
    tags: ["Dashboard", "SaaS"],
    aosDelay: 400,
  },
  {
    id: 6,
    img: "/assets/images/project/pro1-6.webp",
    alt: "Hoodie Design and Branding mockup",
    title: "Hoodie Design and Branding",
    href: "/layout-2",
    tags: ["Development", "SaaS"],
    aosDelay: 500,
  },
];