import {
  Dashboard as DashboardIcon,
  NotificationsNone as NotificationsIcon,
  FormatSize as TypographyIcon,
  FilterNone as UIElementsIcon,
  BorderAll as TableIcon,
  QuestionAnswer as SupportIcon,
  LibraryBooks as LibraryIcon,
  HelpOutline as FAQIcon,
  Image as ImageIcon,
  Build as BuildIcon,
  Settings as SettingsIcon,
  NetworkCheck as NetworkCheckIcon
} from "@material-ui/icons";
import Dot from "./components/Dot";

let menu = [
  {
    id: 0,
    label: "Dashboard",
    link: "/dashboard",
    icon: <DashboardIcon />
  },
  {
    id: 1,
    label: "Resources",
    link: "/resources",
    icon: <ImageIcon />
  },

  { id: 2, type: "divider" },
  { id: 3, type: "title", label: "System" },
  {
    id: 4,
    label: "Admin",
    link: "/admin",
    icon: <BuildIcon />
  },
  {
    id: 5,
    label: "Settings",
    link: "/settings",
    icon: <SettingsIcon />,
    children: [
      {
        id: 50,
        label: "Notifications",
        link: "/notifications",
        icon: <NotificationsIcon />
      }
    ]
  },
  {
    id: 6,
    label: "Health",
    link: "/health",
    icon: <NetworkCheckIcon />
  },
  { id: 7, type: "divider" },
  { id: 8, type: "title", label: "Community" },
  {
    id: 9,
    label: "Library",
    link: "https://dev.azure.com/tstanciu94/CDN",
    icon: <LibraryIcon />
  },
  {
    id: 10,
    label: "Support",
    link: "https://toodle.ddns.net/forum",
    icon: <SupportIcon />
  },
  {
    id: 11,
    label: "FAQ",
    link: "https://toodle.ddns.net/forum",
    icon: <FAQIcon />
  }
];

const enableTemplateContent =
  process.env.REACT_APP_ENABLE_TEMPLATE_CONTENT === "True";

if (enableTemplateContent) {
  menu.push(
    { id: 12, type: "divider" },
    {
      id: 13,
      label: "Template",
      children: [
        {
          id: 14,
          label: "Typography",
          link: "/typography",
          icon: <TypographyIcon />
        },
        { id: 15, label: "Tables", link: "/tables", icon: <TableIcon /> },
        {
          id: 16,
          label: "UI Elements",
          link: "/ui",
          icon: <UIElementsIcon />,
          children: [
            { label: "Icons", link: "/ui/icons" },
            { label: "Charts", link: "/ui/charts" },
            { label: "Maps", link: "/ui/maps" }
          ]
        },
        {
          id: 17,
          label: "My recent",
          link: "",
          icon: <Dot size="small" color="warning" />
        },
        {
          id: 18,
          label: "Starred",
          link: "",
          icon: <Dot size="small" color="primary" />
        },
        {
          id: 19,
          label: "Background",
          link: "",
          icon: <Dot size="small" color="secondary" />
        }
      ]
    }
  );
}

export default menu;