import type { ReactNode } from "react";

import {
  RiBox3Line,
  RiArticleLine,
  RiPriceTag3Line,
  RiReceiptLine,
  RiSettings3Line,
  RiShoppingCartLine,
} from "@remixicon/react";

export type SidebarNavItem = {
  title: string;
  path?: string;
  icon?: ReactNode;
  isActive?: boolean;
  subItems?: SidebarNavItem[];
};

export type SidebarNavGroup = {
  label?: string;
  items: SidebarNavItem[];
};

export const navGroups: SidebarNavGroup[] = [
  {
    label: "Retail Core",
    items: [
      {
        title: "Catalog",
        path: "/admin/dashboard/catalog",
        icon: <RiPriceTag3Line />,
      },
      {
        title: "Point-of-Sale (POS)",
        path: "/admin/dashboard/pos",
        icon: <RiShoppingCartLine />,
      },
    ],
  },
  {
    label: "Operations",
    items: [
      {
        title: "Inventory",
        path: "/admin/dashboard/inventory",
        icon: <RiBox3Line />,
      },
      {
        title: "Orders & Fulfillment",
        path: "/admin/dashboard/orders",
        icon: <RiReceiptLine />,
      },
    ],
  },
  {
    label: "Administration",
    items: [
      {
        title: "Store Settings",
        path: "/admin/dashboard/settings",
        icon: <RiSettings3Line />,
      },
      {
        title: "Footer & Pages",
        path: "/admin/dashboard/pages",
        icon: <RiArticleLine />,
      },
    ],
  },
];

export const navLinks: SidebarNavItem[] = [
  ...navGroups.flatMap((group) =>
    group.items.flatMap((item) =>
      item.subItems?.length ? [item, ...item.subItems] : [item],
    ),
  ),
];