import { Link } from "@nextui-org/link";
import {
  Navbar,
  NavbarContent,
  NavbarItem,
  NavbarMenuToggle,
} from "@nextui-org/navbar";
import {
  Button,
  Dropdown,
  DropdownItem,
  DropdownMenu,
  DropdownTrigger,
} from "@nextui-org/react";
import {
  ChevronDownIcon,
  ChevronRightIcon,
  FbIcon,
  IdnIcon,
  IgIcon,
  TtIcon,
  TwIcon,
  YtIcon,
} from "../../icons";
import { ThemeSwitch } from "../../theme-switch";
import { usePathname } from "next/navigation";

export default function NavbarSatker() {
  const pathname = usePathname();
  const newPathname = pathname.split("/")[3];
  const isPolda = pathname.split("/")[2] == "polda";
  // console.log(isPolda, "polda");

  return (
    <Navbar maxWidth="full" height="8rem" className="dark:bg-[#1F1A17]">
      <div className="w-full h-full flex">
        <div className="w-auto lg:w-2/12 flex">
          <Link href={"#"}>
            <div className="h-full flex">
              <img
                src="/assets/satker/EPPID2.png"
                alt="logo"
                className="w-auto lg:w-full h-auto lg:h-full p-0 lg:p-2 flex"
              />
              <div className="absolute top-5 right-[-35px]">
                <img
                  src={`/assets/${
                    isPolda ? "polda" : "satker"
                  }/${newPathname}.svg`}
                  alt=""
                  className={isPolda ? "w-14 mr-12 mt-1" : "w-36 mr-1"}
                />
                <div>{}</div>
              </div>
            </div>
          </Link>
        </div>
        <div className="w-auto lg:w-10/12  hidden md:flex flex-col justify-cente pt-3 space-y-3">
          <div className="flex items-center justify-end gap-1 md:gap-5">
            <div className="flex gap-1 lg:gap-3 items-center">
              <div>
                <FbIcon />
              </div>
              <div>
                <IgIcon />
              </div>
              <div>
                <YtIcon />
              </div>
              <div>
                <TwIcon />
              </div>
              <div>
                <TtIcon />
              </div>
            </div>
            <div>
              <IdnIcon />
            </div>
          </div>
          <div className="flex flex-wrap items-center justify-around">
            <NavbarItem>
              <Link
                href={
                  isPolda
                    ? `/portal-ppid/polda/${newPathname}`
                    : `/portal-ppid/satuan-kerja/${newPathname}`
                }
                color="foreground"
              >
                Beranda
              </Link>
            </NavbarItem>
            <Dropdown>
              <NavbarItem>
                <DropdownTrigger>
                  <Button
                    disableRipple
                    className="p-0 bg-transparent data-[hover=true]:bg-transparent text-medium"
                    radius="sm"
                    variant="light"
                    endContent={<ChevronDownIcon className="pt-1" />}
                  >
                    Informasi Publik
                  </Button>
                </DropdownTrigger>
              </NavbarItem>
              <DropdownMenu
                aria-label="tentang"
                title="Tentang"
                className="pt-4"
                classNames={
                  {
                    // base: " border-2 border-red-500 bg-white",
                    // list: "border-2 gap-2 flex flex-row flex-wrap"
                    // list: "gap-2 flex flex-row flex-wrap"s
                  }
                }
                itemClasses={{
                  // base: "border border-red-700 w-[350px]"
                  base: "w-[350px]",
                }}
              >
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/informasi-publik/informasi-serta-merta`
                        : `/portal-ppid/satuan-kerja/${newPathname}/informasi-publik/informasi-serta-merta`
                    }
                    color="foreground"
                  >
                    Informasi Serta Merta
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/informasi-publik/informasi-berkala`
                        : `/portal-ppid/satuan-kerja/${newPathname}/informasi-publik/informasi-berkala`
                    }
                    color="foreground"
                  >
                    Informasi Berkala
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/informasi-publik/informasi-setiap-saat`
                        : `/portal-ppid/satuan-kerja/${newPathname}/informasi-publik/informasi-setiap-saat`
                    }
                    color="foreground"
                  >
                    Informasi Setiap Saat
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/informasi-publik/informasi-dikecualikan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/informasi-publik/informasi-dikecualikan`
                    }
                    color="foreground"
                  >
                    Informasi Dikecualikan
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/informasi-publik/informasi-penerangan-satuan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/informasi-publik/penerangan-satuan`
                    }
                    color="foreground"
                  >
                    Penerangan Satuan
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/informasi-publik/uu-dan-peraturan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/informasi-publik/uu-dan-peraturan`
                    }
                    color="foreground"
                  >
                    UU & Peraturan
                  </Link>
                </DropdownItem>
              </DropdownMenu>
            </Dropdown>
            <Dropdown>
              <NavbarItem>
                <DropdownTrigger>
                  <Button
                    disableRipple
                    className="p-0 bg-transparent data-[hover=true]:bg-transparent text-medium"
                    radius="sm"
                    variant="light"
                    endContent={<ChevronDownIcon className="pt-1" />}
                  >
                    Profile
                  </Button>
                </DropdownTrigger>
              </NavbarItem>
              <DropdownMenu
                aria-label="tentang"
                title="Tentang"
                className="pt-4"
                classNames={
                  {
                    // base: " border-2 border-red-500 bg-white",
                    // list: "border-2 gap-2 flex flex-row flex-wrap"
                    // list: "gap-2 flex flex-row flex-wrap"s
                  }
                }
                itemClasses={{
                  // base: "border border-red-700 w-[350px]"
                  base: "w-[350px]",
                }}
              >
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/profile/sejarah-ppid-polri`
                        : `/portal-ppid/satuan-kerja/${newPathname}/profile/sejarah-ppid-polri`
                    }
                    color="foreground"
                  >
                    Sejarah PPID Polri
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/profile/profile-singkat-ppid`
                        : `/portal-ppid/satuan-kerja/${newPathname}/profile/profile-singkat-ppid`
                    }
                    color="foreground"
                  >
                    Profile Singkat PPID
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/profile/tugas-dan-fungsi-ppid`
                        : `/portal-ppid/satuan-kerja/${newPathname}/profile/tugas-dan-fungsi-ppid`
                    }
                    color="foreground"
                  >
                    Tugas dan Fungsi PPID
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/profile/struktur-ppid`
                        : `/portal-ppid/satuan-kerja/${newPathname}/profile/struktur-ppid`
                    }
                    color="foreground"
                  >
                    Struktur PPID
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/profile/visi-dan-misi-ppid`
                        : `/portal-ppid/satuan-kerja/${newPathname}/profile/visi-dan-misi-ppid`
                    }
                    color="foreground"
                  >
                    Visi & Misi PPID
                  </Link>
                </DropdownItem>
              </DropdownMenu>
            </Dropdown>
            <Dropdown>
              <NavbarItem>
                <DropdownTrigger>
                  <Button
                    disableRipple
                    className="p-0 bg-transparent data-[hover=true]:bg-transparent text-medium"
                    radius="sm"
                    variant="light"
                    endContent={<ChevronDownIcon className="pt-1" />}
                  >
                    Layanan Informasi
                  </Button>
                </DropdownTrigger>
              </NavbarItem>
              <DropdownMenu
                aria-label="tentang"
                title="Tentang"
                className="pt-4"
                classNames={
                  {
                    // base: " border-2 border-red-500 bg-white",
                    // list: "border-2 gap-2 flex flex-row flex-wrap"
                    // list: "gap-2 flex flex-row flex-wrap"s
                  }
                }
                itemClasses={{
                  // base: "border border-red-700 w-[350px]"
                  base: "w-[350px]",
                }}
              >
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/layanan-informasi/registrasi-permohonan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/layanan-informasi/registrasi-permohonan`
                    }
                    color="foreground"
                  >
                    Registrasi Permohonan
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/layanan-informasi/permohonan-informasi`
                        : `/portal-ppid/satuan-kerja/${newPathname}/layanan-informasi/permohonan-informasi`
                    }
                    color="foreground"
                  >
                    Permohonan Informasi
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/layanan-informasi/permohonan-keberatan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/layanan-informasi/permohonan-keberatan`
                    }
                    color="foreground"
                  >
                    Permohonan Keberatan
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/layanan-informasi/statistik-rekapitulasi`
                        : `/portal-ppid/satuan-kerja/${newPathname}/layanan-informasi/statistik-rekapitulasi`
                    }
                    color="foreground"
                  >
                    Statistik / Rekapitulasi
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/layanan-informasi/ppid-laporan-tahunan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/layanan-informasi/ppid-laporan-tahunan`
                    }
                    color="foreground"
                  >
                    Laporan Informasi Publik Tahunan
                  </Link>
                </DropdownItem>
              </DropdownMenu>
            </Dropdown>
            <Dropdown>
              <NavbarItem>
                <DropdownTrigger>
                  <Button
                    disableRipple
                    className="p-0 bg-transparent data-[hover=true]:bg-transparent text-medium"
                    radius="sm"
                    variant="light"
                    endContent={<ChevronDownIcon className="pt-1" />}
                  >
                    Standar Layanan
                  </Button>
                </DropdownTrigger>
              </NavbarItem>
              <DropdownMenu
                aria-label="tentang"
                title="Tentang"
                className="pt-4"
                classNames={
                  {
                    // base: " border-2 border-red-500 bg-white",
                    // list: "border-2 gap-2 flex flex-row flex-wrap"
                    // list: "gap-2 flex flex-row flex-wrap"s
                  }
                }
                itemClasses={{
                  // base: "border border-red-700 w-[350px]"
                  base: "w-[350px]",
                }}
              >
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/standar-layanan/alur-pelayanan-informasi-publik`
                        : `/portal-ppid/satuan-kerja/${newPathname}/standar-layanan/alur-pelayanan-informasi-publik`
                    }
                    color="foreground"
                  >
                    Alur Pelayanan Informasi Publik Polri
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/standar-layanan/tata-cara-permohonan-informasi`
                        : `/portal-ppid/satuan-kerja/${newPathname}/standar-layanan/tata-cara-permohonan-informasi`
                    }
                    color="foreground"
                  >
                    Tata Cara Permohonan Informasi
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/standar-layanan/mekanisme-keberatan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/standar-layanan/mekanisme-keberatan`
                    }
                    color="foreground"
                  >
                    Mekanisme Keberatan
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/standar-layanan/mekanisme-permohonan-penyelesaian-sengketa`
                        : `/portal-ppid/satuan-kerja/${newPathname}/standar-layanan/mekanisme-permohonan-penyelesaian-sengketa`
                    }
                    color="foreground"
                  >
                    Mekanisme Permohonan Penyelesainan Sengketa
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/standar-layanan/waktu-pelayanan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/standar-layanan/waktu-pelayanan`
                    }
                    color="foreground"
                  >
                    Waktu Pelayanan
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/standar-layanan/standar-biaya-pelayanan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/standar-layanan/standar-biaya-pelayanan`
                    }
                    color="foreground"
                  >
                    Standar Biaya Pelayanan
                  </Link>
                </DropdownItem>
                <DropdownItem endContent={<ChevronRightIcon />}>
                  <Link
                    href={
                      isPolda
                        ? `/portal-ppid/polda/${newPathname}/standar-layanan/maklumat-pelayanan`
                        : `/portal-ppid/satuan-kerja/${newPathname}/standar-layanan/maklumat-pelayanan`
                    }
                    color="foreground"
                  >
                    Maklumat Pelayanan
                  </Link>
                </DropdownItem>
              </DropdownMenu>
            </Dropdown>
            <NavbarItem>
              <Link
                href={
                  isPolda
                    ? `/portal-ppid/polda/${newPathname}/regulasi`
                    : `/portal-ppid/satuan-kerja/${newPathname}/regulasi`
                }
                color="foreground"
              >
                Regulasi
              </Link>
            </NavbarItem>
            <NavbarItem>
              <Link href="#footer-satker" color="foreground">
                Kontak
              </Link>
            </NavbarItem>
            <div>
              <ThemeSwitch />
            </div>
          </div>
        </div>
        <NavbarContent className="sm:hidden basis-1 pl-4" justify="end">
          <ThemeSwitch />
          <NavbarMenuToggle />
        </NavbarContent>
      </div>
    </Navbar>
  );
}
