diff --git a/app/[locale]/(public)/audio/filter/page.tsx b/app/[locale]/(public)/audio/filter/page.tsx index bcf720de..6390f9b7 100644 --- a/app/[locale]/(public)/audio/filter/page.tsx +++ b/app/[locale]/(public)/audio/filter/page.tsx @@ -113,7 +113,7 @@ const FilterPage = () => {
+ +
- +
+
{region.name}
+ {getPublicLocaleTimestamp(new Date(row?.createdAt))} WIB {" | "} + {row?.clickCount} +
Video
Audio
Foto
Teks @@ -223,14 +146,7 @@ const Navbar = () => { - + { - + { - + {/* Tombol Utama */} - setIsOpen(!isOpen)} - className="flex items-center space-x-2 p-2 text-gray-700 bg-slate-200 rounded-lg" - > + setIsOpen(!isOpen)} className="flex items-center space-x-2 p-2 text-gray-700 bg-slate-200 rounded-lg"> {language === "id" ? "Ind" : "Eng"} - - + + @@ -315,30 +206,12 @@ const Navbar = () => { {/* Dropdown Menu */} {isOpen && ( - handleLanguageChange("id")} - className={`flex items-center space-x-2 w-full px-4 py-2 ${ - language === "id" ? "font-medium" : "" - }`} - > - + handleLanguageChange("id")} className={`flex items-center space-x-2 w-full px-4 py-2 ${language === "id" ? "font-medium" : ""}`}> + Ind - handleLanguageChange("en")} - className={`flex items-center space-x-2 w-full px-4 py-2 ${ - language === "en" ? "font-medium" : "" - }`} - > - + handleLanguageChange("en")} className={`flex items-center space-x-2 w-full px-4 py-2 ${language === "en" ? "font-medium" : ""}`}> + Eng @@ -346,18 +219,9 @@ const Navbar = () => { - + - + { <> - + {fullName} {`(${roleName})`} @@ -412,25 +276,14 @@ const Navbar = () => { )} - {roleId === "5" || - roleId === "6" || - roleId === "7" || - roleId === "8" ? ( + {/* {roleId === "5" || roleId === "6" || roleId === "7" || roleId === "8" ? ( {detail !== undefined ? ( - + - - {detail?.fullname} - + {detail?.fullname} ({detail?.fullname}) @@ -455,11 +308,7 @@ const Navbar = () => { href: "/dashboard", }, ].map((item, index) => ( - + {item.name} @@ -471,11 +320,7 @@ const Navbar = () => { - + Log out @@ -484,30 +329,15 @@ const Navbar = () => { - ) : roleId === "2" || - roleId === "3" || - roleId === "4" || - roleId === "9" || - roleId === "10" || - roleId === "11" || - roleId === "12" || - roleId === "13" ? ( + ) : roleId === "2" || roleId === "3" || roleId === "4" || roleId === "9" || roleId === "10" || roleId === "11" || roleId === "12" || roleId === "13" ? ( // Dropdown menu for roleId === 3 {detail !== undefined ? ( - + - - {detail?.fullname} - + {detail?.fullname} ({detail?.fullname}) @@ -532,11 +362,7 @@ const Navbar = () => { href: "/dashboard", }, ].map((item, index) => ( - + {item.name} @@ -548,11 +374,7 @@ const Navbar = () => { - + Log out @@ -564,20 +386,14 @@ const Navbar = () => { ) : ( // Masuk and Daftar buttons for roleId === null - + Masuk - + Daftar - )} + )} */} @@ -589,14 +405,7 @@ const Navbar = () => { - + { - - router.push( - generateLocalizedPath("/video/filter", String(locale)) - ) - } - className="flex items-start gap-1.5 p-2 hover:bg-white" - > + router.push(generateLocalizedPath("/video/filter", String(locale)))} className="flex items-start gap-1.5 p-2 hover:bg-white"> Video - - router.push( - generateLocalizedPath("/audio/filter", String(locale)) - ) - } - className="flex place-items-start gap-1.5 p-2 hover:bg-white" - > + router.push(generateLocalizedPath("/audio/filter", String(locale)))} className="flex place-items-start gap-1.5 p-2 hover:bg-white"> Audio - - router.push( - generateLocalizedPath("/image/filter", String(locale)) - ) - } - className="flex place-items-start gap-1.5 p-2 hover:bg-white" - > + router.push(generateLocalizedPath("/image/filter", String(locale)))} className="flex place-items-start gap-1.5 p-2 hover:bg-white"> Foto - - router.push( - generateLocalizedPath( - "/document/filter", - String(locale) - ) - ) - } - className="flex place-items-start gap-1.5 p-2 hover:bg-white" - > + router.push(generateLocalizedPath("/document/filter", String(locale)))} className="flex place-items-start gap-1.5 p-2 hover:bg-white"> Teks @@ -667,14 +445,7 @@ const Navbar = () => { - + { - + { - + {/* Tombol Utama Bahasa */} - setIsOpen(!isOpen)} - className="flex items-center space-x-2 p-2 text-gray-700 bg-slate-200 rounded-lg" - > + setIsOpen(!isOpen)} className="flex items-center space-x-2 p-2 text-gray-700 bg-slate-200 rounded-lg"> {language === "id" ? "Ind" : "Eng"} - - + + @@ -758,30 +504,12 @@ const Navbar = () => { {/* Dropdown Menu */} {isOpen && ( - handleLanguageChange("id")} - className={`flex items-center space-x-2 w-full px-4 py-2 ${ - language === "id" ? "font-medium" : "" - }`} - > - + handleLanguageChange("id")} className={`flex items-center space-x-2 w-full px-4 py-2 ${language === "id" ? "font-medium" : ""}`}> + Ind - handleLanguageChange("en")} - className={`flex items-center space-x-2 w-full px-4 py-2 ${ - language === "en" ? "font-medium" : "" - }`} - > - + handleLanguageChange("en")} className={`flex items-center space-x-2 w-full px-4 py-2 ${language === "en" ? "font-medium" : ""}`}> + Eng @@ -790,11 +518,7 @@ const Navbar = () => { - + {fullName ? ( @@ -809,16 +533,10 @@ const Navbar = () => { {" "} > )} - + Masuk - + Daftar diff --git a/components/landing-page/new-content.tsx b/components/landing-page/new-content.tsx index 3f17f281..b586da7d 100644 --- a/components/landing-page/new-content.tsx +++ b/components/landing-page/new-content.tsx @@ -97,8 +97,8 @@ const NewContent = (props: { type: string }) => { ) : ( - - + + ) ) : selectedTab == "audio" ? ( @@ -133,8 +133,8 @@ const NewContent = (props: { type: string }) => { ) : ( - - + + ) ) : selectedTab == "image" ? ( @@ -159,8 +159,8 @@ const NewContent = (props: { type: string }) => { ) : ( - - + + ) ) : newContent.length > 0 ? ( @@ -202,8 +202,8 @@ const NewContent = (props: { type: string }) => { ) : ( - - + + )} diff --git a/components/landing-page/popular-polda.tsx b/components/landing-page/popular-polda.tsx new file mode 100644 index 00000000..2bf50272 --- /dev/null +++ b/components/landing-page/popular-polda.tsx @@ -0,0 +1,22 @@ +import React, { useEffect, useState } from "react"; +import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs"; +import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from "@/components/ui/carousel"; +import { useParams, usePathname, useRouter } from "next/navigation"; +import { Icon } from "@iconify/react/dist/iconify.js"; +import { formatDateToIndonesian } from "@/utils/globals"; +import { getListContent } from "@/service/landing/landing"; +import { Link } from "@/i18n/routing"; +import { Reveal } from "./Reveal"; + +const PopularPolda = () => { + const [newContent, setNewContent] = useState(); + const [selectedTab, setSelectedTab] = useState("video"); + const router = useRouter(); + const pathname = usePathname(); + const params = useParams(); + const locale = params?.locale; + + return popular-polda; +}; + +export default PopularPolda; diff --git a/components/landing-page/welcome-polda.tsx b/components/landing-page/welcome-polda.tsx new file mode 100644 index 00000000..41236231 --- /dev/null +++ b/components/landing-page/welcome-polda.tsx @@ -0,0 +1,107 @@ +import { useParams, usePathname, useRouter } from "next/navigation"; +import React, { useEffect, useState } from "react"; +import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../ui/dropdown-menu"; +import { FiFile, FiImage, FiMusic, FiYoutube } from "react-icons/fi"; +import { Icon } from "@iconify/react/dist/iconify.js"; +import { capitalize } from "@/utils/globals"; + +const WelcomePolda = () => { + const router = useRouter(); + const asPath: any = usePathname(); + const params = useParams(); + const poldaName: any = params?.polda_name; + const [categorySelect, setCategorySelect] = useState("0"); + const [search, setSearch] = useState(); + + useEffect(() => { + function initState() { + console.log(categorySelect); + } + + initState(); + }, [categorySelect]); + + return ( + + + {/* Heading */} + + Selamat Datang di Polda {poldaName.replace("-", " ")} + + + + Liputan resmi yang bersumber dari kegiatan Polri di Polda {poldaName.replace("-", " ")} + + + {/* Search Form */} + + {/* Dropdown */} + + + + + + + + Konten + + + + + + + + + + Audio Visual + + + + + + Audio + + + + + + Foto + + + + + + Teks + + + + + + + + + + + + + + + {/* Search Input */} + + {/* Button */} + + Cari Liputan + + + + + ); +}; + +export default WelcomePolda; diff --git a/package-lock.json b/package-lock.json index f7e4bcf6..6aeddfe9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -110,6 +110,7 @@ "react-hot-toast": "^2.4.1", "react-icons": "^5.3.0", "react-leaflet": "^4.2.1", + "react-loading-skeleton": "^3.5.0", "react-player": "^2.16.0", "react-quill": "^0.0.2", "react-resizable-panels": "^2.0.19", @@ -11007,6 +11008,14 @@ "react-dom": "^18.0.0" } }, + "node_modules/react-loading-skeleton": { + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/react-loading-skeleton/-/react-loading-skeleton-3.5.0.tgz", + "integrity": "sha512-gxxSyLbrEAdXTKgfbpBEFZCO/P153DnqSCQau2+o6lNy1jgMRr2MmRmOzMmyrwSaSYLRB8g7b0waYPmUjz7IhQ==", + "peerDependencies": { + "react": ">=16.8.0" + } + }, "node_modules/react-player": { "version": "2.16.0", "resolved": "https://registry.npmjs.org/react-player/-/react-player-2.16.0.tgz", diff --git a/package.json b/package.json index dcd2327e..0576c9e0 100644 --- a/package.json +++ b/package.json @@ -111,6 +111,7 @@ "react-hot-toast": "^2.4.1", "react-icons": "^5.3.0", "react-leaflet": "^4.2.1", + "react-loading-skeleton": "^3.5.0", "react-player": "^2.16.0", "react-quill": "^0.0.2", "react-resizable-panels": "^2.0.19", diff --git a/utils/globals.tsx b/utils/globals.tsx index 4a62535e..aed43ec7 100644 --- a/utils/globals.tsx +++ b/utils/globals.tsx @@ -8,11 +8,7 @@ export const generateLocalizedPath = (href: string, locale: string): string => { return `/${locale}${href}`; }; -export function textEllipsis( - str: string, - maxLength: number, - { side = "end", ellipsis = "..." } = {} -) { +export function textEllipsis(str: string, maxLength: number, { side = "end", ellipsis = "..." } = {}) { if (str !== undefined && str?.length > maxLength) { switch (side) { case "start": @@ -69,3 +65,17 @@ export function getOnlyMonthAndYear(d: Date) { return `${pad(d.getMonth() + 1)}/${pad(d.getFullYear(), 4)}`; } +export function getPublicLocaleTimestamp(d: any) { + const pad = (n: any, s = 2) => `${new Array(s).fill(0)}${n}`.slice(-s); + return `${pad(d.getDate())}/${pad(d.getMonth() + 1)}/${pad(d.getFullYear(), 4)} ${pad(d.getHours())}:${pad(d.getMinutes())}`; +} + +export function capitalize(s: any) { + // return s[0].toUpperCase() + s.slice(1); + const splitStr = s.toLowerCase().split(" "); + for (let i = 0; i < splitStr.length; i++) { + splitStr[i] = splitStr[i].charAt(0).toUpperCase() + splitStr[i].slice(1); + } + return splitStr.join(" "); +} +
{fullName}
{`(${roleName})`}
({detail?.fullname})
Teks @@ -667,14 +445,7 @@ const Navbar = () => { - + { - + {
+ Liputan resmi yang bersumber dari kegiatan Polri di Polda {poldaName.replace("-", " ")} +