From 5320b2eaa70df2b7983998613c9a5e1dee400e36 Mon Sep 17 00:00:00 2001
From: Sabda Yagra <msabdayagra@gmail.com>
Date: Thu, 27 Feb 2025 10:12:49 +0700
Subject: [PATCH] fix: fixed mobile version polda-kaltara

---
 .../components/navbar-kaltara.tsx             |  69 ------------
 .../polda-kaltara/components/contact-us.tsx   |   0
 .../polda-kaltara/components/hero-kaltara.tsx |   0
 .../polda-kaltara/components/latest-news.tsx  |   0
 .../components/national-news.tsx              |   0
 .../components/navbar-kaltara.tsx             | 101 ++++++++++++++++++
 .../components/news-tickers-kaltara.tsx       |   0
 .../polda-kaltara/components/popular-news.tsx |   0
 .../components/regional-news.tsx              |   0
 .../polda-kaltara/components/social-media.tsx |   0
 .../{polda => tbnews}/polda-kaltara/page.tsx  |   0
 11 files changed, 101 insertions(+), 69 deletions(-)
 delete mode 100644 app/[locale]/(public)/(polda)/polda/polda-kaltara/components/navbar-kaltara.tsx
 rename app/[locale]/(public)/(polda)/{polda => tbnews}/polda-kaltara/components/contact-us.tsx (100%)
 rename app/[locale]/(public)/(polda)/{polda => tbnews}/polda-kaltara/components/hero-kaltara.tsx (100%)
 rename app/[locale]/(public)/(polda)/{polda => tbnews}/polda-kaltara/components/latest-news.tsx (100%)
 rename app/[locale]/(public)/(polda)/{polda => tbnews}/polda-kaltara/components/national-news.tsx (100%)
 create mode 100644 app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/navbar-kaltara.tsx
 rename app/[locale]/(public)/(polda)/{polda => tbnews}/polda-kaltara/components/news-tickers-kaltara.tsx (100%)
 rename app/[locale]/(public)/(polda)/{polda => tbnews}/polda-kaltara/components/popular-news.tsx (100%)
 rename app/[locale]/(public)/(polda)/{polda => tbnews}/polda-kaltara/components/regional-news.tsx (100%)
 rename app/[locale]/(public)/(polda)/{polda => tbnews}/polda-kaltara/components/social-media.tsx (100%)
 rename app/[locale]/(public)/(polda)/{polda => tbnews}/polda-kaltara/page.tsx (100%)

diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/navbar-kaltara.tsx b/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/navbar-kaltara.tsx
deleted file mode 100644
index 7204f8af..00000000
--- a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/navbar-kaltara.tsx
+++ /dev/null
@@ -1,69 +0,0 @@
-import { Button } from "@/components/ui/button";
-import { Icon } from "@/components/ui/icon";
-import { Link } from "@/i18n/routing";
-import Image from "next/image";
-import React from "react";
-
-const category = [
-  {
-    id: 1,
-    name: "Nasional",
-  },
-  {
-    id: 2,
-    name: "Kaltara",
-  },
-  {
-    id: 3,
-    name: "Keamanan",
-  },
-  {
-    id: 4,
-    name: "Kesehatan",
-  },
-  {
-    id: 5,
-    name: "Olahraga",
-  },
-  {
-    id: 6,
-    name: "PPA",
-  },
-  {
-    id: 7,
-    name: "MediaHub",
-  },
-];
-
-const categoryLinks: any = {
-  Nasional: "/news/nasional",
-  Kaltara: "/news/kaltara",
-  Keamanan: "/security",
-  Kesehatan: "/health",
-  Olahraga: "/sports",
-  PPA: "/ppa",
-  MediaHub: "https://mediahub.polri.go.id/",
-};
-
-const NavbarKaltara = () => {
-  return (
-    <div className="bg-[#c03724] w-full py-3 px-4 lg:px-20 flex justify-between items-center fixed top-0 z-50">
-      <div className="flex flex-row items-center">
-        <Image width={2560} height={1440} src="/assets/img/logo-new-tbnews.png" alt="image" className="h-28 w-72" />
-        <div className="text-white font-semibold flex flex-row gap-14 items-center">
-          {category?.map((data: any) => (
-            <Link key={data?.id} href={categoryLinks[data?.name] || "#"}>
-              {data?.name}
-            </Link>
-          ))}
-        </div>
-        <Button className="flex justify-center items-center bg-white rounded-full gap-3 ml-7 p-2 w-fit h-fit">
-          <Icon icon="material-symbols:lock" className="text-[#c03724]" />
-          <p className="text-[#c03724]">Login</p>
-        </Button>
-      </div>
-    </div>
-  );
-};
-
-export default NavbarKaltara;
diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/contact-us.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/contact-us.tsx
similarity index 100%
rename from app/[locale]/(public)/(polda)/polda/polda-kaltara/components/contact-us.tsx
rename to app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/contact-us.tsx
diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/hero-kaltara.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/hero-kaltara.tsx
similarity index 100%
rename from app/[locale]/(public)/(polda)/polda/polda-kaltara/components/hero-kaltara.tsx
rename to app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/hero-kaltara.tsx
diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/latest-news.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/latest-news.tsx
similarity index 100%
rename from app/[locale]/(public)/(polda)/polda/polda-kaltara/components/latest-news.tsx
rename to app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/latest-news.tsx
diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/national-news.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/national-news.tsx
similarity index 100%
rename from app/[locale]/(public)/(polda)/polda/polda-kaltara/components/national-news.tsx
rename to app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/national-news.tsx
diff --git a/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/navbar-kaltara.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/navbar-kaltara.tsx
new file mode 100644
index 00000000..8b335174
--- /dev/null
+++ b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/navbar-kaltara.tsx
@@ -0,0 +1,101 @@
+import { Button } from "@/components/ui/button";
+import { Icon } from "@/components/ui/icon";
+import { Link } from "@/i18n/routing";
+import Image from "next/image";
+import React, { useState } from "react";
+
+const category = [
+  {
+    id: 1,
+    name: "Nasional",
+  },
+  {
+    id: 2,
+    name: "Kaltara",
+  },
+  {
+    id: 3,
+    name: "Keamanan",
+  },
+  {
+    id: 4,
+    name: "Kesehatan",
+  },
+  {
+    id: 5,
+    name: "Olahraga",
+  },
+  {
+    id: 6,
+    name: "PPA",
+  },
+  {
+    id: 7,
+    name: "MediaHub",
+  },
+];
+
+const categoryLinks: any = {
+  Nasional: "/news/nasional",
+  Kaltara: "/news/kaltara",
+  Keamanan: "/security",
+  Kesehatan: "/health",
+  Olahraga: "/sports",
+  PPA: "/ppa",
+  MediaHub: "https://mediahub.polri.go.id/",
+};
+
+const NavbarKaltara = () => {
+  const [menuOpen, setMenuOpen] = useState(false);
+
+  return (
+    <div className="bg-[#c03724] w-full py-3 px-4 lg:px-20 flex justify-between items-center fixed top-0 z-50">
+      <div className="flex flex-row items-center">
+        <Image width={2560} height={1440} src="/assets/img/logo-new-tbnews.png" alt="image" className="h-28 w-72" />
+        <div className="text-white font-semibold hidden lg:flex flex-row gap-14 items-center">
+          {category?.map((data: any) => (
+            <Link key={data?.id} href={categoryLinks[data?.name] || "#"}>
+              {data?.name}
+            </Link>
+          ))}
+        </div>
+        <Button className="hidden lg:flex justify-center items-center bg-white rounded-full gap-3 ml-7 p-2 w-fit h-fit">
+          <Icon icon="material-symbols:lock" className="text-[#c03724]" />
+          <p className="text-[#c03724]">Login</p>
+        </Button>
+      </div>
+
+      {/* Mobile Menu Toggle */}
+      <button className="text-black dark:text-white right-0 size-20 h-10 w-10 lg:hidden" onClick={() => setMenuOpen(!menuOpen)}>
+        {menuOpen ? (
+          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+            <path fill="currentColor" d="m13.41 12l4.3-4.29a1 1 0 1 0-1.42-1.42L12 10.59l-4.29-4.3a1 1 0 0 0-1.42 1.42l4.3 4.29l-4.3 4.29a1 1 0 0 0 0 1.42a1 1 0 0 0 1.42 0l4.29-4.3l4.29 4.3a1 1 0 0 0 1.42 0a1 1 0 0 0 0-1.42Z" />
+          </svg>
+        ) : (
+          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+            <path fill="currentColor" d="M4 6a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1m0 6a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1m1 5a1 1 0 1 0 0 2h14a1 1 0 1 0 0-2z" />
+          </svg>
+        )}
+      </button>
+
+      {/* Mobile Menu */}
+      {menuOpen && (
+        <div className="lg:hidden absolute bg-[#c03724] dark:bg-slate-600 px-4 py-3 space-y-3 z-50 top-36 items-center w-[300px]">
+          <div className="text-white font-semibold gap-5 items-center grid grid-cols-2">
+            {category?.map((data: any) => (
+              <Link key={data?.id} href={categoryLinks[data?.name] || "#"}>
+                {data?.name}
+              </Link>
+            ))}
+          </div>
+          <Button className="flex justify-center items-center bg-white rounded-full gap-3 ml-7 p-2 w-fit h-fit">
+            <Icon icon="material-symbols:lock" className="text-[#c03724]" />
+            <p className="text-[#c03724]">Login</p>
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default NavbarKaltara;
diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/news-tickers-kaltara.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/news-tickers-kaltara.tsx
similarity index 100%
rename from app/[locale]/(public)/(polda)/polda/polda-kaltara/components/news-tickers-kaltara.tsx
rename to app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/news-tickers-kaltara.tsx
diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/popular-news.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/popular-news.tsx
similarity index 100%
rename from app/[locale]/(public)/(polda)/polda/polda-kaltara/components/popular-news.tsx
rename to app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/popular-news.tsx
diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/regional-news.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/regional-news.tsx
similarity index 100%
rename from app/[locale]/(public)/(polda)/polda/polda-kaltara/components/regional-news.tsx
rename to app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/regional-news.tsx
diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/components/social-media.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/social-media.tsx
similarity index 100%
rename from app/[locale]/(public)/(polda)/polda/polda-kaltara/components/social-media.tsx
rename to app/[locale]/(public)/(polda)/tbnews/polda-kaltara/components/social-media.tsx
diff --git a/app/[locale]/(public)/(polda)/polda/polda-kaltara/page.tsx b/app/[locale]/(public)/(polda)/tbnews/polda-kaltara/page.tsx
similarity index 100%
rename from app/[locale]/(public)/(polda)/polda/polda-kaltara/page.tsx
rename to app/[locale]/(public)/(polda)/tbnews/polda-kaltara/page.tsx