diff --git a/app/[locale]/indeks/detail/[slug]/page.tsx b/app/[locale]/indeks/detail/[slug]/page.tsx
new file mode 100644
index 00000000..893df413
--- /dev/null
+++ b/app/[locale]/indeks/detail/[slug]/page.tsx
@@ -0,0 +1,247 @@
+"use client";
+import { Card, CardContent } from "@/components/ui/card";
+import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from "@/components/ui/carousel";
+import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { Textarea } from "@/components/ui/textarea";
+import Link from "next/link";
+import { usePathname, useRouter } from "next/navigation";
+import React, { useState } from "react";
+
+const dummyImage = [
+ { id: 1, thumbnail: "/assets/banner-sample.png" },
+ { id: 2, thumbnail: "https://mediahub.polri.go.id/api/media/categories/view-thumbnail?id=125¤tMilis=1732769540018" },
+ { id: 3, thumbnail: "https://mediahub.polri.go.id/api/media/categories/view-thumbnail?id=128¤tMilis=1732769540018" },
+ { id: 4, thumbnail: "https://mediahub.polri.go.id/api/media/categories/view-thumbnail?id=127¤tMilis=1732769540018" },
+ { id: 5, thumbnail: "https://mediahub.polri.go.id/api/media/categories/view-thumbnail?id=93¤tMilis=1732769540018" },
+];
+
+const dummyData = {
+ id: 12312,
+ title: "ahahah",
+ createdBy: "Mabes",
+ createdAt: "21-21-2021",
+ time: "18:23",
+ desc: "sdaasd",
+ htmlDescription:
+ '
Polres Kobar - Polres Kotawaringin Barat (Kobar) memberikan bantuan sosial kepada warga yang berada di Daerah Aliran Sungai (DAS) Arut khususnya yang terdampak banjir, Sabtu (30/11/2024) pagi.
Kapolda Kalteng Irjen Pol Drs. Djoko Poerwanto melalui Kapolres Kobar AKBP Yusfandi Usman, S.I.K., M.I.K., menjelaskan bahwa pihaknya membagikan 200 paket sembako sebagai bentuk kepedulian kepada masyarakat.
"Saya bersama personel turun langsung membagikan bantuan berupa paket sembako yang diserahkan kepada masyarakat sekaligus monitoring ke lokasi pinggiran sungai yang mulai sebagain terdampak banjir akibat curah hujan tinggi,” ungkap Kapolres.
Lebih lanjut, orang nomor satu di Polres Kobar ini, mengungkapkan kegiatan tersebut dilakukan dalam rangka tanggap waspada dan antisipasi bencana banjir di wilayah Kabupaten Kobar.
“Kami minta masyarakat tetap waspada banjir menyikapi cuaca yang berubah-ubah saat ini, tidak menutup kemungkinan bertambahnya volume air sungai, jika diguyur hujan terus menerus,” jelasnya.
',
+};
+
+const IndeksDetail = () => {
+ const [selectedSize, setSelectedSize] = useState("L");
+ const [selectedTab, setSelectedTab] = useState("video");
+ const router = useRouter();
+ const pathname = usePathname();
+
+ const sizes = [
+ { label: "XL", value: "3198 x 1798 px" },
+ { label: "L", value: "2399 x 1349 px" },
+ { label: "M", value: "1599 x 899 px" },
+ { label: "S", value: "1066 x 599 px" },
+ { label: "XS", value: "800 x 450 px" },
+ ];
+
+ return (
+
+ {/* Container Utama */}
+
+ {/* Bagian Kiri */}
+
+ {/* Gambar Utama */}
+
+
+
+
+
+ {/* Thumbnail */}
+
+ {[1, 2, 3, 4].map((_, index) => (
+
+ ))}
+
+
+
+ {/* Bagian Kanan */}
+
+
+ {/* garis */}
+
+
+
+ OPS MANTAP PRAJA & PILKADA 2024
+
+
+
+
poldajabar
+
pilkadamai2024
+
+
+
+
+ {/* Opsi Ukuran Foto */}
+
Opsi Ukuran Foto
+
+
+
+
+ {sizes.map((size) => (
+
+ setSelectedSize(size.label)} className="text-red-600 focus:ring-red-600" />
+
+ {size.label} ---------------------------------------- {size.value}
+
+
+ ))}
+
+
+ {/* Download Semua */}
+
+
+
+ Download Semua File?
+
+
+
+ {/* Tombol Download */}
+
+
+
+
+ Download
+
+
+
+
+ {/* Footer Informasi */}
+
+
+ oleh {dummyData.createdBy} | Diupdate pada {dummyData.createdAt} {dummyData.time} WIB | 👁️ 65
+
+
Kreator: poppy-PID-poldajabar
+
+
+ {/* Keterangan */}
+
+
+ {/* Comment */}
+
+
Berikan Komentar
+
+
Kirim
+
+
+ {/* Konten Serupa */}
+
+
+
+
+ Konten Serupa
+
+
+
+
+ Audio Visual
+
+
+ Audio
+
+
+ Foto
+
+
+ Teks
+
+
+
+
+
+ {selectedTab == "video" ? (
+
+
+ {dummyImage.map((image) => (
+
+
+
+
+
+
+
+ ))}
+
+
+
+
+ ) : selectedTab == "audio" ? (
+
+
+ {dummyImage.map((image) => (
+
+
+
+
+
+
+
+ ))}
+
+
+
+
+ ) : selectedTab == "image" ? (
+
+
+ {dummyImage.map((image) => (
+
+ router.push(`${pathname}/image/detail/${image.id}`)}>
+
+
+
+
+
+ ))}
+
+
+
+
+ ) : (
+
+
+ {dummyImage.map((image) => (
+
+
+
+
+
+
+
+ ))}
+
+
+
+
+ )}
+
+
+
+
+ LIHAT SEMUA
+
+
+
+
+ );
+};
+
+export default IndeksDetail;
diff --git a/app/[locale]/indeks/page.tsx b/app/[locale]/indeks/page.tsx
new file mode 100644
index 00000000..3def81d7
--- /dev/null
+++ b/app/[locale]/indeks/page.tsx
@@ -0,0 +1,107 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import React from "react";
+
+interface ImageCardProps {
+ imageUrl: string;
+ label: string;
+ title: string;
+ date: string;
+}
+
+const ImageCard: React.FC = ({ imageUrl, label, title, date }) => {
+ return (
+
+
+
+ {label}
+
{title}
+ {date}
+
+
+ );
+};
+
+const ImageGallery: React.FC = () => {
+ const pathname = usePathname();
+
+ const images = [
+ {
+ imageUrl: "/assets/banner-sample.png",
+ label: "Giat Pimpinan",
+ title: "Foto Kapolri Dorong Transformasi Polri Presisi",
+ date: "2024-11-12 10:09:20 WIB",
+ },
+ {
+ imageUrl: "/assets/hot-topik-1.jpg",
+ label: "Giat Polri",
+ title: "Foto Kapolri Tinjau Pengungsi Gunung",
+ date: "2024-11-19 09:35:27 WIB",
+ },
+ {
+ imageUrl: "/assets/hot-topik-2.jpg",
+ label: "Giat Polri",
+ title: "Foto Kapolri dalam Acara Bersama TNI",
+ date: "2024-11-20 15:45:00 WIB",
+ },
+ ];
+
+ const imageBottom = [
+ {
+ id: 1,
+ imageUrl: "/assets/hot-topik-1.jpg",
+ title: "Foto Kakorlantas Polri Tekankan Intervensi",
+ description:
+ "Kepala Korps Lalu Lintas (Kakorlantas) Polri Irjen. Pol. Dr. Drs. Aan Suhanan, M.Si. memimpin apel pagi di NTMC pada Senin (2/12/2024) dan menekankan pentingnya pengelolaan ekstra dalam pengamanan Natal dan Tahun Baru 2024.",
+ },
+ {
+ id: 2,
+ imageUrl: "/assets/hot-topik-1.jpg",
+ title: "Foto Kakorlantas Tinjau Jalur Tol, Jalur Wisata",
+ description: "Kakorlantas Polri Irjen.Pol. Dr. Drs. Aan Suhanan, M.Si. memimpin survei jalur tol dari Cikopo, Purwakarta hingga Kalikangkung, Jawa Tengah, untuk persiapan Operasi Lilin 2024.",
+ },
+ {
+ id: 3,
+ imageUrl: "/assets/hot-topik-2.jpg",
+ title: "Foto Kapolri Pastikan Kesiapan Polri Kawal Pilkada",
+ description: "Kapolri Jenderal Polisi Drs. Listyo Sigit Prabowo, M.Si menegaskan kesiapan Polri dalam mengawal Pilkada Serentak 2024 yang digelar Rabu, 27 November 2024.",
+ },
+ ];
+
+ return (
+ <>
+ {/* Hero */}
+
+ {/* Bottom */}
+
+
+ {imageBottom.map((image) => (
+
+
+
+
+
+
+ {image.title}
+
+
{image.description}
+
+
+ ))}
+
+
+ >
+ );
+};
+
+export default ImageGallery;
diff --git a/app/[locale]/schedule/page.tsx b/app/[locale]/schedule/page.tsx
new file mode 100644
index 00000000..23b1ecf8
--- /dev/null
+++ b/app/[locale]/schedule/page.tsx
@@ -0,0 +1,333 @@
+"use client";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@/components/ui/dropdown-menu";
+import React from "react";
+
+const Jadwal = () => {
+ return (
+ <>
+ {/* Awal Komponen Kiri */}
+
+
+
+
+
+
+
+
+
+ Time Table
+ Monday
+ Tuesday
+ Wednesday
+ Thursday
+ Friday
+ Saturday
+ Sunday
+
+
+
+
+ 06:00
+
+
+
+
+
+
+
+
+
+
+ 07:00
+
+
+
+
+
+
+
+
+
+
+ 08:00
+
+
+
+
+
+
+
+
+
+
+ 09:00
+
+
+
+
+
+
+
+
+
+
+ 10:00
+
+
+
+
+
+
+
+
+
+
+ 11:00
+
+
+
+
+
+
+
+
+
+
+ 12:00
+
+
+
+
+
+
+
+
+
+
+ 13:00
+
+
+
+
+
+
+
+
+
+
+ 14:00
+
+
+
+
+
+
+
+
+
+
+ 15:00
+
+
+
+
+
+
+
+
+
+
+ 16:00
+
+
+
+
+
+
+
+
+
+
+ 17:00
+
+
+
+
+
+
+
+
+
+
+ 18:00
+
+
+
+
+
+
+
+
+
+
+ 19:00
+
+
+
+
+
+
+
+
+
+
+ 20:00
+
+
+
+
+
+
+
+
+
+
+ 21:00
+
+
+
+
+
+
+
+
+
+
+ 22:00
+
+
+
+
+
+
+
+
+
+
+ 23:00
+
+
+
+
+
+
+
+
+
+
+ 24:00
+
+
+
+
+
+
+
+
+
+
+ 01:00
+
+
+
+
+
+
+
+
+
+
+ 02:00
+
+
+
+
+
+
+
+
+
+
+ 03:00
+
+
+
+
+
+
+
+
+
+
+ 04:00
+
+
+
+
+
+
+
+
+
+
+ 05:00
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* Akhir Komponen Kiri */}
+
+ {/* Awal Komponent Kanan */}
+
+ {/* Akhir Komponen Kiri */}
+
+ >
+ );
+};
+
+export default Jadwal;
diff --git a/components/landing-page/KontenTerbaru.tsx b/components/landing-page/KontenTerbaru.tsx
index aa615b3d..983f9214 100644
--- a/components/landing-page/KontenTerbaru.tsx
+++ b/components/landing-page/KontenTerbaru.tsx
@@ -81,7 +81,7 @@ const KontenTerbaru = () => {
{dummyDescription.map((description) => (
-
+
diff --git a/components/landing-page/Navbar.tsx b/components/landing-page/Navbar.tsx
index 162406ab..684a7539 100644
--- a/components/landing-page/Navbar.tsx
+++ b/components/landing-page/Navbar.tsx
@@ -76,9 +76,8 @@ const Navbar = () => {
- {/* */}
-
+
{
Jadwal
-
+
=16.8.0",
+ "react-dom": ">=16.8.0"
+ }
+ },
"node_modules/@floating-ui/react-dom": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.2.tgz",
@@ -4416,6 +4434,11 @@
"node": ">= 8"
}
},
+ "node_modules/css-mediaquery": {
+ "version": "0.1.2",
+ "resolved": "https://registry.npmjs.org/css-mediaquery/-/css-mediaquery-0.1.2.tgz",
+ "integrity": "sha512-COtn4EROW5dBGlE/4PiKnh6rZpAPxDeFLaEEwt4i10jpDMFt2EhQGS79QmmrO+iKCHv0PU/HrOWEhijFd1x99Q=="
+ },
"node_modules/cssesc": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
@@ -5115,11 +5138,62 @@
"csstype": "^3.0.2"
}
},
+ "node_modules/dom-serializer": {
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-2.0.0.tgz",
+ "integrity": "sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==",
+ "dependencies": {
+ "domelementtype": "^2.3.0",
+ "domhandler": "^5.0.2",
+ "entities": "^4.2.0"
+ },
+ "funding": {
+ "url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
+ }
+ },
+ "node_modules/domelementtype": {
+ "version": "2.3.0",
+ "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
+ "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==",
+ "funding": [
+ {
+ "type": "github",
+ "url": "https://github.com/sponsors/fb55"
+ }
+ ]
+ },
+ "node_modules/domhandler": {
+ "version": "5.0.3",
+ "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-5.0.3.tgz",
+ "integrity": "sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==",
+ "dependencies": {
+ "domelementtype": "^2.3.0"
+ },
+ "engines": {
+ "node": ">= 4"
+ },
+ "funding": {
+ "url": "https://github.com/fb55/domhandler?sponsor=1"
+ }
+ },
"node_modules/dompurify": {
"version": "3.1.6",
"resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.1.6.tgz",
"integrity": "sha512-cTOAhc36AalkjtBpfG6O8JimdTMWNXjiePT2xQH/ppBGi/4uIpmj8eKyIkMJErXWARyINV/sB38yf8JCLF5pbQ=="
},
+ "node_modules/domutils": {
+ "version": "3.1.0",
+ "resolved": "https://registry.npmjs.org/domutils/-/domutils-3.1.0.tgz",
+ "integrity": "sha512-H78uMmQtI2AhgDJjWeQmHwJJ2bLPD3GMmO7Zja/ZZh84wkm+4ut+IUnUdRa8uCGX88DiVx1j6FRe1XfxEgjEZA==",
+ "dependencies": {
+ "dom-serializer": "^2.0.0",
+ "domelementtype": "^2.3.0",
+ "domhandler": "^5.0.3"
+ },
+ "funding": {
+ "url": "https://github.com/fb55/domutils?sponsor=1"
+ }
+ },
"node_modules/duplexer": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz",
@@ -6195,9 +6269,9 @@
}
},
"node_modules/framer-motion": {
- "version": "11.11.17",
- "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.11.17.tgz",
- "integrity": "sha512-O8QzvoKiuzI5HSAHbcYuL6xU+ZLXbrH7C8Akaato4JzQbX2ULNeniqC2Vo5eiCtFktX9XsJ+7nUhxcl2E2IjpA==",
+ "version": "11.12.0",
+ "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.12.0.tgz",
+ "integrity": "sha512-gZaZeqFM6pX9kMVti60hYAa75jGpSsGYWAHbBfIkuHN7DkVHVkxSxeNYnrGmHuM0zPkWTzQx10ZT+fDjn7N4SA==",
"dependencies": {
"tslib": "^2.4.0"
},
@@ -7112,12 +7186,41 @@
"react-is": "^16.7.0"
}
},
+ "node_modules/html-dom-parser": {
+ "version": "5.0.10",
+ "resolved": "https://registry.npmjs.org/html-dom-parser/-/html-dom-parser-5.0.10.tgz",
+ "integrity": "sha512-GwArYL3V3V8yU/mLKoFF7HlLBv80BZ2Ey1BzfVNRpAci0cEKhFHI/Qh8o8oyt3qlAMLlK250wsxLdYX4viedvg==",
+ "dependencies": {
+ "domhandler": "5.0.3",
+ "htmlparser2": "9.1.0"
+ }
+ },
"node_modules/html-escaper": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
"integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==",
"dev": true
},
+ "node_modules/html-react-parser": {
+ "version": "5.1.18",
+ "resolved": "https://registry.npmjs.org/html-react-parser/-/html-react-parser-5.1.18.tgz",
+ "integrity": "sha512-65BwC0zzrdeW96jB2FRr5f1ovBhRMpLPJNvwkY5kA8Ay5xdL9t/RH2/uUTM7p+cl5iM88i6dDk4LXtfMnRmaJQ==",
+ "dependencies": {
+ "domhandler": "5.0.3",
+ "html-dom-parser": "5.0.10",
+ "react-property": "2.0.2",
+ "style-to-js": "1.1.16"
+ },
+ "peerDependencies": {
+ "@types/react": "0.14 || 15 || 16 || 17 || 18",
+ "react": "0.14 || 15 || 16 || 17 || 18"
+ },
+ "peerDependenciesMeta": {
+ "@types/react": {
+ "optional": true
+ }
+ }
+ },
"node_modules/html-void-elements": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/html-void-elements/-/html-void-elements-3.0.0.tgz",
@@ -7127,6 +7230,29 @@
"url": "https://github.com/sponsors/wooorm"
}
},
+ "node_modules/htmlparser2": {
+ "version": "9.1.0",
+ "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-9.1.0.tgz",
+ "integrity": "sha512-5zfg6mHUoaer/97TxnGpxmbR7zJtPwIYFMZ/H5ucTlPZhKvtum05yiPK3Mgai3a0DyVxv7qYqoweaEd2nrYQzQ==",
+ "funding": [
+ "https://github.com/fb55/htmlparser2?sponsor=1",
+ {
+ "type": "github",
+ "url": "https://github.com/sponsors/fb55"
+ }
+ ],
+ "dependencies": {
+ "domelementtype": "^2.3.0",
+ "domhandler": "^5.0.3",
+ "domutils": "^3.1.0",
+ "entities": "^4.5.0"
+ }
+ },
+ "node_modules/hyphenate-style-name": {
+ "version": "1.1.0",
+ "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.1.0.tgz",
+ "integrity": "sha512-WDC/ui2VVRrz3jOVi+XtjqkDjiVjTtFaAGiW37k6b+ohyQ5wYDOGkvCZa8+H0nx3gyvv0+BST9xuOgIyGQ00gw=="
+ },
"node_modules/iconv-lite": {
"version": "0.6.3",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
@@ -7834,6 +7960,11 @@
}
}
},
+ "node_modules/jquery": {
+ "version": "2.2.4",
+ "resolved": "https://registry.npmjs.org/jquery/-/jquery-2.2.4.tgz",
+ "integrity": "sha512-lBHj60ezci2u1v2FqnZIraShGgEXq35qCzMv4lITyHGppTnA13rwR0MgwyNJh9TnDs3aXUvd1xjAotfraMHX/Q=="
+ },
"node_modules/js-tokens": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
@@ -7992,6 +8123,14 @@
"resolved": "https://registry.npmjs.org/layout-base/-/layout-base-1.0.2.tgz",
"integrity": "sha512-8h2oVEZNktL4BH2JCOI90iD1yXwL6iNW7KcCKT2QZgQJR2vbqDsldCTPRU9NifTCqHZci57XvQQ15YTu+sTYPg=="
},
+ "node_modules/layout-grid": {
+ "version": "2.2.0",
+ "resolved": "https://registry.npmjs.org/layout-grid/-/layout-grid-2.2.0.tgz",
+ "integrity": "sha512-1gxDhkPMy2d1yy1pxpdvqRrJIalBb3vuhu5zRMWikjsWawVGGsENKN7vik817qKz59xWNunXRo7qfHJ1y8MKzQ==",
+ "dependencies": {
+ "jquery": "^1.7, ^2.0"
+ }
+ },
"node_modules/leaflet": {
"version": "1.9.4",
"resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz",
@@ -8150,6 +8289,14 @@
"remove-accents": "0.5.0"
}
},
+ "node_modules/matchmediaquery": {
+ "version": "0.4.2",
+ "resolved": "https://registry.npmjs.org/matchmediaquery/-/matchmediaquery-0.4.2.tgz",
+ "integrity": "sha512-wrZpoT50ehYOudhDjt/YvUJc6eUzcdFPdmbizfgvswCKNHD1/OBOHYJpHie+HXpu6bSkEGieFMYk6VuutaiRfA==",
+ "dependencies": {
+ "css-mediaquery": "^0.1.2"
+ }
+ },
"node_modules/mdast-util-definitions": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/mdast-util-definitions/-/mdast-util-definitions-5.1.2.tgz",
@@ -10722,6 +10869,21 @@
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
}
},
+ "node_modules/react-datepicker": {
+ "version": "7.5.0",
+ "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-7.5.0.tgz",
+ "integrity": "sha512-6MzeamV8cWSOcduwePHfGqY40acuGlS1cG//ePHT6bVbLxWyqngaStenfH03n1wbzOibFggF66kWaBTb1SbTtQ==",
+ "dependencies": {
+ "@floating-ui/react": "^0.26.23",
+ "clsx": "^2.1.1",
+ "date-fns": "^3.6.0",
+ "prop-types": "^15.8.1"
+ },
+ "peerDependencies": {
+ "react": "^16.9.0 || ^17 || ^18",
+ "react-dom": "^16.9.0 || ^17 || ^18"
+ }
+ },
"node_modules/react-day-picker": {
"version": "8.10.1",
"resolved": "https://registry.npmjs.org/react-day-picker/-/react-day-picker-8.10.1.tgz",
@@ -10819,6 +10981,11 @@
"react-dom": "^18.0.0"
}
},
+ "node_modules/react-property": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/react-property/-/react-property-2.0.2.tgz",
+ "integrity": "sha512-+PbtI3VuDV0l6CleQMsx2gtK0JZbZKbpdu5ynr+lbsuvtmgbNcS3VM0tuY2QjFNOcWxvXeHjDpy42RO+4U2rug=="
+ },
"node_modules/react-quill": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/react-quill/-/react-quill-0.0.2.tgz",
@@ -10887,6 +11054,23 @@
"react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
}
},
+ "node_modules/react-responsive": {
+ "version": "10.0.0",
+ "resolved": "https://registry.npmjs.org/react-responsive/-/react-responsive-10.0.0.tgz",
+ "integrity": "sha512-N6/UiRLGQyGUqrarhBZmrSmHi2FXSD++N5VbSKsBBvWfG0ZV7asvUBluSv5lSzdMyEVjzZ6Y8DL4OHABiztDOg==",
+ "dependencies": {
+ "hyphenate-style-name": "^1.0.0",
+ "matchmediaquery": "^0.4.2",
+ "prop-types": "^15.6.1",
+ "shallow-equal": "^3.1.0"
+ },
+ "engines": {
+ "node": ">=14"
+ },
+ "peerDependencies": {
+ "react": ">=16.8.0"
+ }
+ },
"node_modules/react-select": {
"version": "5.8.3",
"resolved": "https://registry.npmjs.org/react-select/-/react-select-5.8.3.tgz",
@@ -11640,6 +11824,11 @@
"node": ">= 0.4"
}
},
+ "node_modules/shallow-equal": {
+ "version": "3.1.0",
+ "resolved": "https://registry.npmjs.org/shallow-equal/-/shallow-equal-3.1.0.tgz",
+ "integrity": "sha512-pfVOw8QZIXpMbhBWvzBISicvToTiM5WBF1EeAUZDDSb5Dt29yl4AYbyywbJFSEsRUMr7gJaxqCdr4L3tQf9wVg=="
+ },
"node_modules/sharp": {
"version": "0.33.5",
"resolved": "https://registry.npmjs.org/sharp/-/sharp-0.33.5.tgz",
@@ -12090,6 +12279,27 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/style-to-js": {
+ "version": "1.1.16",
+ "resolved": "https://registry.npmjs.org/style-to-js/-/style-to-js-1.1.16.tgz",
+ "integrity": "sha512-/Q6ld50hKYPH3d/r6nr117TZkHR0w0kGGIVfpG9N6D8NymRPM9RqCUv4pRpJ62E5DqOYx2AFpbZMyCPnjQCnOw==",
+ "dependencies": {
+ "style-to-object": "1.0.8"
+ }
+ },
+ "node_modules/style-to-js/node_modules/inline-style-parser": {
+ "version": "0.2.4",
+ "resolved": "https://registry.npmjs.org/inline-style-parser/-/inline-style-parser-0.2.4.tgz",
+ "integrity": "sha512-0aO8FkhNZlj/ZIbNi7Lxxr12obT7cL1moPfE4tg1LkX7LlLfC6DeX4l2ZEud1ukP9jNQyNnfzQVqwbwmAATY4Q=="
+ },
+ "node_modules/style-to-js/node_modules/style-to-object": {
+ "version": "1.0.8",
+ "resolved": "https://registry.npmjs.org/style-to-object/-/style-to-object-1.0.8.tgz",
+ "integrity": "sha512-xT47I/Eo0rwJmaXC4oilDGDWLohVhR6o/xAQcPQN8q6QBuZVL8qMYL85kLmST5cPjAorwvqIA4qXTRQoYHaL6g==",
+ "dependencies": {
+ "inline-style-parser": "0.2.4"
+ }
+ },
"node_modules/style-to-object": {
"version": "0.4.4",
"resolved": "https://registry.npmjs.org/style-to-object/-/style-to-object-0.4.4.tgz",
@@ -12278,6 +12488,11 @@
"node": ">= 4.7.0"
}
},
+ "node_modules/tabbable": {
+ "version": "6.2.0",
+ "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz",
+ "integrity": "sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew=="
+ },
"node_modules/tailwind-merge": {
"version": "2.5.5",
"resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-2.5.5.tgz",
diff --git a/package.json b/package.json
index 1ad7b398..a2d0b7c3 100644
--- a/package.json
+++ b/package.json
@@ -66,11 +66,13 @@
"embla-carousel-autoplay": "^8.1.3",
"embla-carousel-react": "^8.1.3",
"emoji-mart": "^5.6.0",
- "framer-motion": "^11.3.31",
+ "framer-motion": "^11.12.0",
"geojson": "^0.5.0",
"google-map-react": "^2.2.1",
+ "html-react-parser": "^5.1.18",
"input-otp": "^1.2.4",
"jotai": "^2.9.3",
+ "layout-grid": "^2.2.0",
"leaflet": "^1.9.4",
"lucide-react": "^0.390.0",
"moment": "^2.30.1",
@@ -85,6 +87,7 @@
"react-advanced-news-ticker": "^1.0.1",
"react-apexcharts": "^1.4.1",
"react-chartjs-2": "^5.2.0",
+ "react-datepicker": "^7.5.0",
"react-day-picker": "^8.10.1",
"react-dom": "^18",
"react-dropzone": "^14.2.3",
@@ -94,6 +97,7 @@
"react-leaflet": "^4.2.1",
"react-quill": "^0.0.2",
"react-resizable-panels": "^2.0.19",
+ "react-responsive": "^10.0.0",
"react-select": "^5.8.0",
"react-slick": "^0.30.2",
"react-syntax-highlighter": "^15.5.0",
@@ -102,7 +106,7 @@
"sharp": "^0.33.4",
"sonner": "^1.5.0",
"swiper": "^11.1.4",
- "tailwind-merge": "^2.3.0",
+ "tailwind-merge": "^2.5.5",
"tailwindcss-animate": "^1.0.7",
"vaul": "^0.9.1",
"zod": "^3.23.8"
diff --git a/public/assets/hot-topik-1.jpg b/public/assets/hot-topik-1.jpg
new file mode 100644
index 00000000..f132c7e4
Binary files /dev/null and b/public/assets/hot-topik-1.jpg differ
diff --git a/public/assets/hot-topik-2.jpg b/public/assets/hot-topik-2.jpg
new file mode 100644
index 00000000..dc08566d
Binary files /dev/null and b/public/assets/hot-topik-2.jpg differ