diff --git a/app/[locale]/(public)/(polda)/polda/[polda_name]/page.tsx b/app/[locale]/(public)/(polda)/polda/[polda_name]/page.tsx index ebc703b3..1fb82e54 100644 --- a/app/[locale]/(public)/(polda)/polda/[polda_name]/page.tsx +++ b/app/[locale]/(public)/(polda)/polda/[polda_name]/page.tsx @@ -12,6 +12,7 @@ import SearchSectionKaltara from "@/components/landing-page/landing-polda-kaltar import LatestContentKaltara from "@/components/landing-page/landing-polda-kaltara/latest-content-kaltara"; import ContactUsKaltara from "@/components/landing-page/landing-polda-kaltara/contact-us-kaltara"; import NewsTickerKaltara from "../../tbnews/[polda_name]/components/news-tickers-kaltara"; +import ContentCategoryKaltara from "@/components/landing-page/landing-polda-kaltara/content-category-kaltara"; const page = () => { const params = useParams(); @@ -24,7 +25,7 @@ const page = () => { - + @@ -34,7 +35,7 @@ const page = () => { - + ); }; diff --git a/app/[locale]/(public)/all/filter/page.tsx b/app/[locale]/(public)/all/filter/page.tsx index 7e3fdc75..4554bb66 100644 --- a/app/[locale]/(public)/all/filter/page.tsx +++ b/app/[locale]/(public)/all/filter/page.tsx @@ -204,7 +204,7 @@ export default function FilterPage() { setImageData(contentData); setTotalData(data?.totalElements); setContentAll(response?.data?.data?.content); - setTotalPage(data?.totalPages); + setTotalPage(response?.data?.data?.totalPages); setTotalContent(response?.data?.data?.totalElements); } } else { @@ -243,7 +243,7 @@ export default function FilterPage() { setImageData(contentData); setTotalData(data?.totalElements); setContentAll(response?.data?.data?.content); - setTotalPage(data?.totalPages); + setTotalPage(response?.data?.data?.totalPages); setTotalContent(response?.data?.data?.totalElements); } } diff --git a/app/[locale]/(public)/document/filter/page.tsx b/app/[locale]/(public)/document/filter/page.tsx index bda1f297..24df27dd 100644 --- a/app/[locale]/(public)/document/filter/page.tsx +++ b/app/[locale]/(public)/document/filter/page.tsx @@ -550,7 +550,7 @@ const FilterPage = () => {
- {formatDateToIndonesian(new Date(document?.createdAt))} {document?.timezone ? document?.timezone : "WIB"} | 518 + {formatDateToIndonesian(new Date(document?.createdAt))} {document?.timezone ? document?.timezone : "WIB"} | {document?.clickCount}
{document?.title}
diff --git a/app/[locale]/(public)/image/filter/page.tsx b/app/[locale]/(public)/image/filter/page.tsx index 4e5750a0..bf2b13f4 100644 --- a/app/[locale]/(public)/image/filter/page.tsx +++ b/app/[locale]/(public)/image/filter/page.tsx @@ -3,30 +3,10 @@ import React, { useEffect, useState } from "react"; import { Card, CardContent } from "@/components/ui/card"; import { Checkbox } from "@/components/ui/checkbox"; import { Icon } from "@iconify/react/dist/iconify.js"; -import { - formatDateToIndonesian, - getOnlyDate, - getOnlyMonthAndYear, -} from "@/utils/globals"; +import { formatDateToIndonesian, getOnlyDate, getOnlyMonthAndYear } from "@/utils/globals"; import { useParams, usePathname, useSearchParams } from "next/navigation"; -import { - getUserLevelListByParent, - listCategory, - listData, - listDataRegional, -} from "@/service/landing/landing"; -import { - ColumnDef, - ColumnFiltersState, - PaginationState, - SortingState, - VisibilityState, - getCoreRowModel, - getFilteredRowModel, - getPaginationRowModel, - getSortedRowModel, - useReactTable, -} from "@tanstack/react-table"; +import { getUserLevelListByParent, listCategory, listData, listDataRegional } from "@/service/landing/landing"; +import { ColumnDef, ColumnFiltersState, PaginationState, SortingState, VisibilityState, getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table"; import LandingPagination from "@/components/landing-page/pagination"; import { Reveal } from "@/components/landing-page/Reveal"; import { Link, useRouter } from "@/i18n/routing"; @@ -58,11 +38,8 @@ const FilterPage = () => { const [totalData, setTotalData] = React.useState(1); const [totalPage, setTotalPage] = React.useState(1); const [sorting, setSorting] = React.useState([]); - const [columnFilters, setColumnFilters] = React.useState( - [] - ); - const [columnVisibility, setColumnVisibility] = - React.useState({}); + const [columnFilters, setColumnFilters] = React.useState([]); + const [columnVisibility, setColumnVisibility] = React.useState({}); const [rowSelection, setRowSelection] = React.useState({}); const [pagination, setPagination] = React.useState({ pageIndex: 0, @@ -83,9 +60,7 @@ const FilterPage = () => { const [categoryFilter, setCategoryFilter] = useState([]); const [monthYearFilter, setMonthYearFilter] = useState(); const [searchTitle, setSearchTitle] = useState(""); - const [sortByOpt, setSortByOpt] = useState( - sortBy === "popular" ? "clickCount" : "createdAt" - ); + const [sortByOpt, setSortByOpt] = useState(sortBy === "popular" ? "clickCount" : "createdAt"); const isRegional = asPath?.includes("regional"); const isSatker = asPath?.includes("satker"); const [formatFilter, setFormatFilter] = useState([]); @@ -131,14 +106,8 @@ const FilterPage = () => { useEffect(() => { if (categorie) { - setCategoryFilter( - categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] - ); - console.log( - "Kategori", - categorie, - categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] - ); + setCategoryFilter(categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); + console.log("Kategori", categorie, categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); } }, [categorie]); @@ -156,19 +125,7 @@ const FilterPage = () => { } console.log(monthYearFilter, "monthFilter"); initState(); - }, [ - change, - asPath, - monthYearFilter, - page, - sortBy, - sortByOpt, - title, - startDateString, - endDateString, - categorie, - formatFilter, - ]); + }, [change, asPath, monthYearFilter, page, sortBy, sortByOpt, title, startDateString, endDateString, categorie, formatFilter]); async function getCategories() { const category = await listCategory("1"); @@ -191,10 +148,7 @@ const FilterPage = () => { async function getDataAll() { if (asPath?.includes("/polda/") == true) { if (asPath?.split("/")[2] !== "[polda_name]") { - const filter = - categoryFilter?.length > 0 - ? categoryFilter?.sort().join(",") - : categorie || ""; + const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -212,14 +166,8 @@ const FilterPage = () => { filterGroup, startDateString, endDateString, - monthYearFilter - ? getOnlyMonthAndYear(monthYearFilter) - ?.split("/")[0] - ?.replace("", "") - : "", - monthYearFilter - ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] - : "", + monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", + monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", locale == "en" ? true : false ); close(); @@ -234,10 +182,7 @@ const FilterPage = () => { setTotalContent(response?.data?.data?.totalElements); } } else { - const filter = - categoryFilter?.length > 0 - ? categoryFilter?.sort().join(",") - : categorie || ""; + const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -254,12 +199,8 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter - ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") - : "", - monthYearFilter - ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] - : "", + monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", + monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", locale == "en" ? true : false ); close(); @@ -310,10 +251,7 @@ const FilterPage = () => { }; async function getDataRegional() { - const filter = - categoryFilter?.length > 0 - ? categoryFilter?.sort().join(",") - : categorie || ""; + const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -326,12 +264,8 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter - ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") - : "", - monthYearFilter - ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] - : "", + monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", + monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", 12, pages, sortByOpt @@ -448,10 +382,7 @@ const FilterPage = () => { `; - const toBase64 = (str: string) => - typeof window === "undefined" - ? Buffer.from(str).toString("base64") - : window.btoa(str); + const toBase64 = (str: string) => (typeof window === "undefined" ? Buffer.from(str).toString("base64") : window.btoa(str)); return (
@@ -470,10 +401,7 @@ const FilterPage = () => { {/* Left */}
-
@@ -487,10 +415,7 @@ const FilterPage = () => {
-
- + {
- +
{ placeholderText={t("selectDate")} onCalendarClose={() => setCalenderState(!calenderState)} /> -
- {handleClose ? ( - - ) : ( - "" - )} -
+
{handleClose ? : ""}
-

- {t("categories")} -

+

{t("categories")}

    {categories.map((category: any) => (
  • -
    • ))} @@ -582,63 +477,31 @@ const FilterPage = () => {
    {/* Garis */}
    -

    - Format -

    +

    Format

    @@ -652,11 +515,7 @@ const FilterPage = () => {

    {t("sortBy")}

    - handleSorting(e)} className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"> @@ -680,10 +539,7 @@ const FilterPage = () => { {imageData?.length > 0 ? (
    {imageData?.map((image: any) => ( - + {/* */} @@ -699,32 +555,12 @@ const FilterPage = () => { />
    - {formatDateToIndonesian( - new Date(image?.createdAt) - )}{" "} - {image?.timezone ? image?.timezone : "WIB"} + {formatDateToIndonesian(new Date(image?.createdAt))} {image?.timezone ? image?.timezone : "WIB"}   | - + {image?.clickCount}{" "} - - - {" "} -
    -
    - {image?.title}
    +
    {image?.title}
    @@ -732,24 +568,12 @@ const FilterPage = () => {
    ) : (

    - empty + empty

    )} )} - {totalData > 1 && ( - - )} + {totalData > 1 && }
diff --git a/app/[locale]/(public)/video/filter/page.tsx b/app/[locale]/(public)/video/filter/page.tsx index 1cafffa5..7828ab0c 100644 --- a/app/[locale]/(public)/video/filter/page.tsx +++ b/app/[locale]/(public)/video/filter/page.tsx @@ -547,14 +547,8 @@ const FilterPage = () => {
- {formatDateToIndonesian(new Date(video?.createdAt))} {video?.timezone ? video?.timezone : "WIB"}| + {formatDateToIndonesian(new Date(video?.createdAt))} {video?.timezone ? video?.timezone : "WIB"} | {video?.clickCount}{" "} - - - {" "}
{video?.title}
diff --git a/components/landing-page/content-category.tsx b/components/landing-page/content-category.tsx index ce0f2b6a..f8c93938 100644 --- a/components/landing-page/content-category.tsx +++ b/components/landing-page/content-category.tsx @@ -1,23 +1,13 @@ -import { - getCategoryData, - getPublicCategoryData, -} from "@/service/landing/landing"; -import Link from "next/link"; +import { getCategoryData, getPublicCategoryData } from "@/service/landing/landing"; import React, { useEffect, useState } from "react"; -import { Button } from "../ui/button"; import { Reveal } from "./Reveal"; import { useTranslations } from "next-intl"; import { usePathname } from "next/navigation"; import { useParams } from "next/navigation"; import Image from "next/image"; -import { - Carousel, - CarouselContent, - CarouselItem, - CarouselNext, - CarouselPrevious, -} from "../ui/carousel"; +import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from "../ui/carousel"; import { useRouter } from "@/i18n/routing"; +import { Button } from "../ui/button"; const ContentCategory = (props: { group?: string; type: string }) => { const [categories, setCategories] = useState(); @@ -29,26 +19,14 @@ const ContentCategory = (props: { group?: string; type: string }) => { const satkerName = params?.satker_name; const router = useRouter(); - let prefixPath = poldaName - ? `/polda/${poldaName}` - : satkerName - ? `/satker/${satkerName}` - : "/"; + let prefixPath = poldaName ? `/polda/${poldaName}` : satkerName ? `/satker/${satkerName}` : "/"; useEffect(() => { initFetch(); }, []); const initFetch = async () => { const response = await getPublicCategoryData( - props.group == "mabes" - ? "" - : props.group == "polda" && poldaName && String(poldaName)?.length > 1 - ? poldaName - : props.group == "satker" && - satkerName && - String(satkerName)?.length > 1 - ? "satker-" + satkerName - : "", + props.group == "mabes" ? "" : props.group == "polda" && poldaName && String(poldaName)?.length > 1 ? poldaName : props.group == "satker" && satkerName && String(satkerName)?.length > 1 ? "satker-" + satkerName : "", "", locale == "en" ? true : false ); @@ -74,10 +52,7 @@ const ContentCategory = (props: { group?: string; type: string }) => { `; - const toBase64 = (str: string) => - typeof window === "undefined" - ? Buffer.from(str).toString("base64") - : window.btoa(str); + const toBase64 = (str: string) => (typeof window === "undefined" ? Buffer.from(str).toString("base64") : window.btoa(str)); return (
@@ -85,63 +60,54 @@ const ContentCategory = (props: { group?: string; type: string }) => {

{pathname?.split("/")[1] == "in" ? ( <> - - {t("category")}  - + {t("category")}  {t("content")} ) : ( <> - - {t("content")}  - + {t("content")}  {t("category")} )}

-
- - - {categories?.map((category: any) => ( - -
router.push(prefixPath + `all/filter?category=${category?.id}`)} className="cursor-pointer relative group rounded-md overflow-hidden shadow-md hover:shadow-lg block"> - {/* Gambar */} - category +
+ {(seeAllValue ? categories : categories?.slice(0, 4 ))?.map((category: any) => ( +
+
router.push(`${prefixPath}all/filter?category=${category?.id}`)} className="cursor-pointer relative group rounded-md overflow-hidden shadow-md hover:shadow-lg block"> + {/* Gambar */} + category - {/* Overlay gelap */} -
+ {/* Overlay gelap */} +
- {/* Judul */} -
-

- {category?.name} -

-
-
- - ))} - - - - + {/* Judul */} +
+

{category?.name}

+
+
+
+ ))}
- {/*
- -
*/} -
+ + {/* Tombol See More / See Less */} + {categories?.length > 8 && ( +
+ +
+ )} + + {/*
router.push( @@ -152,7 +118,7 @@ const ContentCategory = (props: { group?: string; type: string }) => { > {t("seeAll")}
-
+
*/}
); diff --git a/components/landing-page/landing-polda-kaltara/content-category-kaltara.tsx b/components/landing-page/landing-polda-kaltara/content-category-kaltara.tsx index d0608437..d4a3a325 100644 --- a/components/landing-page/landing-polda-kaltara/content-category-kaltara.tsx +++ b/components/landing-page/landing-polda-kaltara/content-category-kaltara.tsx @@ -1,30 +1,47 @@ -import { getCategoryData, getPublicCategoryData } from "@/service/landing/landing"; -import Link from "next/link"; +import { + getCategoryData, + getPublicCategoryData, +} from "@/service/landing/landing"; import React, { useEffect, useState } from "react"; import { useTranslations } from "next-intl"; import { usePathname } from "next/navigation"; import { useParams } from "next/navigation"; import Image from "next/image"; -import { Reveal } from "../Reveal"; -import { Button } from "@/components/ui/button"; -const ContentCategory = (props: { group?: string }) => { +import { useRouter } from "@/i18n/routing"; +import { Reveal } from "../Reveal"; +import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from "@/components/ui/carousel"; + +const ContentCategoryKaltara = (props: { group?: string; type: string }) => { const [categories, setCategories] = useState(); const t = useTranslations("LandingPage"); const params = useParams(); const locale = params?.locale; + const [selectedTab, setSelectedTab] = useState("image"); const poldaName = params?.polda_name; const satkerName = params?.satker_name; - const [searchTerm, setSearchTerm] = useState(""); - const [seeAllValue, setSeeAllValue] = useState(false); - const pathname = usePathname(); + const router = useRouter(); + + let prefixPath = poldaName + ? `/polda/${poldaName}` + : satkerName + ? `/satker/${satkerName}` + : "/"; useEffect(() => { initFetch(); }, []); const initFetch = async () => { const response = await getPublicCategoryData( - props.group == "mabes" ? "" : props.group == "polda" && poldaName && String(poldaName)?.length > 1 ? poldaName : props.group == "satker" && satkerName && String(satkerName)?.length > 1 ? "satker-" + satkerName : "", + props.group == "mabes" + ? "" + : props.group == "polda" && poldaName && String(poldaName)?.length > 1 + ? poldaName + : props.group == "satker" && + satkerName && + String(satkerName)?.length > 1 + ? "satker-" + satkerName + : "", "", locale == "en" ? true : false ); @@ -32,6 +49,10 @@ const ContentCategory = (props: { group?: string }) => { setCategories(response?.data?.data?.content); }; + const [searchTerm, setSearchTerm] = useState(""); + const [seeAllValue, setSeeAllValue] = useState(false); + const pathname = usePathname(); + const shimmer = (w: number, h: number) => ` @@ -46,71 +67,88 @@ const ContentCategory = (props: { group?: string }) => { `; - const toBase64 = (str: string) => (typeof window === "undefined" ? Buffer.from(str).toString("base64") : window.btoa(str)); + const toBase64 = (str: string) => + typeof window === "undefined" + ? Buffer.from(str).toString("base64") + : window.btoa(str); return ( -
+
-

+

{pathname?.split("/")[1] == "in" ? ( <> - {t("category")}  + + {t("category")}  + {t("content")} ) : ( <> - {t("content")}  + + {t("content")}  + {t("category")} )}

-
+
-
- {categories?.map((category: any, index: number) => - !seeAllValue ? ( - index < 4 ? ( - - category -
-

{category?.name}

+
+ + + {categories?.map((category: any) => ( + +
router.push(prefixPath + `all/filter?category=${category?.id}`)} className="cursor-pointer relative group rounded-md overflow-hidden shadow-md hover:shadow-lg block"> + {/* Gambar */} + category + + {/* Overlay gelap */} +
+ + {/* Judul */} +
+

+ {category?.name} +

+
- - ) : ( - "" - ) - ) : ( - - category -
-

{category?.name}

-
- - ) - )} + + ))} + + + +
-
+ {/*
+
*/} +
+
+ router.push( + prefixPath + `/${selectedTab}/filter?sortBy=${props.type}` + ) + } + className="cursor-pointer border text-[#bb3523] rounded-lg text-sm lg:text-md px-4 py-1 border-[#bb3523]" + > + {t("seeAll")} +
); }; -export default ContentCategory; +export default ContentCategoryKaltara; diff --git a/components/landing-page/navbar.tsx b/components/landing-page/navbar.tsx index 70281490..78ed383c 100644 --- a/components/landing-page/navbar.tsx +++ b/components/landing-page/navbar.tsx @@ -187,20 +187,11 @@ const Navbar = () => { return (
-
+
{/* Logo */} - - Media Hub Logo + + Media Hub Logo {/* Nav Menu */} diff --git a/service/landing/landing.ts b/service/landing/landing.ts index ca1747d9..436c437a 100644 --- a/service/landing/landing.ts +++ b/service/landing/landing.ts @@ -284,3 +284,8 @@ export async function sendMessage(data: any) { const url = "inbox"; return httpPostInterceptor(url, data); } + +export async function enableListCategory() { + const url = `media/categories/list/publish?enablePage=1`; + return httpPostInterceptor(url); +}