From e0bb77e7afb4dafced3be0c400a87e59776d42f9 Mon Sep 17 00:00:00 2001 From: Sabda Yagra Date: Mon, 21 Jul 2025 22:23:30 +0700 Subject: [PATCH 1/7] fix: fixing filter and add thumbnail in admin update --- .../[polda_name]/video/detail/[slug]/page.tsx | 2 +- app/[locale]/(public)/all/filter/page.tsx | 501 ++++++++++-------- app/[locale]/(public)/audio/filter/page.tsx | 37 +- .../(public)/document/filter/page.tsx | 7 +- app/[locale]/(public)/image/filter/page.tsx | 44 +- app/[locale]/(public)/video/filter/page.tsx | 7 +- components/form/content/video-update-form.tsx | 99 +++- .../filter-all/audio-filter-card.tsx | 12 +- .../filter-all/document-filter-card.tsx | 4 +- .../filter-all/image-filter-card.tsx | 4 +- .../filter-all/video-filter-card.tsx | 4 +- .../landing-page/search-section-new.tsx | 2 - components/main/audio-detail.tsx | 2 +- messages/en.json | 11 +- messages/in.json | 3 + 15 files changed, 435 insertions(+), 304 deletions(-) diff --git a/app/[locale]/(public)/(polda)/polda/[polda_name]/video/detail/[slug]/page.tsx b/app/[locale]/(public)/(polda)/polda/[polda_name]/video/detail/[slug]/page.tsx index dc418284..3be24ad4 100644 --- a/app/[locale]/(public)/(polda)/polda/[polda_name]/video/detail/[slug]/page.tsx +++ b/app/[locale]/(public)/(polda)/polda/[polda_name]/video/detail/[slug]/page.tsx @@ -134,7 +134,7 @@ const DetailVideo = () => { const handleDownload = () => { if (downloadProgress === 0) { if (!userId) { - router.push("/auth/login"); + router.push("/auth"); } else { sendActivityLog(2); sendActivityLog(3); diff --git a/app/[locale]/(public)/all/filter/page.tsx b/app/[locale]/(public)/all/filter/page.tsx index 4554bb66..63861bdf 100644 --- a/app/[locale]/(public)/all/filter/page.tsx +++ b/app/[locale]/(public)/all/filter/page.tsx @@ -34,6 +34,7 @@ import FilterImageComponent from "@/components/landing-page/filter-all/image-fil import FilterVideoComponent from "@/components/landing-page/filter-all/video-filter-card"; import FilterDocumentComponent from "@/components/landing-page/filter-all/document-filter-card"; import FilterAudioComponent from "@/components/landing-page/filter-all/audio-filter-card"; +import { useTranslations } from "next-intl"; export default function FilterPage() { const router = useRouter(); @@ -86,6 +87,8 @@ export default function FilterPage() { const [categories, setCategories] = useState([]); const [userLevels, setUserLevels] = useState([]); const [contentAll, setContentAll] = useState([]); + const t = useTranslations("FilterPage"); + const [isFilterOpen, setIsFilterOpen] = useState(true); // const [startDate, endDate] = dateRange; @@ -387,244 +390,314 @@ export default function FilterPage() { }; return ( -
- {/* Header */} - -
+
+
+

{t("content", { defaultValue: "Content" })}

+ {">"}

- {" "} - Konten {">"} Semua Konten + + {t("allContent", { defaultValue: "All Content" })} +

|

-

{`Hasil Pencarian ${title} `}

- {`Terdapat ${contentAll?.length} konten yang dapat diunduh`} +

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t( + "downloadableContent", + { defaultValue: "Downloadable ContentS" } + )}`}

{/* Left */} -
-
-

- - Filter -

-
-
-
- - setSearchTitle(e.target.value)} - onKeyUp={handleKeyUp} - onKeyDown={handleKeyDown} - type="text" - id="search" - placeholder="Cari judul..." - className="mt-1 w-full border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" - /> -
+
+
+ +
-
- - setMonthYearFilter(date)} - dateFormat="MM | yyyy" - placeholderText="Pilih Tahun dan Bulan" - showMonthYearPicker - /> -
- -
- -
- +

+ + Filter +

+
+
+
+ + setSearchTitle(e.target.value)} + onKeyUp={handleKeyUp} + onKeyDown={handleKeyDown} + type="text" + id="search" + placeholder={t("searchTitle", { + defaultValue: "Search Title", + })} className="mt-1 w-full border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" - startDate={dateRange[0]} - endDate={dateRange[1]} - onChange={(update) => { - setDateRange(update); - }} - placeholderText="Pilih Tanggal" - onCalendarClose={() => setCalenderState(!calenderState)} /> -
- {handleClose ? ( - - ) : ( - "" - )} +
+ +
+ + setMonthYearFilter(date)} + dateFormat="MM | yyyy" + placeholderText={t("selectYear", { + defaultValue: "Select Year", + })} + showMonthYearPicker + /> +
+ +
+ +
+ { + setDateRange(update); + }} + placeholderText={t("selectDate", { + defaultValue: "Select Date", + })} + onCalendarClose={() => setCalenderState(!calenderState)} + /> +
+ {handleClose ? ( + + ) : ( + "" + )} +
-
-
-

- Kategori -

-
    - {categories.map((category: any) => ( -
  • -
  • + +
    • +
  • + +
    • +
+
+
+
-
+ )} {/* Konten Kanan */} -
-
-

Urutkan berdasarkan

- -
-
- - - - +
+
+
+

+ {t("sortBy", { defaultValue: "Sort By" })} +

+ +
+
+ + + + +
diff --git a/app/[locale]/(public)/audio/filter/page.tsx b/app/[locale]/(public)/audio/filter/page.tsx index 7cff776e..84154821 100644 --- a/app/[locale]/(public)/audio/filter/page.tsx +++ b/app/[locale]/(public)/audio/filter/page.tsx @@ -488,10 +488,16 @@ const FilterPage = () => {

{" "} - Audio {">"} {t("allAudio", { defaultValue: "All Audio" })} + Audio {">"}{" "} + + {t("allAudio", { defaultValue: "All Audio" })} +

|

-

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableAudio", { defaultValue: "Downloadable Audio" })}`}

+

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t( + "downloadableAudio", + { defaultValue: "Downloadable Audio" } + )}`}

{/* Left */} @@ -531,7 +537,9 @@ const FilterPage = () => { className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" onChange={(date) => setMonthYearFilter(date)} dateFormat="MM | yyyy" - placeholderText={t("selectYear", { defaultValue: "Select Year" })} + placeholderText={t("selectYear", { + defaultValue: "Select Year", + })} showMonthYearPicker />
@@ -549,7 +557,9 @@ const FilterPage = () => { onChange={(update) => { setDateRange(update); }} - placeholderText={t("searchDate", { defaultValue: "Search Date" })} + placeholderText={t("searchDate", { + defaultValue: "Search Date", + })} onCalendarClose={() => setCalenderState(!calenderState)} />
@@ -593,8 +603,7 @@ const FilterPage = () => { ))} -
- {/* Tombol Prev */} + {/*
- {/* Nomor Halaman */} {Array.from({ length: categoryTotalPages }, (_, i) => ( ))} - {/* Tombol Next */} -
+
*/}
{/* Garis */} @@ -709,14 +716,20 @@ const FilterPage = () => {
-

{t("sortBy", { defaultValue: "Sort By" })}

+

+ {t("sortBy", { defaultValue: "Sort By" })}{" "} +

diff --git a/app/[locale]/(public)/document/filter/page.tsx b/app/[locale]/(public)/document/filter/page.tsx index 9812149a..5f46875f 100644 --- a/app/[locale]/(public)/document/filter/page.tsx +++ b/app/[locale]/(public)/document/filter/page.tsx @@ -609,8 +609,7 @@ const FilterPage = () => { ))} -
- {/* Tombol Prev */} + {/*
- {/* Nomor Halaman */} {Array.from({ length: categoryTotalPages }, (_, i) => ( ))} - {/* Tombol Next */} -
+
*/}
{/* Garis */} diff --git a/app/[locale]/(public)/image/filter/page.tsx b/app/[locale]/(public)/image/filter/page.tsx index eacd0392..d08f2f67 100644 --- a/app/[locale]/(public)/image/filter/page.tsx +++ b/app/[locale]/(public)/image/filter/page.tsx @@ -485,24 +485,24 @@ const FilterPage = () => { clearTimeout(typingTimer); }; - const shimmer = (w: number, h: number) => ` - - - - - - - - - - - - `; + // const shimmer = (w: number, h: number) => ` + // + // + // + // + // + // + // + // + // + // + // + // `; - 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 (
@@ -517,8 +517,9 @@ const FilterPage = () => {

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableImage", { defaultValue: "Downloadable Image" })}`}

- {/* Left */} +
+ {/* Left */}
- {/* Nomor Halaman */} {Array.from({ length: categoryTotalPages }, (_, i) => ( ))} - {/* Tombol Next */} -
+
*/}
{/* Garis */} diff --git a/app/[locale]/(public)/video/filter/page.tsx b/app/[locale]/(public)/video/filter/page.tsx index a0958c6e..fb4e5ea0 100644 --- a/app/[locale]/(public)/video/filter/page.tsx +++ b/app/[locale]/(public)/video/filter/page.tsx @@ -610,8 +610,7 @@ const FilterPage = () => { ))} -
- {/* Tombol Prev */} + {/*
- {/* Nomor Halaman */} {Array.from({ length: categoryTotalPages }, (_, i) => ( ))} - {/* Tombol Next */} -
+
*/}
{/* Garis */} diff --git a/components/form/content/video-update-form.tsx b/components/form/content/video-update-form.tsx index 0cea11d7..394876ad 100644 --- a/components/form/content/video-update-form.tsx +++ b/components/form/content/video-update-form.tsx @@ -106,25 +106,21 @@ const CustomEditor = dynamic( export default function FormVideoUpdate() { const MySwal = withReactContent(Swal); const router = useRouter(); - const { id } = useParams() as { id: string }; console.log(id); const editor = useRef(null); type VideoSchema = z.infer; - let progressInfo: any = []; let counterUpdateProgress = 0; const [progressList, setProgressList] = useState([]); let uploadPersen = 0; const [isStartUpload, setIsStartUpload] = useState(false); const [counterProgress, setCounterProgress] = useState(0); - const t = useTranslations("Form"); const [selectedFiles, setSelectedFiles] = useState([]); const taskId = Cookies.get("taskId"); const scheduleId = Cookies.get("scheduleId"); const scheduleType = Cookies.get("scheduleType"); - const [categories, setCategories] = useState([]); const [selectedCategory, setSelectedCategory] = useState(); const [tags, setTags] = useState([]); @@ -133,7 +129,6 @@ export default function FormVideoUpdate() { const [selectedPublishers, setSelectedPublishers] = useState([]); const [detailVideo, setDetailVideo] = useState([]); const [thumbsSwiper, setThumbsSwiper] = useState(null); - const [files, setFiles] = useState([]); const [selectedTarget, setSelectedTarget] = useState(""); const [unitSelection, setUnitSelection] = useState({ @@ -263,7 +258,7 @@ export default function FormVideoUpdate() { setDetail(details); setSelectedTarget(String(details.category.id)); - + // Set form values immediately and then again after a delay to ensure editor is ready setValue("title", details.title); setValue("description", details.htmlDescription); @@ -609,7 +604,7 @@ export default function FormVideoUpdate() { const fileList = files.map((file: any) => (
@@ -728,7 +723,9 @@ export default function FormVideoUpdate() {
-

{t("form-video", { defaultValue: "Form Video" })}

+

+ {t("form-video", { defaultValue: "Form Video" })} +

{/* Input Title */}
@@ -767,14 +764,18 @@ export default function FormVideoUpdate() { {/* Show the category from details if it doesn't exist in categories list */} - {detail && !categories.find(cat => String(cat.id) === String(detail.category.id)) && ( - - {detail.category.name} - - )} + {detail && + !categories.find( + (cat) => + String(cat.id) === String(detail.category.id) + ) && ( + + {detail.category.name} + + )} {categories.map((category) => (
- +
- + {/*
- {t("upload-file-video-max", { defaultValue: "Upload File Video Max" })} + {t("upload-file-video-max", { + defaultValue: "Upload File Video Max", + })}
@@ -829,7 +836,9 @@ export default function FormVideoUpdate() {
{fileList}
- +
@@ -869,7 +878,9 @@ export default function FormVideoUpdate() { rel="noopener noreferrer" className="text-blue-500 text-sm" > - {t("view-file", { defaultValue: "View File" })} + {t("view-file", { + defaultValue: "View File", + })}
@@ -887,7 +898,9 @@ export default function FormVideoUpdate() { } className="form-checkbox" /> - {t("all", { defaultValue: "All" })} + + {t("all", { defaultValue: "All" })} +
@@ -980,7 +993,7 @@ export default function FormVideoUpdate() { )}
-
+ {/*
+
*/} +
+ + { + const file = e.target.files?.[0]; + if (file) { + setSelectedFiles([file]); + } + }} + className="dark:border dark:border-gray-500 dark:rounded-lg" + /> + {selectedFiles.length > 0 ? ( + + Thumbnail Baru + + ) : ( + + Thumbnail Lama + + )}
+
@@ -1027,7 +1072,9 @@ export default function FormVideoUpdate() {
- + {options.map((option: Option) => (
-

{t("suggestion-box", { defaultValue: "Suggestion Box" })} (0)

+

+ {t("suggestion-box", { defaultValue: "Suggestion Box" })} (0) +

{t("information", { defaultValue: "Information" })}:

diff --git a/components/landing-page/filter-all/audio-filter-card.tsx b/components/landing-page/filter-all/audio-filter-card.tsx index 4361c252..4ba73c4b 100644 --- a/components/landing-page/filter-all/audio-filter-card.tsx +++ b/components/landing-page/filter-all/audio-filter-card.tsx @@ -145,7 +145,7 @@ export default function FilterAudioComponent(props: {
{formatDateToIndonesian(new Date(audio?.createdAt))}{" "} - {audio?.timezone ? audio?.timezone : "WIB"} |{" "} - {" "} - {audio?.clickCount}{" "} + {audio?.timezone ? audio?.timezone : "WIB"} |   + +  {audio?.clickCount}{" "}
{audio?.title} @@ -178,8 +178,8 @@ export default function FilterAudioComponent(props: { ))} - - + +
) : ( diff --git a/components/landing-page/filter-all/document-filter-card.tsx b/components/landing-page/filter-all/document-filter-card.tsx index 07b59bdb..2794f11d 100644 --- a/components/landing-page/filter-all/document-filter-card.tsx +++ b/components/landing-page/filter-all/document-filter-card.tsx @@ -192,8 +192,8 @@ export default function FilterDocumentComponent(props: { ))} - - + +
) : ( diff --git a/components/landing-page/filter-all/image-filter-card.tsx b/components/landing-page/filter-all/image-filter-card.tsx index c8c7672d..8346bfc3 100644 --- a/components/landing-page/filter-all/image-filter-card.tsx +++ b/components/landing-page/filter-all/image-filter-card.tsx @@ -164,8 +164,8 @@ export default function FilterImageComponent(props: { ))} - - + +
) : ( diff --git a/components/landing-page/filter-all/video-filter-card.tsx b/components/landing-page/filter-all/video-filter-card.tsx index ddf9c6fb..4b87dcf0 100644 --- a/components/landing-page/filter-all/video-filter-card.tsx +++ b/components/landing-page/filter-all/video-filter-card.tsx @@ -165,8 +165,8 @@ export default function FilterVideoComponent(props: { ))} - - + +
) : ( diff --git a/components/landing-page/search-section-new.tsx b/components/landing-page/search-section-new.tsx index 28ee2d5d..8e0540f7 100644 --- a/components/landing-page/search-section-new.tsx +++ b/components/landing-page/search-section-new.tsx @@ -1,6 +1,5 @@ import { useTranslations } from "next-intl"; import { useParams } from "next/navigation"; -import router from "next/router"; import React, { useEffect, useState } from "react"; import { Icon } from "@iconify/react/dist/iconify.js"; import { @@ -13,7 +12,6 @@ import { } from "../ui/select"; import Image from "next/image"; import { getHeroData } from "@/service/landing/landing"; -import { title } from "process"; import { htmlToString } from "@/utils/globals"; import { Link, useRouter } from "@/i18n/routing"; import { Button } from "../ui/button"; diff --git a/components/main/audio-detail.tsx b/components/main/audio-detail.tsx index 461c594d..437bfd29 100644 --- a/components/main/audio-detail.tsx +++ b/components/main/audio-detail.tsx @@ -298,7 +298,7 @@ const DetailAudio = () => { async function shareToEmail() { if (Number(userRoleId) < 1 || userRoleId == undefined) { - router.push("/auth/login"); + router.push("/auth"); } else { const data = { mediaUploadId: id?.split("-")?.[0], diff --git a/messages/en.json b/messages/en.json index 12d8c4f0..62c08573 100644 --- a/messages/en.json +++ b/messages/en.json @@ -641,6 +641,9 @@ "timeTable1": "TIMETABLE /" }, "FilterPage": { + "downloadableContent": "Downloadable Content", + "content": "Content", + "allContent":"All Content", "image": "Image", "video": "Video", "text": "Text", @@ -653,10 +656,10 @@ "searchTitle": "Find Title...", "monthYear": "Month and Year", "thereIs": "There is", - "downloadableImage": "downloadable image", - "downloadableVideo": "downloadable video", - "downloadableText": "downloadable text", - "downloadableAudio": "downloadable audio", + "downloadableImage": "Downloadable image", + "downloadableVideo": "Downloadable video", + "downloadableText": "Downloadable text", + "downloadableAudio": "Downloadable audio", "date": "Date", "selectYear": "Select Month and Year", "selectDate": "Select Date", diff --git a/messages/in.json b/messages/in.json index 2dc92af4..3f5031a1 100644 --- a/messages/in.json +++ b/messages/in.json @@ -642,6 +642,9 @@ "timeTable1": "JADWAL /" }, "FilterPage": { + "content": "Konten", + "downloadableContent": "artikel berisi konten yang dapat di unduh", + "allContent": "Semua Konten", "image": "Foto", "video": "Audio Visual", "text": "Teks", From 504101b91cd41d6765eb6c48f6c30d10aa12afa4 Mon Sep 17 00:00:00 2001 From: Rama Priyanto Date: Tue, 22 Jul 2025 09:29:16 +0700 Subject: [PATCH 2/7] fix:handle empty file placement & target publish spit --- components/form/content/spit-convert-form.tsx | 244 ++++++++++++------ 1 file changed, 158 insertions(+), 86 deletions(-) diff --git a/components/form/content/spit-convert-form.tsx b/components/form/content/spit-convert-form.tsx index fdaee85d..8d7f85e5 100644 --- a/components/form/content/spit-convert-form.tsx +++ b/components/form/content/spit-convert-form.tsx @@ -28,13 +28,13 @@ import { Checkbox } from "@/components/ui/checkbox"; import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group"; // Icons -import { - AlertCircle, - FileText, - Image, - Loader2, - Save, - Trash2, +import { + AlertCircle, + FileText, + Image, + Loader2, + Save, + Trash2, Edit3, Globe, Users, @@ -42,7 +42,7 @@ import { Eye, Settings, CheckCircle, - XCircle + XCircle, } from "lucide-react"; // Swiper @@ -62,10 +62,7 @@ import { getTagsBySubCategoryId, listEnableCategory, } from "@/service/content/content"; -import { - generateDataRewrite, - getDetailArticle, -} from "@/service/content/ai"; +import { generateDataRewrite, getDetailArticle } from "@/service/content/ai"; // Utils import { getCookiesDecrypt } from "@/lib/utils"; @@ -150,14 +147,14 @@ const PLACEMENT_OPTIONS = [ // Dynamic imports const CustomEditor = dynamic( () => import("@/components/editor/custom-editor"), - { + { ssr: false, loading: () => (
Loading editor...
- ) + ), } ); @@ -190,24 +187,31 @@ export default function FormConvertSPIT() { const [isDeleting, setIsDeleting] = useState(false); const [detail, setDetail] = useState(null); const [categories, setCategories] = useState([]); - const [selectedCategoryId, setSelectedCategoryId] = useState(null); - const [selectedFileType, setSelectedFileType] = useState<"original" | "rewrite">("original"); - const [selectedWritingStyle, setSelectedWritingStyle] = useState("professional"); + const [selectedCategoryId, setSelectedCategoryId] = useState( + null + ); + const [selectedFileType, setSelectedFileType] = useState< + "original" | "rewrite" + >("original"); + const [selectedWritingStyle, setSelectedWritingStyle] = + useState("professional"); const [showRewriteEditor, setShowRewriteEditor] = useState(false); const [isGeneratingRewrite, setIsGeneratingRewrite] = useState(false); const [isLoadingRewrite, setIsLoadingRewrite] = useState(false); - + // Media state const [detailThumb, setDetailThumb] = useState([]); const [thumbsSwiper, setThumbsSwiper] = useState(null); const [files, setFiles] = useState([]); const [filePlacements, setFilePlacements] = useState([]); - + // Content rewrite state const [articleIds, setArticleIds] = useState([]); - const [selectedArticleId, setSelectedArticleId] = useState(null); + const [selectedArticleId, setSelectedArticleId] = useState( + null + ); const [articleBody, setArticleBody] = useState(""); - + // Form data state const [tags, setTags] = useState([]); const [publishedFor, setPublishedFor] = useState([]); @@ -262,7 +266,7 @@ export default function FormConvertSPIT() { // Auto-select "Pers Rilis" category if schedule type is 3 const scheduleId = Cookies.get("scheduleId"); const scheduleType = Cookies.get("scheduleType"); - + if (scheduleId && scheduleType === "3") { const persRilisCategory = categories.find((cat: Category) => cat.name.toLowerCase().includes("pers rilis") @@ -281,7 +285,7 @@ export default function FormConvertSPIT() { try { const response = await getTagsBySubCategoryId(categoryId); if (response?.data?.data?.length > 0) { - const tagsMerge = [...tags, response?.data?.data] + const tagsMerge = [...tags, response?.data?.data]; setTags(tagsMerge); } } catch (error) { @@ -293,7 +297,7 @@ export default function FormConvertSPIT() { try { const response = await detailSPIT(id); const details = response?.data?.data; - + if (!details) { throw new Error("Detail not found"); } @@ -301,11 +305,11 @@ export default function FormConvertSPIT() { setDetail(details); setFiles(details.contentList || []); setDetailThumb( - (details.contentList || []).map((file: FileType) => - file.contentFile || "default-image.jpg" + (details.contentList || []).map( + (file: FileType) => file.contentFile || "default-image.jpg" ) ); - + // Initialize file placements const fileCount = details.contentList?.length || 0; setFilePlacements(Array(fileCount).fill([])); @@ -314,7 +318,10 @@ export default function FormConvertSPIT() { setValue("contentTitle", details.contentTitle || ""); setValue("contentDescription", details.contentDescription || ""); setValue("contentCreator", details.contentCreator || ""); - setValue("contentRewriteDescription", details.contentRewriteDescription || ""); + setValue( + "contentRewriteDescription", + details.contentRewriteDescription || "" + ); // Set category if (details.categoryId) { @@ -324,7 +331,9 @@ export default function FormConvertSPIT() { // Set tags if (details.contentTag) { - const initialTags = details.contentTag.split(",").map((tag: string) => tag.trim()); + const initialTags = details.contentTag + .split(",") + .map((tag: string) => tag.trim()); setTags(initialTags); } } catch (error) { @@ -365,13 +374,13 @@ export default function FormConvertSPIT() { }; const response = await generateDataRewrite(request); - + if (response?.error) { throw new Error(response.message); } const newArticleId = response?.data?.data?.id; - setArticleIds(prev => { + setArticleIds((prev) => { const updated = [...prev]; if (updated.length < 3) { updated.push(newArticleId); @@ -405,23 +414,26 @@ export default function FormConvertSPIT() { try { setIsLoadingRewrite(true); setSelectedArticleId(articleId); - + let retryCount = 0; const maxRetries = 20; - + while (retryCount < maxRetries) { const response = await getDetailArticle(articleId); const articleData = response?.data?.data; if (articleData?.status === 2) { - const cleanArticleBody = articleData.articleBody?.replace(/]*>/g, ""); + const cleanArticleBody = articleData.articleBody?.replace( + /]*>/g, + "" + ); setArticleBody(cleanArticleBody || ""); setValue("contentRewriteDescription", cleanArticleBody || ""); break; } retryCount++; - await new Promise(resolve => setTimeout(resolve, 5000)); + await new Promise((resolve) => setTimeout(resolve, 5000)); } if (retryCount >= maxRetries) { @@ -444,40 +456,46 @@ export default function FormConvertSPIT() { if (e.key === "Enter" && inputRef.current?.value.trim()) { e.preventDefault(); const newTag = inputRef.current.value.trim(); - + if (!tags.includes(newTag)) { - setTags(prev => [...prev, newTag]); + setTags((prev) => [...prev, newTag]); } - + inputRef.current.value = ""; } }; const handleRemoveTag = (index: number) => { - setTags(prev => prev.filter((_, i) => i !== index)); + setTags((prev) => prev.filter((_, i) => i !== index)); }; const handlePublishTargetChange = (optionId: string) => { if (optionId === "all") { - setPublishedFor(prev => - prev.length === PUBLISH_OPTIONS.filter(opt => opt.id !== "all").length - ? [] - : PUBLISH_OPTIONS.filter(opt => opt.id !== "all").map(opt => opt.id) + setPublishedFor((prev) => + prev.length === PUBLISH_OPTIONS.filter((opt) => opt.id !== "all").length + ? [] + : PUBLISH_OPTIONS.filter((opt) => opt.id !== "all").map( + (opt) => opt.id + ) ); } else { - setPublishedFor(prev => - prev.includes(optionId) - ? prev.filter(id => id !== optionId && id !== "all") - : [...prev.filter(id => id !== "all"), optionId] + setPublishedFor((prev) => + prev.includes(optionId) + ? prev.filter((id) => id !== optionId && id !== "all") + : [...prev.filter((id) => id !== "all"), optionId] ); } }; - const handleFilePlacementChange = (fileIndex: number, placement: string, checked: boolean) => { - setFilePlacements(prev => { + const handleFilePlacementChange = ( + fileIndex: number, + placement: string, + checked: boolean + ) => { + setFilePlacements((prev) => { const updated = [...prev]; const currentPlacements = updated[fileIndex] || []; - + if (checked) { if (placement === "all") { updated[fileIndex] = ["all", "mabes", "polda", "international"]; @@ -492,25 +510,27 @@ export default function FormConvertSPIT() { if (placement === "all") { updated[fileIndex] = []; } else { - const newPlacements = currentPlacements.filter(p => p !== placement); + const newPlacements = currentPlacements.filter( + (p) => p !== placement + ); if (newPlacements.length === 3 && newPlacements.includes("all")) { - updated[fileIndex] = newPlacements.filter(p => p !== "all"); + updated[fileIndex] = newPlacements.filter((p) => p !== "all"); } else { updated[fileIndex] = newPlacements; } } } - + return updated; }); }; const handleSelectAllPlacements = (placement: string, checked: boolean) => { - setFilePlacements(prev => - prev.map(filePlacements => - checked + setFilePlacements((prev) => + prev.map((filePlacements) => + checked ? Array.from(new Set([...filePlacements, placement])) - : filePlacements.filter(p => p !== placement) + : filePlacements.filter((p) => p !== placement) ) ); }; @@ -520,7 +540,7 @@ export default function FormConvertSPIT() { console.log("filePlacements : ", filePlacements); for (let i = 0; i < filePlacements.length; i++) { if (filePlacements[i].length > 0) { - const placements = filePlacements[i]; + const placements = filePlacements[i]; placementData.push({ mediaFileId: files[i].contentId, placements: placements.join(","), @@ -530,15 +550,38 @@ export default function FormConvertSPIT() { return placementData; }; + const checkPlacement = (data: any) => { + let temp = true; + for (const element of data) { + if (element.length < 1) { + temp = false; + break; + } + } + + return temp; + }; + // Form submission const onSubmit = async (data: FormData) => { + if (!checkPlacement(filePlacements)) { + error("Select File Placement"); + return false; + } + + if (publishedFor.length < 1) { + error("Select Publish Target"); + return false; + } + try { setIsSaving(true); - - const description = selectedFileType === "original" - ? data.contentDescription - : data.contentRewriteDescription; - + + const description = + selectedFileType === "original" + ? data.contentDescription + : data.contentRewriteDescription; + const requestData = { spitId: id, title: data.contentTitle, @@ -552,7 +595,7 @@ export default function FormConvertSPIT() { }; await convertSPIT(requestData); - + MySwal.fire({ title: "Success", text: "Data saved successfully", @@ -590,7 +633,7 @@ export default function FormConvertSPIT() { try { setIsDeleting(true); await deleteSPIT(id); - + MySwal.fire({ title: "Success", text: "Content deleted successfully", @@ -630,17 +673,15 @@ export default function FormConvertSPIT() { {/* Header */}
-

SPIT Convert Form

+

+ SPIT Convert Form +

Convert and manage your SPIT content

- @@ -734,7 +775,9 @@ export default function FormConvertSPIT() { setSelectedFileType(value)} + onValueChange={(value: "original" | "rewrite") => + setSelectedFileType(value) + } className="grid grid-cols-2 gap-4" >
@@ -789,7 +832,9 @@ export default function FormConvertSPIT() { ))} @@ -870,7 +920,7 @@ export default function FormConvertSPIT() { ))} - + 1 && (
{PLACEMENT_OPTIONS.map((option) => ( -
+
- handleSelectAllPlacements(option.value, Boolean(checked)) + handleSelectAllPlacements( + option.value, + Boolean(checked) + ) } /> -
@@ -936,12 +995,21 @@ export default function FormConvertSPIT() {

{file.fileName}

{PLACEMENT_OPTIONS.map((option) => ( -
+
- handleFilePlacementChange(index, option.value, Boolean(checked)) + handleFilePlacementChange( + index, + option.value, + Boolean(checked) + ) } />
{/* Garis */} diff --git a/app/[locale]/(public)/audio/filter/page.tsx b/app/[locale]/(public)/audio/filter/page.tsx index 84154821..63b89649 100644 --- a/app/[locale]/(public)/audio/filter/page.tsx +++ b/app/[locale]/(public)/audio/filter/page.tsx @@ -603,7 +603,7 @@ const FilterPage = () => { ))} - {/*
+
-
*/} +
{/* Garis */} diff --git a/app/[locale]/(public)/document/filter/page.tsx b/app/[locale]/(public)/document/filter/page.tsx index 5f46875f..22d64462 100644 --- a/app/[locale]/(public)/document/filter/page.tsx +++ b/app/[locale]/(public)/document/filter/page.tsx @@ -504,10 +504,16 @@ const FilterPage = () => {

{" "} - {t("text", { defaultValue: "Text" })} {">"} {t("allText", { defaultValue: "All Text" })} + {t("text", { defaultValue: "Text" })} {">"}{" "} + + {t("allText", { defaultValue: "All Text" })} +

|

-

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableText", { defaultValue: "Downloadable Text" })}`}

+

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t( + "downloadableText", + { defaultValue: "Downloadable Text" } + )}`}

{/* Left */} @@ -547,7 +553,9 @@ const FilterPage = () => { className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" onChange={(date) => setMonthYearFilter(date)} dateFormat="MM | yyyy" - placeholderText={t("selectYear", { defaultValue: "Select Year" })} + placeholderText={t("selectYear", { + defaultValue: "Select Year", + })} showMonthYearPicker />
@@ -565,7 +573,9 @@ const FilterPage = () => { onChange={(update) => { setDateRange(update); }} - placeholderText={t("selectDate", { defaultValue: "Select Date" })} + placeholderText={t("selectDate", { + defaultValue: "Select Date", + })} onCalendarClose={() => setCalenderState(!calenderState)} />
@@ -609,7 +619,7 @@ const FilterPage = () => { ))} - {/*
+
-
*/} +
{/* Garis */} @@ -768,14 +778,20 @@ const FilterPage = () => {
-

{t("sortBy", { defaultValue: "Sort By" })}

+

+ {t("sortBy", { defaultValue: "Sort By" })} +

diff --git a/app/[locale]/(public)/image/filter/page.tsx b/app/[locale]/(public)/image/filter/page.tsx index d08f2f67..46b3d475 100644 --- a/app/[locale]/(public)/image/filter/page.tsx +++ b/app/[locale]/(public)/image/filter/page.tsx @@ -511,13 +511,17 @@ const FilterPage = () => {

{t("image", { defaultValue: "Image" })}

{">"}

- {t("allImage", { defaultValue: "All Image" })} + + {t("allImage", { defaultValue: "All Image" })} +

|

-

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableImage", { defaultValue: "Downloadable Image" })}`}

+

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t( + "downloadableImage", + { defaultValue: "Downloadable Image" } + )}`}

-
{/* Left */}
@@ -551,7 +555,9 @@ const FilterPage = () => { onKeyDown={handleKeyDown} type="text" id="search" - placeholder={t("searchTitle", { defaultValue: "Search Title" })} + placeholder={t("searchTitle", { + defaultValue: "Search Title", + })} className="mt-1 w-full border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" />
@@ -565,7 +571,9 @@ const FilterPage = () => { className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" onChange={(date) => setMonthYearFilter(date)} dateFormat="MM | yyyy" - placeholderText={t("selectYear", { defaultValue: "Select Year" })} + placeholderText={t("selectYear", { + defaultValue: "Select Year", + })} showMonthYearPicker />
@@ -583,7 +591,9 @@ const FilterPage = () => { onChange={(update) => { setDateRange(update); }} - placeholderText={t("selectDate", { defaultValue: "Select Date" })} + placeholderText={t("selectDate", { + defaultValue: "Select Date", + })} onCalendarClose={() => setCalenderState(!calenderState)} />
@@ -627,7 +637,7 @@ const FilterPage = () => { ))} - {/*
+
-
*/} +
{/* Garis */} @@ -759,14 +769,20 @@ const FilterPage = () => {
-

{t("sortBy", { defaultValue: "Sort By" })}

+

+ {t("sortBy", { defaultValue: "Sort By" })} +

diff --git a/app/[locale]/(public)/regional/filter/page.tsx b/app/[locale]/(public)/regional/filter/page.tsx new file mode 100644 index 00000000..a53cc99d --- /dev/null +++ b/app/[locale]/(public)/regional/filter/page.tsx @@ -0,0 +1,731 @@ +"use client"; + +import React, { useEffect, useState } from "react"; +import { Checkbox } from "@/components/ui/checkbox"; +import { Icon } from "@iconify/react/dist/iconify.js"; +import { getOnlyDate, getOnlyMonthAndYear } from "@/utils/globals"; +import { useParams, usePathname, useSearchParams } from "next/navigation"; +import { + getPublicCategoryData, + getUserLevelListByParent, + listCategory, + listData, + listDataAll, + listDataRegional, +} from "@/service/landing/landing"; +import { + ColumnDef, + ColumnFiltersState, + PaginationState, + SortingState, + VisibilityState, +} from "@tanstack/react-table"; +import { Link, useRouter } from "@/i18n/routing"; +import { Input } from "@/components/ui/input"; +import ReactDatePicker from "react-datepicker"; +import "react-datepicker/dist/react-datepicker.css"; +import { close, loading } from "@/config/swal"; +import FilterImageComponent from "@/components/landing-page/filter-all/image-filter-card"; +import FilterVideoComponent from "@/components/landing-page/filter-all/video-filter-card"; +import FilterDocumentComponent from "@/components/landing-page/filter-all/document-filter-card"; +import FilterAudioComponent from "@/components/landing-page/filter-all/audio-filter-card"; +import { useTranslations } from "next-intl"; + +export default function FilterPage() { + const router = useRouter(); + const asPath = usePathname(); + const params = useParams(); + const searchParams = useSearchParams(); + const locale = params?.locale; + const [imageData, setImageData] = useState(); + 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 [rowSelection, setRowSelection] = React.useState({}); + const [pagination, setPagination] = React.useState({ + pageIndex: 0, + pageSize: 10, + }); + const [page, setPage] = useState(1); + const [totalContent, setTotalContent] = useState(); + const [change, setChange] = useState(false); + const sortBy = searchParams?.get("sortBy"); + const title = searchParams?.get("title"); + const categorie = searchParams?.get("category"); + const group = searchParams?.get("group"); + const tag: any = searchParams?.get("tag"); + const [contentImage, setContentImage] = useState([]); + const [, setGetTotalPage] = useState(); + let typingTimer: any; + const doneTypingInterval = 1500; + const [search, setSearch] = useState(); + const [categoryFilter, setCategoryFilter] = useState([]); + const [monthYearFilter, setMonthYearFilter] = useState(); + const [searchTitle, setSearchTitle] = useState(""); + const [sortByOpt, setSortByOpt] = useState( + sortBy === "popular" ? "clickCount" : "createdAt" + ); + const isRegional = asPath?.includes("regional"); + const isSatker = asPath?.includes("satker"); + const [formatFilter, setFormatFilter] = useState([]); + const pages = page ? page - 1 : 0; + const [startDateString, setStartDateString] = useState(); + const [endDateString, setEndDateString] = useState(); + const [dateRange, setDateRange] = useState([null, null]); + const [calenderState, setCalenderState] = useState(false); + const [handleClose, setHandleClose] = useState(false); + const [categories, setCategories] = useState([]); + const [userLevels, setUserLevels] = useState([]); + const [contentAll, setContentAll] = useState([]); + const t = useTranslations("FilterPage"); + const [isFilterOpen, setIsFilterOpen] = useState(true); + const [categoryPage, setCategoryPage] = useState(1); + const [categoryTotalPages, setCategoryTotalPages] = useState(1); + const poldaName = params?.polda_name; + const satkerName = params?.satker_name; + + useEffect(() => { + fetchCategories(categoryPage); + }, [categoryPage]); + + const fetchCategories = async (pageNumber: number) => { + const groupParam = + poldaName && poldaName.length > 1 + ? poldaName + : satkerName && satkerName.length > 1 + ? "satker-" + satkerName + : ""; + + const isInt = locale === "en"; + + const response = await getPublicCategoryData( + groupParam, + "", + isInt, + pageNumber + ); // halaman 1-based + + const content = response?.data?.data?.content || []; + const total = response?.data?.data?.totalPages || 1; + + setCategories(content); + setCategoryTotalPages(total); + }; + + React.useEffect(() => { + const pageFromUrl = searchParams?.get("page"); + if (pageFromUrl) { + setPage(Number(pageFromUrl)); + } + }, [searchParams]); + + useEffect(() => { + async function initState() { + getCategories(); + // getSelectedCategory(); + if (isSatker) { + getUserLevels(); + } + } + + initState(); + }, []); + + useEffect(() => { + if (categorie) { + setCategoryFilter( + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); + console.log( + "Kategori", + categorie, + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); + } + }, [categorie]); + + // useEffect(() => { + // fetchData(); + // }, [page, sortBy, sortByOpt, title]); + + useEffect(() => { + async function initState() { + if (isRegional) { + getDataRegional(); + } else { + getData(); + } + } + console.log(monthYearFilter, "monthFilter"); + initState(); + }, [ + change, + monthYearFilter, + sortBy, + sortByOpt, + title, + startDateString, + endDateString, + categorie, + formatFilter, + ]); + + async function getCategories() { + const category = await listCategory("1"); + const resCategory = category?.data?.data?.content; + setCategories(resCategory); + } + + useEffect(() => { + function initState() { + if (dateRange[0] != null && dateRange[1] != null) { + setStartDateString(getOnlyDate(dateRange[0])); + setEndDateString(getOnlyDate(dateRange[1])); + setHandleClose(true); + console.log("date range", dateRange, getOnlyDate(dateRange[0])); + } + } + initState(); + }, [calenderState]); + + async function getData() { + if (asPath?.includes("/polda/") == true) { + if (asPath?.split("/")[2] !== "[polda_name]") { + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; + + const name = title == undefined ? "" : title; + const format = formatFilter == undefined ? "" : formatFilter?.join(","); + const filterGroup = group == undefined ? asPath.split("/")[2] : group; + loading(); + const response = await listDataAll( + "", + name, + filter, + "", + tag, + filterGroup, + startDateString, + endDateString, + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter) + ?.split("/")[0] + ?.replace("0", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "" + ); + close(); + // setGetTotalPage(response?.data?.data?.totalPages); + // setContentImage(response?.data?.data?.content); + // setTotalContent(response?.data?.data?.totalElements); + const data = response?.data?.data; + const contentData = data?.content; + setImageData(contentData); + setTotalData(data?.totalElements); + setContentAll(response?.data?.data?.content); + setTotalPage(response?.data?.data?.totalPages); + setTotalContent(response?.data?.data?.totalElements); + } + } else { + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; + + const name = title == undefined ? "" : title; + const format = formatFilter == undefined ? "" : formatFilter?.join(","); + loading(); + const response = await listDataAll( + "", + name, + filter, + "", + "", + tag, + startDateString, + endDateString, + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter) + ?.split("/")[0] + ?.replace("0", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "" + ); + close(); + // setGetTotalPage(response?.data?.data?.totalPages); + // setContentImage(response?.data?.data?.content); + // setTotalContent(response?.data?.data?.totalElements); + const data = response?.data?.data; + const contentData = data?.content; + setImageData(contentData); + setTotalData(data?.totalElements); + setContentAll(response?.data?.data?.content); + setTotalPage(response?.data?.data?.totalPages); + setTotalContent(response?.data?.data?.totalElements); + } + } + + const handleCategoryFilter = (e: boolean, id: string) => { + let filter = [...categoryFilter]; + + if (e) { + filter = [...categoryFilter, String(id)]; + } else { + filter.splice(categoryFilter.indexOf(id), 1); + } + console.log("checkbox filter", filter); + setCategoryFilter(filter); + router.push(`?category=${filter.join("&")}`); + }; + + const handleFormatFilter = (e: boolean, id: string) => { + let filter = [...formatFilter]; + + if (e) { + filter = [...formatFilter, id]; + } else { + filter.splice(formatFilter.indexOf(id), 1); + } + console.log("Format filter", filter); + setFormatFilter(filter); + }; + + const cleanCheckbox = () => { + setCategoryFilter([]); + setFormatFilter([]); + router.push(`?category=&title=`); + setDateRange([null, null]); + setMonthYearFilter(null); + setChange(!change); + }; + + async function getDataRegional() { + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; + + const name = title == undefined ? "" : title; + const format = formatFilter == undefined ? "" : formatFilter?.join(","); + loading(); + const response = await listDataRegional( + "", + name, + filter, + format, + "", + startDateString, + endDateString, + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", + 12, + pages, + sortByOpt + ); + close(); + + setGetTotalPage(response?.data?.data?.totalPages); + setContentImage(response?.data?.data?.content); + setTotalContent(response?.data?.data?.totalElements); + } + + function getSelectedCategory() { + const filter = []; + + if (categorie) { + const categoryArr = categorie.split(","); + + for (const element of categoryArr) { + filter.push(Number(element)); + } + + setCategoryFilter(filter); + } + } + + const handleDeleteDate = () => { + setDateRange([null, null]); + setStartDateString(""); + setEndDateString(""); + setHandleClose(false); + }; + + const handleSorting = (e: any) => { + console.log(e.target.value); + if (e.target.value == "terbaru") { + setSortByOpt("createdAt"); + } else { + setSortByOpt("clickCount"); + } + + setChange(!change); + }; + + async function getUserLevels() { + const res = await getUserLevelListByParent(761); + const userLevelList = res?.data?.data; + + if (userLevelList !== null) { + let optionArr: any = []; + + userLevelList?.map((option: any) => { + let optionData = { + id: option.id, + label: option.name, + value: option.id, + }; + + optionArr.push(optionData); + }); + + setUserLevels(optionArr); + } + } + + const handleKeyUp = () => { + clearTimeout(typingTimer); + typingTimer = setTimeout(doneTyping, doneTypingInterval); + }; + + async function doneTyping() { + if (searchTitle == "" || searchTitle == undefined) { + router.push("?title="); + } else { + router.push(`?title=${searchTitle}`); + } + } + + const handleKeyDown = () => { + clearTimeout(typingTimer); + }; + + return ( +
+
+

{t("content", { defaultValue: "Content" })}

+ {">"} +

+ + {t("allContent", { defaultValue: "All Content" })} + +

+

|

+

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t( + "downloadableContent", + { defaultValue: "Downloadable ContentS" } + )}`}

+
+ + {/* Left */} +
+
+ +
+ + {isFilterOpen && ( +
+

+ + Filter +

+
+
+
+ + setSearchTitle(e.target.value)} + onKeyUp={handleKeyUp} + onKeyDown={handleKeyDown} + type="text" + id="search" + placeholder={t("searchTitle", { + defaultValue: "Search Title", + })} + className="mt-1 w-full border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" + /> +
+ +
+ + setMonthYearFilter(date)} + dateFormat="MM | yyyy" + placeholderText={t("selectYear", { + defaultValue: "Select Year", + })} + showMonthYearPicker + /> +
+ +
+ +
+ { + setDateRange(update); + }} + placeholderText={t("selectDate", { + defaultValue: "Select Date", + })} + onCalendarClose={() => setCalenderState(!calenderState)} + /> +
+ {handleClose ? ( + + ) : ( + "" + )} +
+
+
+ +
+

+ {t("categories", { defaultValue: "Categories" })} +

+
    + {categories.map((category: any) => ( +
  • + +
    • + ))} +
    + + + {Array.from({ length: categoryTotalPages }, (_, i) => ( + + ))} + + +
    +
+
+ {/* Garis */} +
+ {/* Garis */} +
+

+ Format +

+
    +
  • + +
    • +
  • + +
    • +
  • + +
    • +
+
+
+ +
+
+ )} + + {/* Konten Kanan */} +
+
+
+

+ {t("sortBy", { defaultValue: "Sort By" })} +

+ +
+
+ + + + +
+
+
+
+
+ ); +} diff --git a/app/[locale]/(public)/regional/layout.tsx b/app/[locale]/(public)/regional/layout.tsx new file mode 100644 index 00000000..e2ca7e0b --- /dev/null +++ b/app/[locale]/(public)/regional/layout.tsx @@ -0,0 +1,14 @@ +import Footer from "@/components/landing-page/footer"; +import Navbar from "@/components/landing-page/navbar"; + +const layout = async ({ children }: { children: React.ReactNode }) => { + return ( + <> + + {children} +
+ + ); +}; + +export default layout; diff --git a/app/[locale]/(public)/schedule/page.tsx b/app/[locale]/(public)/schedule/page.tsx index 3ffbc938..c4bef935 100644 --- a/app/[locale]/(public)/schedule/page.tsx +++ b/app/[locale]/(public)/schedule/page.tsx @@ -295,7 +295,6 @@ const Schedule = (props: any) => { }; temp.push(now); } - console.log("QQQQQ", temp); setCity(temp); } fetchPoldaPolres(); @@ -341,7 +340,6 @@ const Schedule = (props: any) => { curr.setDate(curr.getDate() + 1); } - console.log("Change Date :", dateListTemp); setDateList(dateListTemp); setDateAWeek(dateListTemp); } @@ -431,7 +429,6 @@ const Schedule = (props: any) => { const response = await detailSchedule(itemFound?.id); setDetail(response?.data?.data); setContent(response?.data?.data?.files); - console.log("item Found", itemFound); close(); setOpenDialog(true); }; @@ -483,7 +480,6 @@ const Schedule = (props: any) => { }; const deleteFilterhandler = (filterId: any) => { - console.log("hapus", filterId); const deletedReg = regionName.filter((list: any) => list.id !== filterId); const filtered = regionFilter.filter((list: any) => list !== filterId); diff --git a/app/[locale]/(public)/video/filter/page.tsx b/app/[locale]/(public)/video/filter/page.tsx index fb4e5ea0..8cfd44c0 100644 --- a/app/[locale]/(public)/video/filter/page.tsx +++ b/app/[locale]/(public)/video/filter/page.tsx @@ -328,7 +328,7 @@ const FilterPage = () => { setCategoryFilter(filter); router.push(`?category=${filter.join("&")}`); }; - + const handleFormatFilter = (e: boolean, id: string) => { let filter = [...formatFilter]; @@ -505,10 +505,16 @@ const FilterPage = () => {

{" "} {t("video", { defaultValue: "Video" })}  - {">"} {t("allVideo", { defaultValue: "All Video" })} + {">"}{" "} + + {t("allVideo", { defaultValue: "All Video" })} +

|

-

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableVideo", { defaultValue: "Downloadable Video" })}`}

+

{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t( + "downloadableVideo", + { defaultValue: "Downloadable Video" } + )}`}

{/* Left */} @@ -548,7 +554,9 @@ const FilterPage = () => { className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" onChange={(date) => setMonthYearFilter(date)} dateFormat="MM | yyyy" - placeholderText={t("selectYear", { defaultValue: "Select Year" })} + placeholderText={t("selectYear", { + defaultValue: "Select Year", + })} showMonthYearPicker />
@@ -566,7 +574,9 @@ const FilterPage = () => { onChange={(update) => { setDateRange(update); }} - placeholderText={t("selectDate", { defaultValue: "Select Date" })} + placeholderText={t("selectDate", { + defaultValue: "Select Date", + })} onCalendarClose={() => setCalenderState(!calenderState)} />
@@ -610,7 +620,7 @@ const FilterPage = () => { ))} - {/*
+
-
*/} +
{/* Garis */} @@ -769,14 +779,20 @@ const FilterPage = () => {
-

{t("sortBy", { defaultValue: "Sort By" })}

+

+ {t("sortBy", { defaultValue: "Sort By" })} +

diff --git a/components/landing-page/area-coverage-and-work-units.tsx b/components/landing-page/area-coverage-and-work-units.tsx index fa54a2e3..75bf2aca 100644 --- a/components/landing-page/area-coverage-and-work-units.tsx +++ b/components/landing-page/area-coverage-and-work-units.tsx @@ -15,6 +15,8 @@ import Coverage from "./coverage"; import Division from "./division"; import { useTranslations } from "next-intl"; import { useParams } from "next/navigation"; +import { useRouter } from "@/i18n/routing"; +import { Icon } from "../ui/icon"; const AreaCoverageWorkUnits = () => { const [openPolda, setOpenPolda] = useState(false); @@ -22,6 +24,16 @@ const AreaCoverageWorkUnits = () => { const t = useTranslations("LandingPage"); const params = useParams(); const locale = params?.locale; + const [search, setSearch] = useState(""); + const router = useRouter(); + const poldaName = params?.polda_name; + const satkerName = params?.satker_name; + + let prefixPath = poldaName + ? `/polda/${poldaName}` + : satkerName + ? `/satker/${satkerName}` + : ""; useEffect(() => { if (openPolda || openSatker) { @@ -42,9 +54,28 @@ const AreaCoverageWorkUnits = () => {

{t("areaCoverage", { defaultValue: "Area Coverage" })}

+ {/* search */} +
+ setSearch(e.target.value)} + /> + +
{/* POLDA */} - { > -

{t("regionalPolice", { defaultValue: "Regional Police" })}

+

+ {t("regionalPolice", { defaultValue: "Regional Police" })} +

@@ -89,7 +124,6 @@ const AreaCoverageWorkUnits = () => { {/* SATKER */} - -

{t("policeDivision", { defaultValue: "Police Division" })}

+

+ {t("policeDivision", { defaultValue: "Police Division" })} +

diff --git a/components/landing-page/filter-all/audio-filter-card.tsx b/components/landing-page/filter-all/audio-filter-card.tsx index 4ba73c4b..de5f39e6 100644 --- a/components/landing-page/filter-all/audio-filter-card.tsx +++ b/components/landing-page/filter-all/audio-filter-card.tsx @@ -8,7 +8,7 @@ import { } from "@/components/ui/carousel"; import { close, loading } from "@/config/swal"; import { Link, usePathname } from "@/i18n/routing"; -import { listData } from "@/service/landing/landing"; +import { listData, listDataRegional } from "@/service/landing/landing"; import { formatDateToIndonesian, getOnlyMonthAndYear } from "@/utils/globals"; import { Icon } from "@iconify/react/dist/iconify.js"; import { pages } from "next/dist/build/templates/app-page"; @@ -42,6 +42,50 @@ export default function FilterAudioComponent(props: { const categorie = searchParams?.get("category"); const group = searchParams?.get("group"); const [totalContent, setTotalContent] = useState(); + const isRegional = group || asPath.includes("/polda/"); + const searchType = isRegional ? "regional" : "filter"; + + useEffect(() => { + if (searchType === "regional") { + getDataRegional(); + } else { + getDataAll(); + } + }, [ + title, + categoryFilter, + categorie, + group, + startDateString, + endDateString, + monthYearFilter, + sortByOpt, + ]); + + async function getDataRegional() { + let startDateFilter = startDateString ? startDateString : ""; + let endDateFilter = endDateString ? endDateString : ""; + let monthFilter = monthYearFilter ? monthYearFilter : ""; + + const response = await listDataRegional( + "4", + "", + "", + "", + "", + startDateFilter, + endDateFilter, + monthFilter + ? getOnlyMonthAndYear(monthFilter)?.split("/")[0]?.replace("0", "") + : "", + monthFilter ? getOnlyMonthAndYear(monthFilter)?.split("/")[1] : "" + ); + const data = response?.data?.data; + const contentData = data?.content; + setNewContent(contentData); + setTotalData(data?.totalElements); + // setLoading(false); + } useEffect(() => { getDataAll(); @@ -137,7 +181,7 @@ export default function FilterAudioComponent(props: { return newContent?.length > 0 ? (
-

{`Audio(${totalContent})`}

+

{`Audio (${totalContent})`}

{newContent?.map((audio: any) => ( @@ -163,7 +207,7 @@ export default function FilterAudioComponent(props: {
-
+
{formatDateToIndonesian(new Date(audio?.createdAt))}{" "} {audio?.timezone ? audio?.timezone : "WIB"} |   @@ -181,6 +225,24 @@ export default function FilterAudioComponent(props: { +
+ + Lihat Semua + +
) : ( "" diff --git a/components/landing-page/filter-all/document-filter-card.tsx b/components/landing-page/filter-all/document-filter-card.tsx index 2794f11d..ef877a13 100644 --- a/components/landing-page/filter-all/document-filter-card.tsx +++ b/components/landing-page/filter-all/document-filter-card.tsx @@ -8,7 +8,7 @@ import { } from "@/components/ui/carousel"; import { close, loading } from "@/config/swal"; import { Link, usePathname } from "@/i18n/routing"; -import { listData } from "@/service/landing/landing"; +import { listData, listDataRegional } from "@/service/landing/landing"; import { formatDateToIndonesian, getOnlyMonthAndYear } from "@/utils/globals"; import { Icon } from "@iconify/react/dist/iconify.js"; import { pages } from "next/dist/build/templates/app-page"; @@ -43,8 +43,15 @@ export default function FilterDocumentComponent(props: { const group = searchParams?.get("group"); const [totalContent, setTotalContent] = useState(); + const isRegional = group || asPath.includes("/polda/"); + const searchType = isRegional ? "regional" : "filter"; + useEffect(() => { - getDataAll(); + if (searchType === "regional") { + getDataRegional(); + } else { + getDataAll(); + } }, [ title, categoryFilter, @@ -56,6 +63,31 @@ export default function FilterDocumentComponent(props: { sortByOpt, ]); + async function getDataRegional() { + let startDateFilter = startDateString ? startDateString : ""; + let endDateFilter = endDateString ? endDateString : ""; + let monthFilter = monthYearFilter ? monthYearFilter : ""; + + const response = await listDataRegional( + "3", + "", + "", + "", + "", + startDateFilter, + endDateFilter, + monthFilter + ? getOnlyMonthAndYear(monthFilter)?.split("/")[0]?.replace("0", "") + : "", + monthFilter ? getOnlyMonthAndYear(monthFilter)?.split("/")[1] : "" + ); + const data = response?.data?.data; + const contentData = data?.content; + setNewContent(contentData); + setTotalData(data?.totalElements); + // setLoading(false); + } + async function getDataAll() { if (asPath?.includes("/polda/") == true) { if (asPath?.split("/")[2] !== "[polda_name]") { @@ -137,7 +169,7 @@ export default function FilterDocumentComponent(props: { return newContent?.length > 0 ? (
-

{`Document(${totalContent})`}

+

{`Document (${totalContent})`}

{newContent?.map((text: any) => ( @@ -164,12 +196,12 @@ export default function FilterDocumentComponent(props: {
- {formatDateToIndonesian(new Date(text?.createdAt))} - {text?.timezone ? text?.timezone : "WIB"}| + {formatDateToIndonesian(new Date(text?.createdAt))}  + {text?.timezone ? text?.timezone : "WIB"} | {text?.clickCount}
-
+
{text?.title}
@@ -195,6 +227,22 @@ export default function FilterDocumentComponent(props: { +
+ + Lihat Semua + +
) : ( "" diff --git a/components/landing-page/filter-all/image-filter-card.tsx b/components/landing-page/filter-all/image-filter-card.tsx index 8346bfc3..5508b723 100644 --- a/components/landing-page/filter-all/image-filter-card.tsx +++ b/components/landing-page/filter-all/image-filter-card.tsx @@ -8,7 +8,7 @@ import { } from "@/components/ui/carousel"; import { close, loading } from "@/config/swal"; import { Link, usePathname } from "@/i18n/routing"; -import { listData } from "@/service/landing/landing"; +import { listData, listDataRegional } from "@/service/landing/landing"; import { formatDateToIndonesian, getOnlyMonthAndYear } from "@/utils/globals"; import { Icon } from "@iconify/react/dist/iconify.js"; import { pages } from "next/dist/build/templates/app-page"; @@ -42,8 +42,15 @@ export default function FilterImageComponent(props: { const group = searchParams?.get("group"); const [totalContent, setTotalContent] = useState(); + const isRegional = group || asPath.includes("/polda/"); + const searchType = isRegional ? "regional" : "filter"; + useEffect(() => { - getDataAll(); + if (searchType === "regional") { + getDataRegional(); + } else { + getDataAll(); + } }, [ title, categoryFilter, @@ -134,10 +141,48 @@ export default function FilterImageComponent(props: { } } + async function getDataRegional() { + let startDateFilter = startDateString ? startDateString : ""; + let endDateFilter = endDateString ? endDateString : ""; + let monthFilter = monthYearFilter ? monthYearFilter : ""; + + const response = await listDataRegional( + "1", + "", + "", + "", + "", + startDateFilter, + endDateFilter, + monthFilter + ? getOnlyMonthAndYear(monthFilter)?.split("/")[0]?.replace("0", "") + : "", + monthFilter ? getOnlyMonthAndYear(monthFilter)?.split("/")[1] : "" + ); + const data = response?.data?.data; + const contentData = data?.content; + setNewContent(contentData); + setTotalData(data?.totalElements); + // setLoading(false); + } + + const basePath = asPath.includes("/polda/") + ? `/${asPath.split("/")[1]}/${asPath.split("/")[2]}` + : ""; + + const type = group || asPath.includes("/polda/") ? "regional?" : "filter?"; + const sort = sortByOpt === "popular" ? "sortBy=popular" : "sortBy=latest"; + const titleParam = title ? `&title=${title?.toLowerCase()}` : ""; + const categoryParam = categorie ? `&category=${categorie}` : ""; + const fullQuery = `${type}${sort}${titleParam}${categoryParam}${ + startDateString ? `&startDate=${startDateString}` : "" + }${endDateString ? `&endDate=${endDateString}` : ""}`; + const href = `${basePath}/image/${fullQuery}`; + return newContent?.length > 0 ? (
-

{`Foto(${totalContent})`}

- +

{`Foto (${totalContent})`}

+ {newContent?.map((image: any) => ( @@ -167,6 +212,14 @@ export default function FilterImageComponent(props: { +
+ + Lihat Semua + +
) : ( "" diff --git a/components/landing-page/filter-all/video-filter-card.tsx b/components/landing-page/filter-all/video-filter-card.tsx index 4b87dcf0..25d31447 100644 --- a/components/landing-page/filter-all/video-filter-card.tsx +++ b/components/landing-page/filter-all/video-filter-card.tsx @@ -8,7 +8,7 @@ import { } from "@/components/ui/carousel"; import { close, loading } from "@/config/swal"; import { Link, usePathname } from "@/i18n/routing"; -import { listData } from "@/service/landing/landing"; +import { listData, listDataRegional } from "@/service/landing/landing"; import { formatDateToIndonesian, getOnlyMonthAndYear } from "@/utils/globals"; import { Icon } from "@iconify/react/dist/iconify.js"; import { pages } from "next/dist/build/templates/app-page"; @@ -43,8 +43,15 @@ export default function FilterVideoComponent(props: { const group = searchParams?.get("group"); const [totalContent, setTotalContent] = useState(); + const isRegional = group || asPath.includes("/polda/"); + const searchType = isRegional ? "regional" : "filter"; + useEffect(() => { - getDataAll(); + if (searchType === "regional") { + getDataRegional(); + } else { + getDataAll(); + } }, [ title, categoryFilter, @@ -56,6 +63,31 @@ export default function FilterVideoComponent(props: { sortByOpt, ]); + async function getDataRegional() { + let startDateFilter = startDateString ? startDateString : ""; + let endDateFilter = endDateString ? endDateString : ""; + let monthFilter = monthYearFilter ? monthYearFilter : ""; + + const response = await listDataRegional( + "2", + "", + "", + "", + "", + startDateFilter, + endDateFilter, + monthFilter + ? getOnlyMonthAndYear(monthFilter)?.split("/")[0]?.replace("0", "") + : "", + monthFilter ? getOnlyMonthAndYear(monthFilter)?.split("/")[1] : "" + ); + const data = response?.data?.data; + const contentData = data?.content; + setNewContent(contentData); + setTotalData(data?.totalElements); + // setLoading(false); + } + async function getDataAll() { if (asPath?.includes("/polda/") == true) { if (asPath?.split("/")[2] !== "[polda_name]") { @@ -137,7 +169,7 @@ export default function FilterVideoComponent(props: { return newContent?.length > 0 ? (
-

{`Audio Visual(${totalContent})`}

+

{`Audio Visual (${totalContent})`}

{newContent?.map((video: any) => ( @@ -168,6 +200,32 @@ export default function FilterVideoComponent(props: { +
+ + Lihat Semua + +
) : ( "" diff --git a/components/landing-page/search-section-new.tsx b/components/landing-page/search-section-new.tsx index 8e0540f7..bc9db78b 100644 --- a/components/landing-page/search-section-new.tsx +++ b/components/landing-page/search-section-new.tsx @@ -86,7 +86,7 @@ const ScrollableContent = () => {  {t("download", { defaultValue: "Download" })}  {t("coverage", { defaultValue: "Coverage" })} - {" "} +
diff --git a/components/landing-page/search-section.tsx b/components/landing-page/search-section.tsx index ee26e1e7..c69c14dc 100644 --- a/components/landing-page/search-section.tsx +++ b/components/landing-page/search-section.tsx @@ -27,7 +27,6 @@ const SearchSection = () => { const t = useTranslations("LandingPage"); const { theme } = useTheme(); - // Determine background image based on theme const getBackgroundImage = () => { if (theme === "dark") { return "url('/assets/background-dark.jpg')";