From 0d159741175b42eb82e9ea4b3149c366bc1a6435 Mon Sep 17 00:00:00 2001 From: Sabda Yagra Date: Sat, 13 Sep 2025 13:08:26 +0700 Subject: [PATCH] fixing detail video in polda --- .../giat-routine/video/detail/[id]/page.tsx | 2 +- .../[polda_name]/video/detail/[slug]/page.tsx | 928 +++++++++--------- 2 files changed, 467 insertions(+), 463 deletions(-) diff --git a/app/[locale]/(protected)/shared/curated-content/giat-routine/video/detail/[id]/page.tsx b/app/[locale]/(protected)/shared/curated-content/giat-routine/video/detail/[id]/page.tsx index 871c2268..a04a4f76 100644 --- a/app/[locale]/(protected)/shared/curated-content/giat-routine/video/detail/[id]/page.tsx +++ b/app/[locale]/(protected)/shared/curated-content/giat-routine/video/detail/[id]/page.tsx @@ -473,7 +473,7 @@ export default function DetailImage() { className="object-fill h-full w-full rounded-md" src={data.url} controls - title={`Video ${data.id}`} // Mengganti alt dengan title + title={`Video ${data.id}`} /> ))} 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 d20cd981..47ef7e70 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 @@ -1,476 +1,480 @@ -// "use client"; +"use client"; -// import { useParams, usePathname } from "next/navigation"; -// import React, { useEffect, useState } from "react"; -// import { Icon } from "@iconify/react/dist/iconify.js"; -// import { -// checkWishlistStatus, -// deleteWishlist, -// getDetail, -// saveWishlist, -// } from "@/service/landing/landing"; -// import VideoPlayer from "@/utils/video-player"; -// import NewContent from "@/components/landing-page/new-content"; -// import { Link, useRouter } from "@/i18n/routing"; -// import { Textarea } from "@/components/ui/textarea"; -// import { getCookiesDecrypt } from "@/lib/utils"; -// import { close, error, loading } from "@/config/swal"; -// import { useToast } from "@/components/ui/use-toast"; -// import { postActivityLog } from "@/service/content/content"; - -// const DetailVideo = () => { -// const [selectedSize, setSelectedSize] = useState("L"); -// const [selectedTab, setSelectedTab] = useState("video"); -// const router = useRouter(); -// const pathname = usePathname(); -// const params = useParams(); -// const slug = String(params?.slug); -// const [detailDataVideo, setDetailDataVideo] = useState(); -// const [isSaved, setIsSaved] = useState(false); -// const [wishlistId, setWishlistId] = useState(); -// const { toast } = useToast(); -// const [isDownloadAll, setIsDownloadAll] = useState(false); -// const [downloadProgress, setDownloadProgress] = useState(0); -// const [isFromSPIT, setIsFromSPIT] = useState(false); -// const [main, setMain] = useState(); -// const [resolutionSelected, setResolutionSelected] = useState("720"); -// const [selectedVideo, setSelectedVideo] = useState(0); - -// const userId = getCookiesDecrypt("uie"); - -// useEffect(() => { -// initFetch(); -// checkWishlist(); -// sendActivityLog(2); -// }, []); - -// const initFetch = async () => { -// const response = await getDetail(String(slug)); -// console.log("detailVideo", response); -// setIsFromSPIT(response?.data?.data?.isFromSPIT); -// setMain({ -// id: response?.data?.data?.files[0]?.id, -// type: response?.data?.data?.fileType.name, -// url: -// Number(response?.data?.data?.fileType?.id) == 4 -// ? response?.data?.data?.files[0]?.secondaryUrl -// : Number(response?.data?.data?.fileType?.id) == 2 -// ? `${process.env.NEXT_PUBLIC_API}/media/view?id=${response?.data?.data?.files[0]?.id}&operation=file&type=video` -// : response?.data?.data?.files[0]?.url, -// thumbnailFileUrl: response?.data?.data?.files[0]?.thumbnailFileUrl, -// names: response?.data?.data?.files[0]?.fileName, -// format: response?.data?.data?.files[0]?.format, -// widthPixel: response?.data?.data?.files[0]?.widthPixel, -// heightPixel: response?.data?.data?.files[0]?.heightPixel, -// size: response?.data?.data?.files[0]?.size, -// caption: response?.data?.data?.files[0]?.caption, -// }); -// setDetailDataVideo(response?.data?.data); -// }; - -// const doBookmark = async () => { -// if (userId) { -// const data = { -// mediaUploadId: slug?.split("-")?.[0], -// }; - -// loading(); -// const res = await saveWishlist(data); -// if (res?.error) { -// error(res.message); -// return false; -// } -// close(); -// toast({ -// title: "Konten berhasil disimpan", -// }); -// checkWishlist(); -// } else { -// router.push("/auth"); -// } -// }; -// async function checkWishlist() { -// if (userId) { -// const res = await checkWishlistStatus(slug.split("-")?.[0]); -// console.log(res?.data?.data); -// const isAlreadyOnWishlist = res?.data?.data !== "-1"; -// setWishlistId(res?.data?.data); -// setIsSaved(isAlreadyOnWishlist); -// } -// } - -// const handleDeleteWishlist = async () => { -// if (userId) { -// loading(); -// const res = await deleteWishlist(wishlistId); - -// if (res?.error) { -// error(res.message); -// return false; -// } - -// toast({ -// title: "Konten berhasil dihapus", -// }); -// close(); -// checkWishlist(); -// } else { -// router.push("/auth"); -// } -// }; - -// const sizes = [ -// { label: "XL", value: "3198 x 1798 px" }, -// { label: "L", value: "2399 x 1349 px" }, -// { label: "M", value: "1599 x 899 px" }, -// { label: "S", value: "1066 x 599 px" }, -// { label: "XS", value: "800 x 450 px" }, -// ]; - -// async function sendActivityLog(activityTypeId: number) { -// const data = { -// activityTypeId, -// mediaId: slug.split("-")?.[0], -// url: window.location.href, -// }; -// // set activity -// await postActivityLog(data); -// } - -// const handleDownload = () => { -// if (downloadProgress === 0) { -// if (!userId) { -// router.push("/auth"); -// } else { -// sendActivityLog(2); -// sendActivityLog(3); - -// if (isDownloadAll) { -// let url: string; -// const baseId = slug.split("-")?.[0]; - -// // if (type === "1") { -// url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}&resolution=${resolutionSelected}`; -// // } else if (type === "2") { -// // url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}&resolution=${imageSizeSelected}`; -// // } else { -// // url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}`; -// // } - -// downloadFile(url, "FileDownload.zip"); -// } else { -// if (isFromSPIT && main?.url?.includes("spit.humas")) { -// downloadFile(`${main?.url}`, `${main.names}`); -// } else { -// const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=video&resolution=${resolutionSelected}p`; -// downloadFile(url, `${main.names}`); -// } -// } -// // } else if (type === "1" && resolutionSelected?.length > 0) { -// // if (isFromSPIT && main?.url?.includes("spit.humas")) { -// // downloadFile(`${main?.url}`, `${main.names}`); -// // } else { -// // const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=video&resolution=${resolutionSelected}p`; -// // downloadFile(url, `${main.names}`); -// // } -// // } else if (type === "2" && imageSizeSelected?.length > 0) { -// // const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=image&resolution=${imageSizeSelected}`; -// // downloadFile(url, `${main.names}`); -// // } else if (type === "3" || type === "4") { -// // downloadFile(`${main?.url}`, `${main.names}`); -// // } -// } -// } -// }; - -// const downloadFile = (fileUrl: string, name: string) => { -// const xhr = new XMLHttpRequest(); - -// xhr.open("GET", fileUrl, true); -// xhr.responseType = "blob"; - -// xhr.addEventListener("progress", (event) => { -// if (event.lengthComputable) { -// const percentCompleted = Math.round((event.loaded / event.total) * 100); -// setDownloadProgress(percentCompleted); -// } -// }); - -// xhr.addEventListener("readystatechange", () => { -// if (xhr.readyState === 4 && xhr.status === 200) { -// const contentType = -// xhr.getResponseHeader("content-type") || "application/octet-stream"; -// const extension = contentType.split("/")[1]; -// const filename = `${name}.${extension}`; - -// const blob = new Blob([xhr.response], { -// type: contentType, -// }); -// const downloadUrl = URL.createObjectURL(blob); -// const a = document.createElement("a"); - -// a.href = downloadUrl; -// a.download = filename; -// document.body.append(a); -// a.click(); -// a.remove(); -// } -// }); - -// xhr.onloadend = () => { -// setDownloadProgress(0); -// }; - -// xhr.send(); -// }; - -// return ( -// <> -//
-// {/* Container Utama */} -//
-// {/* Bagian Kiri */} -//
-// {/*
-// -//
-//
*/} -//
-//
-//
-// -//
-//
-//
-//
- -//
-// {detailDataVideo?.files?.map((file: any, index: number) => ( -//
setSelectedVideo(index)} -// className="cursor-pointer flex flex-col items-center gap-1" -// > -// {file?.fileName} -// {/*

{file?.fileName}

*/} -//
-// ))} -//
- -// {/* Footer Informasi */} -//
-//

-// oleh  -// -// {detailDataVideo?.uploadedBy?.userLevel?.name} -// -//  | Diupdate pada {detailDataVideo?.updatedAt}{" "} -// WIB |  -// -//   -// {detailDataVideo?.clickCount} -//

-//

Kreator: {detailDataVideo?.creatorName}

-//
- -// {/* Keterangan */} -//
-//

-// {detailDataVideo?.title} -//

-//
-//
-//
- -// {/* Bagian Kanan */} -//
-// {isSaved ? ( -// handleDeleteWishlist()} -// className="flex flex-col mb-3 items-center justify-center cursor-pointer" -// > -// -//

Hapus

-// -// ) : ( -// doBookmark()} -// className="flex flex-col mb-3 items-center justify-center cursor-pointer" -// > -// -//

Simpan

-// -// )} - -// {/* garis */} -//
- -// -// {detailDataVideo?.categoryName} -// - -// - -//
- -// {/* Opsi Ukuran Foto */} -//

-// Opsi Ukuran Audio Visual -//

- -//
- -//
-// {sizes.map((size: any) => ( -//
-//
-// setSelectedSize(size.label)} -// className="text-red-600 focus:ring-red-600" -// /> -//
{size.label}
-//
-//
-//
{size.value}
-//
-//
-// ))} -//
- -// {/* Download Semua */} -//
-// -//
- -// {/* Tombol Download */} -// -//
-//
-//
-//
-// {/* Comment */} -//
-//
-//

Berikan Komentar

-//