mediahub
/
mediahub-fe
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: eng language

This commit is contained in:
sabdayagra 2025-02-04 13:30:30 +07:00
parent af7d4a5e1d
commit 2e03a6ecdc
7 changed files with 115 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
app/[locale]/(public)/audio/detail/[slug]/page.tsx
View File

@ -20,6 +20,7 @@ import Swal from "sweetalert2";
import { checkMaliciousText, getPublicLocaleTimestamp } from "@/utils/globals"; import { checkMaliciousText, getPublicLocaleTimestamp } from "@/utils/globals";
import parse from "html-react-parser"; import parse from "html-react-parser";
import $ from "jquery"; import $ from "jquery";
import { useTranslations } from "next-intl";
const formWaveSurferOptions = (ref: any) => ({ const formWaveSurferOptions = (ref: any) => ({
container: ref, container: ref,
@ -66,6 +67,8 @@ const DetailAudio = () => {
const [listSuggestion, setListSuggestion] = useState<any>(); const [listSuggestion, setListSuggestion] = useState<any>();
const MySwal = withReactContent(Swal); const MySwal = withReactContent(Swal);
const [visibleInput, setVisibleInput] = useState<string | null>(null); const [visibleInput, setVisibleInput] = useState<string | null>(null);
const t = useTranslations("LandingPage");
let typeString = "audio"; let typeString = "audio";
useEffect(() => { useEffect(() => {
@ -250,11 +253,8 @@ const DetailAudio = () => {
}; };
const sizes = [ const sizes = [
{ label: "XL", value: "3198 x 1798 px" }, { label: "MP3", value: "... MB" },
{ label: "L", value: "2399 x 1349 px" }, { label: "WAV", value: "... MB" },
{ label: "M", value: "1599 x 899 px" },
{ label: "S", value: "1066 x 599 px" },
{ label: "XS", value: "800 x 450 px" },
]; ];
const handleShare = (type: any, url: any) => { const handleShare = (type: any, url: any) => {
@ -592,16 +592,20 @@ const DetailAudio = () => {
<div className="text-gray-500 flex flex-col lg:flex-row justify-between items-center border-t mt-4"> <div className="text-gray-500 flex flex-col lg:flex-row justify-between items-center border-t mt-4">
<div className="flex flex-col lg:flex-row items-center mt-3 lg:justify-between"> <div className="flex flex-col lg:flex-row items-center mt-3 lg:justify-between">
<p className="text-xs lg:text-sm"> <p className="text-xs lg:text-sm">
oleh&nbsp;<span className="font-semibold text-black">{detailDataAudio?.uploadedBy?.userLevel?.name}</span> {t("by")}&nbsp;<span className="font-semibold text-black">{detailDataAudio?.uploadedBy?.userLevel?.name}</span>
</p>
<p className="text-xs lg:text-sm">
&nbsp;|&nbsp;{t("updatedOn")} {detailDataAudio?.updatedAt} WIB &nbsp;|&nbsp;
</p> </p>
<p className="text-xs lg:text-sm">&nbsp;|&nbsp;Diupdate pada {detailDataAudio?.updatedAt} WIB &nbsp;|&nbsp;</p>
<p className="text-xs lg:text-sm flex justify-center items-center"> <p className="text-xs lg:text-sm flex justify-center items-center">
<Icon icon="formkit:eye" width="15" height="15" /> <Icon icon="formkit:eye" width="15" height="15" />
&nbsp; {detailDataAudio?.clickCount} &nbsp; &nbsp; {detailDataAudio?.clickCount} &nbsp;
</p> </p>
</div> </div>
<div className="mt-3"> <div className="mt-3">
<p className="flex text-end text-xs lg:text-sm font-semibold">Kreator: {detailDataAudio?.creatorName}</p> <p className="flex text-end text-xs lg:text-sm font-semibold">
{t("creator")} {detailDataAudio?.creatorName}
</p>
</div> </div>
</div> </div>
{/* Keterangan */} {/* Keterangan */}
@ -616,12 +620,12 @@ const DetailAudio = () => {
{isSaved ? ( {isSaved ? (
<a onClick={() => handleDeleteWishlist()} className="flex flex-col mb-3 items-center justify-center cursor-pointer"> <a onClick={() => handleDeleteWishlist()} className="flex flex-col mb-3 items-center justify-center cursor-pointer">
<Icon icon="material-symbols:bookmark" width={40} /> <Icon icon="material-symbols:bookmark" width={40} />
<p className="text-base lg:text-lg">Hapus</p> <p className="text-base lg:text-lg">{t("delete")}</p>
</a> </a>
) : ( ) : (
<a onClick={() => doBookmark()} className="flex flex-col mb-3 items-center justify-center cursor-pointer"> <a onClick={() => doBookmark()} className="flex flex-col mb-3 items-center justify-center cursor-pointer">
<Icon icon="material-symbols:bookmark-outline" width={40} /> <Icon icon="material-symbols:bookmark-outline" width={40} />
<p className="text-base lg:text-lg">Simpan</p> <p className="text-base lg:text-lg">{t("save")}</p>
</a> </a>
)} )}
@ -643,7 +647,7 @@ const DetailAudio = () => {
<div className="border-t border-black my-4"></div> <div className="border-t border-black my-4"></div>
{/* Opsi Ukuran Foto */} {/* Opsi Ukuran Foto */}
<h4 className="flex text-lg justify-center items-center font-semibold my-3">Opsi Ukuran Audio</h4> <h4 className="flex text-lg justify-center items-center font-semibold my-3">{t("audioSize")}</h4>
<div className="border-t border-black my-4"></div> <div className="border-t border-black my-4"></div>
@ -665,7 +669,7 @@ const DetailAudio = () => {
<div className="mt-4"> <div className="mt-4">
<label className="flex items-center space-x-2 text-sm"> <label className="flex items-center space-x-2 text-sm">
<input type="checkbox" className="text-red-600 focus:ring-red-600" onChange={() => setIsDownloadAll(!isDownloadAll)} /> <input type="checkbox" className="text-red-600 focus:ring-red-600" onChange={() => setIsDownloadAll(!isDownloadAll)} />
<span>Download Semua File?</span> <span>{t("downloadAll")}</span>
</label> </label>
</div> </div>
@ -674,12 +678,12 @@ const DetailAudio = () => {
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24">
<path fill="white" d="m12 16l-5-5l1.4-1.45l2.6 2.6V4h2v8.15l2.6-2.6L17 11zm-6 4q-.825 0-1.412-.587T4 18v-3h2v3h12v-3h2v3q0 .825-.587 1.413T18 20z" /> <path fill="white" d="m12 16l-5-5l1.4-1.45l2.6 2.6V4h2v8.15l2.6-2.6L17 11zm-6 4q-.825 0-1.412-.587T4 18v-3h2v3h12v-3h2v3q0 .825-.587 1.413T18 20z" />
</svg> </svg>
Download {t("download")}
</button> </button>
{/* Tombol Bagikan */} {/* Tombol Bagikan */}
<div className="flex flex-row py-3"> <div className="flex flex-row py-3">
<p className="text-base font-semibold">Bagikan</p> <p className="text-base font-semibold">{t("share")}</p>
<a className="ml-8 cursor-pointer" onClick={() => handleShare("fb", `https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fmediahub.polri.go.id%2F${typeString}%2Fdetail%2F${content?.id}&quote=${content?.title}`)}> <a className="ml-8 cursor-pointer" onClick={() => handleShare("fb", `https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fmediahub.polri.go.id%2F${typeString}%2Fdetail%2F${content?.id}&quote=${content?.title}`)}>
<Icon icon="brandico:facebook" height="20" className="px-auto text-red-600 text-center" /> <Icon icon="brandico:facebook" height="20" className="px-auto text-red-600 text-center" />
</a> </a>
@ -697,13 +701,13 @@ const DetailAudio = () => {
</PopoverTrigger> </PopoverTrigger>
<PopoverContent> <PopoverContent>
<div className="flex flex-col"> <div className="flex flex-col">
<h1 className="mb-2">Share Ke Email</h1> <h1 className="mb-2">{t("shareTo")}</h1>
<div className="flex flex-col mb-2"> <div className="flex flex-col mb-2">
<p className="text-base font-semibold mb-1">Email Tujuan :</p> <p className="text-base font-semibold mb-1">{t("destinationEmail")}</p>
<Input value={emailShareInput} onChange={(event) => setEmailShareInput(event.target.value)} onKeyPress={handleEmailList} type="email" placeholder="Tekan Enter untuk input Email" /> <Input value={emailShareInput} onChange={(event) => setEmailShareInput(event.target.value)} onKeyPress={handleEmailList} type="email" placeholder={t("pressEnter")} />
</div> </div>
<Button className="bg-blue-500 text-white p-2 w-fit rounded-lg" onClick={() => shareToEmail()}> <Button className="bg-blue-500 text-white p-2 w-fit rounded-lg" onClick={() => shareToEmail()}>
Kirim {t("send")}
</Button> </Button>
</div> </div>
</PopoverContent> </PopoverContent>
@ -717,10 +721,10 @@ const DetailAudio = () => {
{/* Comment */} {/* Comment */}
<div className="flex flex-col my-16 p-4 lg:p-10 bg-[#f7f7f7]"> <div className="flex flex-col my-16 p-4 lg:p-10 bg-[#f7f7f7]">
<div className="gap-5 flex flex-col px-4 lg:px-14"> <div className="gap-5 flex flex-col px-4 lg:px-14">
<p className="flex items-start text-lg">Berikan Komentar</p> <p className="flex items-start text-lg">{t("comment")}</p>
<Textarea placeholder="Type your comments here." className="flex w-full pb-12" onChange={getInputValue} /> <Textarea placeholder="Type your comments here." className="flex w-full pb-12" onChange={getInputValue} />
<button onClick={() => postData()} className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-4 py-1"> <button onClick={() => postData()} className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-4 py-1">
Kirim {t("send")}
</button> </button>
</div> </div>
@ -749,11 +753,11 @@ const DetailAudio = () => {
onClick={() => showInput(`comment-id-${data.id}`)} onClick={() => showInput(`comment-id-${data.id}`)}
className="mr-2" className="mr-2"
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Balas</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("reply")}</small>
</a> </a>
{Number(data.suggestionFrom?.id) == Number(userId) || Number(userRoleId) == 2 ? ( {Number(data.suggestionFrom?.id) == Number(userId) || Number(userRoleId) == 2 ? (
<a onClick={() => deleteData(data.id)}> <a onClick={() => deleteData(data.id)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Hapus</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("delete")}</small>
</a> </a>
) : ( ) : (
"" ""
@ -763,13 +767,13 @@ const DetailAudio = () => {
</div> </div>
{visibleInput === `comment-id-${data.id}` && ( {visibleInput === `comment-id-${data.id}` && (
<div id={`comment-id-${data.id}`} className="px-4 pl-[72px] lg:px-14 lg:pl-32 mt-2 "> <div id={`comment-id-${data.id}`} className="px-4 pl-[72px] lg:px-14 lg:pl-32 mt-2 ">
<Textarea id={`input-comment-${data.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder="Masukkan balasan anda" /> <Textarea id={`input-comment-${data.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder={t("enterReply")} />
<div className="flex flex-row gap-3"> <div className="flex flex-row gap-3">
<a onClick={() => postDataChild(data.id)}> <a onClick={() => postDataChild(data.id)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 mt-2 cursor-pointer">Kirim</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 mt-2 cursor-pointer">{t("send")}</small>
</a> </a>
<a onClick={() => showInput(`comment-id-${data.id}`)}> <a onClick={() => showInput(`comment-id-${data.id}`)}>
<small className="flex items-start bg-[#bb3523] rounded-lg mt-2 w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Batal</small> <small className="flex items-start bg-[#bb3523] rounded-lg mt-2 w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("cancel")}</small>
</a> </a>
</div> </div>
</div> </div>
@ -798,7 +802,7 @@ const DetailAudio = () => {
} }
onClick={() => showInput(`comment-id-${child1.id}`)} onClick={() => showInput(`comment-id-${child1.id}`)}
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Balas</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("reply")}</small>
</a> </a>
<a <a
style={ style={
@ -810,7 +814,7 @@ const DetailAudio = () => {
} }
onClick={() => deleteData(child1.id)} onClick={() => deleteData(child1.id)}
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Hapus</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("delete")}</small>
</a> </a>
</div> </div>
</div> </div>
@ -818,13 +822,13 @@ const DetailAudio = () => {
{visibleInput === `comment-id-${child1.id}` && ( {visibleInput === `comment-id-${child1.id}` && (
<div id={`comment-id-${child1.id}`} className="px-4 lg:px-14 pl-28 lg:pl-[200px]"> <div id={`comment-id-${child1.id}`} className="px-4 lg:px-14 pl-28 lg:pl-[200px]">
<Textarea name="" className="mt-2 " id={`input-comment-${child1.id}`} placeholder="Masukkan balasan anda" /> <Textarea name="" className="mt-2 " id={`input-comment-${child1.id}`} placeholder={t("enterReply")} />
<div className="flex flex-row mt-2 gap-3"> <div className="flex flex-row mt-2 gap-3">
<a onClick={() => postDataChild(child1.id)}> <a onClick={() => postDataChild(child1.id)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Kirim</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("send")}</small>
</a> </a>
<a onClick={() => showInput(`comment-id-${child1.id}`)}> <a onClick={() => showInput(`comment-id-${child1.id}`)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Batal</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("cancel")}</small>
</a> </a>
</div> </div>
</div> </div>
@ -853,7 +857,7 @@ const DetailAudio = () => {
} }
onClick={() => showInput(`comment-id-${child2.id}`)} onClick={() => showInput(`comment-id-${child2.id}`)}
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Balas</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("reply")}</small>
</a> </a>
<a <a
style={ style={
@ -865,7 +869,7 @@ const DetailAudio = () => {
} }
onClick={() => deleteData(child2.id)} onClick={() => deleteData(child2.id)}
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Hapus</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("delete")}</small>
</a> </a>
</div> </div>
</div> </div>
@ -875,10 +879,10 @@ const DetailAudio = () => {
<Textarea name="" id={`input-comment-${child2.id}`} className="my-2" placeholder="Masukkan balasan anda" /> <Textarea name="" id={`input-comment-${child2.id}`} className="my-2" placeholder="Masukkan balasan anda" />
<div className="flex flex-row gap-3"> <div className="flex flex-row gap-3">
<a onClick={() => postDataChild(child2.id)}> <a onClick={() => postDataChild(child2.id)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Kirim</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("send")}</small>
</a> </a>
<a onClick={() => showInput(`comment-id-${child2.id}`)}> <a onClick={() => showInput(`comment-id-${child2.id}`)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Batal</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("cancel")}</small>
</a> </a>
</div> </div>
</div> </div>

76
app/[locale]/(public)/document/detail/[slug]/page.tsx
View File

@ -18,6 +18,7 @@ import { checkMaliciousText, getPublicLocaleTimestamp } from "@/utils/globals";
import withReactContent from "sweetalert2-react-content"; import withReactContent from "sweetalert2-react-content";
import Swal from "sweetalert2"; import Swal from "sweetalert2";
import parse from "html-react-parser"; import parse from "html-react-parser";
import { useTranslations } from "next-intl";
const DetailDocument = () => { const DetailDocument = () => {
const [selectedSize, setSelectedSize] = useState<string>("L"); const [selectedSize, setSelectedSize] = useState<string>("L");
@ -50,6 +51,7 @@ const DetailDocument = () => {
const [listSuggestion, setListSuggestion] = useState<any>(); const [listSuggestion, setListSuggestion] = useState<any>();
const MySwal = withReactContent(Swal); const MySwal = withReactContent(Swal);
const [visibleInput, setVisibleInput] = useState<string | null>(null); const [visibleInput, setVisibleInput] = useState<string | null>(null);
const t = useTranslations("LandingPage");
let typeString = "document"; let typeString = "document";
@ -139,11 +141,9 @@ const DetailDocument = () => {
}; };
const sizes = [ const sizes = [
{ label: "XL", value: "3198 x 1798 px" }, { label: "DOC", value: "...KB" },
{ label: "L", value: "2399 x 1349 px" }, { label: "PPT", value: "...KB" },
{ label: "M", value: "1599 x 899 px" }, { label: "PDF", value: "...KB" },
{ label: "S", value: "1066 x 599 px" },
{ label: "XS", value: "800 x 450 px" },
]; ];
async function sendActivityLog(activityTypeId: number) { async function sendActivityLog(activityTypeId: number) {
@ -433,14 +433,22 @@ const DetailDocument = () => {
<p className="mt-3">Kreator: {detailDataDocument?.creatorName}</p> */} <p className="mt-3">Kreator: {detailDataDocument?.creatorName}</p> */}
<div className="flex flex-col lg:flex-row items-center mt-3 lg:justify-between"> <div className="flex flex-col lg:flex-row items-center mt-3 lg:justify-between">
<p className="text-xs lg:text-sm"> <p className="text-xs lg:text-sm">
oleh&nbsp;<span className="font-semibold text-black">{detailDataDocument?.uploadedBy?.userLevel?.name}</span> {t("by")}&nbsp;<span className="font-semibold text-black">{detailDataDocument?.uploadedBy?.userLevel?.name}</span>
</p>
<p className="text-xs lg:text-sm">
&nbsp;|&nbsp; {t("updatedOn")} {detailDataDocument?.updatedAt} WIB &nbsp;|&nbsp;
</p> </p>
<p className="text-xs lg:text-sm">&nbsp;|&nbsp;Diupdate pada {detailDataDocument?.updatedAt} WIB &nbsp;|&nbsp;</p>
<p className="text-xs lg:text-sm flex justify-center items-center"> <p className="text-xs lg:text-sm flex justify-center items-center">
<Icon icon="formkit:eye" width="15" height="15" /> <Icon icon="formkit:eye" width="15" height="15" />
&nbsp; {detailDataDocument?.clickCount} &nbsp; &nbsp; {detailDataDocument?.clickCount} &nbsp;
</p> </p>
</div> </div>
<div className="mt-3">
<p className="flex text-end text-xs lg:text-sm font-semibold">
{t("creator")}
{detailDataDocument?.creatorName}
</p>
</div>
</div> </div>
{/* Keterangan */} {/* Keterangan */}
@ -455,12 +463,12 @@ const DetailDocument = () => {
{isSaved ? ( {isSaved ? (
<a onClick={() => handleDeleteWishlist()} className="flex flex-col mb-3 items-center justify-center cursor-pointer"> <a onClick={() => handleDeleteWishlist()} className="flex flex-col mb-3 items-center justify-center cursor-pointer">
<Icon icon="material-symbols:bookmark" width={40} /> <Icon icon="material-symbols:bookmark" width={40} />
<p className="text-base lg:text-lg">Hapus</p> <p className="text-base lg:text-lg">{t("delete")}</p>
</a> </a>
) : ( ) : (
<a onClick={() => doBookmark()} className="flex flex-col mb-3 items-center justify-center cursor-pointer"> <a onClick={() => doBookmark()} className="flex flex-col mb-3 items-center justify-center cursor-pointer">
<Icon icon="material-symbols:bookmark-outline" width={40} /> <Icon icon="material-symbols:bookmark-outline" width={40} />
<p className="text-base lg:text-lg">Simpan</p> <p className="text-base lg:text-lg">{t("save")}</p>
</a> </a>
)} )}
@ -482,7 +490,7 @@ const DetailDocument = () => {
<div className="border-t border-black my-4"></div> <div className="border-t border-black my-4"></div>
{/* Opsi Ukuran Foto */} {/* Opsi Ukuran Foto */}
<h4 className="flex text-lg justify-center items-center font-semibold my-3">Opsi Ukuran Foto</h4> <h4 className="flex text-lg justify-center items-center font-semibold my-3">{t("docSize")}</h4>
<div className="border-t border-black my-4"></div> <div className="border-t border-black my-4"></div>
<div className="space-y-2"> <div className="space-y-2">
{sizes.map((size: any) => ( {sizes.map((size: any) => (
@ -502,7 +510,7 @@ const DetailDocument = () => {
<div className="mt-4"> <div className="mt-4">
<label className="flex items-center space-x-2 text-sm"> <label className="flex items-center space-x-2 text-sm">
<input type="checkbox" className="text-red-600 focus:ring-red-600" onChange={() => setIsDownloadAll(!isDownloadAll)} /> <input type="checkbox" className="text-red-600 focus:ring-red-600" onChange={() => setIsDownloadAll(!isDownloadAll)} />
<span>Download Semua File?</span> <span>{t("downloadAll")}</span>
</label> </label>
</div> </div>
@ -511,12 +519,12 @@ const DetailDocument = () => {
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24">
<path fill="white" d="m12 16l-5-5l1.4-1.45l2.6 2.6V4h2v8.15l2.6-2.6L17 11zm-6 4q-.825 0-1.412-.587T4 18v-3h2v3h12v-3h2v3q0 .825-.587 1.413T18 20z" /> <path fill="white" d="m12 16l-5-5l1.4-1.45l2.6 2.6V4h2v8.15l2.6-2.6L17 11zm-6 4q-.825 0-1.412-.587T4 18v-3h2v3h12v-3h2v3q0 .825-.587 1.413T18 20z" />
</svg> </svg>
Download {t("download")}
</button> </button>
{/* Tombol Bagikan */} {/* Tombol Bagikan */}
<div className="flex flex-row py-3"> <div className="flex flex-row py-3">
<p className="text-base font-semibold">Bagikan</p> <p className="text-base font-semibold">{t("share")}</p>
<a className="ml-8 cursor-pointer" onClick={() => handleShare("fb", `https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fmediahub.polri.go.id%2F${typeString}%2Fdetail%2F${content?.id}&quote=${content?.title}`)}> <a className="ml-8 cursor-pointer" onClick={() => handleShare("fb", `https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fmediahub.polri.go.id%2F${typeString}%2Fdetail%2F${content?.id}&quote=${content?.title}`)}>
<Icon icon="brandico:facebook" height="20" className="px-auto text-red-600 text-center" /> <Icon icon="brandico:facebook" height="20" className="px-auto text-red-600 text-center" />
</a> </a>
@ -534,13 +542,13 @@ const DetailDocument = () => {
</PopoverTrigger> </PopoverTrigger>
<PopoverContent> <PopoverContent>
<div className="flex flex-col"> <div className="flex flex-col">
<h1 className="mb-2">Share Ke Email</h1> <h1 className="mb-2">{t("shareTo")}</h1>
<div className="flex flex-col mb-2"> <div className="flex flex-col mb-2">
<p className="text-base font-semibold mb-1">Email Tujuan :</p> <p className="text-base font-semibold mb-1">{t("destinationEmail")}</p>
<Input value={emailShareInput} onChange={(event) => setEmailShareInput(event.target.value)} onKeyPress={handleEmailList} type="email" placeholder="Tekan Enter untuk input Email" /> <Input value={emailShareInput} onChange={(event) => setEmailShareInput(event.target.value)} onKeyPress={handleEmailList} type="email" placeholder={t("pressEnter")} />
</div> </div>
<Button className="bg-blue-500 text-white p-2 w-fit rounded-lg" onClick={() => shareToEmail()}> <Button className="bg-blue-500 text-white p-2 w-fit rounded-lg" onClick={() => shareToEmail()}>
Kirim {t("send")}
</Button> </Button>
</div> </div>
</PopoverContent> </PopoverContent>
@ -554,10 +562,10 @@ const DetailDocument = () => {
{/* Comment */} {/* Comment */}
<div className="flex flex-col my-16 p-4 lg:p-10 bg-[#f7f7f7]"> <div className="flex flex-col my-16 p-4 lg:p-10 bg-[#f7f7f7]">
<div className="gap-5 flex flex-col px-4 lg:px-14"> <div className="gap-5 flex flex-col px-4 lg:px-14">
<p className="flex items-start text-lg">Berikan Komentar</p> <p className="flex items-start text-lg">{t("comment")}</p>
<Textarea placeholder="Type your comments here." className="flex w-full pb-12" onChange={getInputValue} /> <Textarea placeholder="Type your comments here." className="flex w-full pb-12" onChange={getInputValue} />
<button onClick={() => postData()} className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-4 py-1"> <button onClick={() => postData()} className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-4 py-1">
Kirim {t("send")}
</button> </button>
</div> </div>
@ -586,11 +594,11 @@ const DetailDocument = () => {
onClick={() => showInput(`comment-id-${data.id}`)} onClick={() => showInput(`comment-id-${data.id}`)}
className="mr-2" className="mr-2"
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Balas</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("reply")}</small>
</a> </a>
{Number(data.suggestionFrom?.id) == Number(userId) || Number(userRoleId) == 2 ? ( {Number(data.suggestionFrom?.id) == Number(userId) || Number(userRoleId) == 2 ? (
<a onClick={() => deleteData(data.id)}> <a onClick={() => deleteData(data.id)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Hapus</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("delete")}</small>
</a> </a>
) : ( ) : (
"" ""
@ -600,13 +608,13 @@ const DetailDocument = () => {
</div> </div>
{visibleInput === `comment-id-${data.id}` && ( {visibleInput === `comment-id-${data.id}` && (
<div id={`comment-id-${data.id}`} className="px-4 pl-[72px] lg:px-14 lg:pl-32 mt-2 "> <div id={`comment-id-${data.id}`} className="px-4 pl-[72px] lg:px-14 lg:pl-32 mt-2 ">
<Textarea id={`input-comment-${data.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder="Masukkan balasan anda" /> <Textarea id={`input-comment-${data.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder={t("enterReply")} />
<div className="flex flex-row gap-3"> <div className="flex flex-row gap-3">
<a onClick={() => postDataChild(data.id)}> <a onClick={() => postDataChild(data.id)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 mt-2 cursor-pointer">Kirim</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 mt-2 cursor-pointer">{t("send")}</small>
</a> </a>
<a onClick={() => showInput(`comment-id-${data.id}`)}> <a onClick={() => showInput(`comment-id-${data.id}`)}>
<small className="flex items-start bg-[#bb3523] rounded-lg mt-2 w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Batal</small> <small className="flex items-start bg-[#bb3523] rounded-lg mt-2 w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("cancel")}</small>
</a> </a>
</div> </div>
</div> </div>
@ -635,7 +643,7 @@ const DetailDocument = () => {
} }
onClick={() => showInput(`comment-id-${child1.id}`)} onClick={() => showInput(`comment-id-${child1.id}`)}
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Balas</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("reply")}</small>
</a> </a>
<a <a
style={ style={
@ -647,7 +655,7 @@ const DetailDocument = () => {
} }
onClick={() => deleteData(child1.id)} onClick={() => deleteData(child1.id)}
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Hapus</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("delete")}</small>
</a> </a>
</div> </div>
</div> </div>
@ -655,13 +663,13 @@ const DetailDocument = () => {
{visibleInput === `comment-id-${child1.id}` && ( {visibleInput === `comment-id-${child1.id}` && (
<div id={`comment-id-${child1.id}`} className="px-4 lg:px-14 pl-28 lg:pl-[200px]"> <div id={`comment-id-${child1.id}`} className="px-4 lg:px-14 pl-28 lg:pl-[200px]">
<Textarea name="" className="mt-2 " id={`input-comment-${child1.id}`} placeholder="Masukkan balasan anda" /> <Textarea name="" className="mt-2 " id={`input-comment-${child1.id}`} placeholder={t("enterReply")} />
<div className="flex flex-row mt-2 gap-3"> <div className="flex flex-row mt-2 gap-3">
<a onClick={() => postDataChild(child1.id)}> <a onClick={() => postDataChild(child1.id)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Kirim</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("send")}</small>
</a> </a>
<a onClick={() => showInput(`comment-id-${child1.id}`)}> <a onClick={() => showInput(`comment-id-${child1.id}`)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Batal</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("cancel")}</small>
</a> </a>
</div> </div>
</div> </div>
@ -690,7 +698,7 @@ const DetailDocument = () => {
} }
onClick={() => showInput(`comment-id-${child2.id}`)} onClick={() => showInput(`comment-id-${child2.id}`)}
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Balas</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("reply")}</small>
</a> </a>
<a <a
style={ style={
@ -702,20 +710,20 @@ const DetailDocument = () => {
} }
onClick={() => deleteData(child2.id)} onClick={() => deleteData(child2.id)}
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Hapus</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("delete")}</small>
</a> </a>
</div> </div>
</div> </div>
</div> </div>
{visibleInput === `comment-id-${child2.id}` && ( {visibleInput === `comment-id-${child2.id}` && (
<div id={`comment-id-${child2.id}`} className="px-4 lg:px-14 pl-40 lg:pl-[265px]"> <div id={`comment-id-${child2.id}`} className="px-4 lg:px-14 pl-40 lg:pl-[265px]">
<Textarea name="" id={`input-comment-${child2.id}`} className="my-2" placeholder="Masukkan balasan anda" /> <Textarea name="" id={`input-comment-${child2.id}`} className="my-2" placeholder={t("enterReply")} />
<div className="flex flex-row gap-3"> <div className="flex flex-row gap-3">
<a onClick={() => postDataChild(child2.id)}> <a onClick={() => postDataChild(child2.id)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Kirim</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("send")}</small>
</a> </a>
<a onClick={() => showInput(`comment-id-${child2.id}`)}> <a onClick={() => showInput(`comment-id-${child2.id}`)}>
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">Batal</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("cancel")}</small>
</a> </a>
</div> </div>
</div> </div>

2
app/[locale]/(public)/image/detail/[slug]/page.tsx
View File

@ -473,7 +473,7 @@ const DetailInfo = () => {
{t("by")}&nbsp;<span className="font-semibold text-black">{detailDataImage?.uploadedBy?.userLevel?.name}</span> {t("by")}&nbsp;<span className="font-semibold text-black">{detailDataImage?.uploadedBy?.userLevel?.name}</span>
</p> </p>
<p className="text-xs lg:text-sm"> <p className="text-xs lg:text-sm">
&nbsp;|&nbsp;{t("updateOn")} &nbsp;|&nbsp;{t("updatedOn")}
{detailDataImage?.updatedAt} WIB &nbsp;|&nbsp; {detailDataImage?.updatedAt} WIB &nbsp;|&nbsp;
</p> </p>
<p className="text-xs lg:text-sm flex justify-center items-center"> <p className="text-xs lg:text-sm flex justify-center items-center">

38
app/[locale]/(public)/indeks/detail/[slug]/page.tsx
View File

@ -10,6 +10,7 @@ import { Icon } from "@iconify/react/dist/iconify.js";
import { getCookiesDecrypt } from "@/lib/utils"; import { getCookiesDecrypt } from "@/lib/utils";
import { close, loading } from "@/config/swal"; import { close, loading } from "@/config/swal";
import { Input } from "@/components/ui/input"; import { Input } from "@/components/ui/input";
import { useTranslations } from "next-intl";
const IndeksDetail = () => { const IndeksDetail = () => {
const searchParams = useSearchParams(); const searchParams = useSearchParams();
@ -24,6 +25,7 @@ const IndeksDetail = () => {
const userRoleId = getCookiesDecrypt("urie"); const userRoleId = getCookiesDecrypt("urie");
const router: any = useRouter(); const router: any = useRouter();
const [listComments, setListComments] = useState([]); const [listComments, setListComments] = useState([]);
const t = useTranslations("LandingPage");
useEffect(() => { useEffect(() => {
initFetch(); initFetch();
@ -154,7 +156,7 @@ const IndeksDetail = () => {
<div className="p-4 lg:px-60 lg:p-12"> <div className="p-4 lg:px-60 lg:p-12">
{/* Judul */} {/* Judul */}
<div className="flex flex-col mb-5"> <div className="flex flex-col mb-5">
<h1 className="text-base lg:text-lg mb-2">Indeks / Detail</h1> <h1 className="text-base lg:text-lg mb-2">Index / Detail</h1>
<h1 className="flex flex-row font-bold text-center text-lg lg:text-2xl">{indeksData?.title}</h1> <h1 className="flex flex-row font-bold text-center text-lg lg:text-2xl">{indeksData?.title}</h1>
</div> </div>
{/* Gambar Utama */} {/* Gambar Utama */}
@ -164,8 +166,8 @@ const IndeksDetail = () => {
{/* Footer Informasi */} {/* Footer Informasi */}
<div className="text-gray-500 flex border-t mt-4"> <div className="text-gray-500 flex border-t mt-4">
<div className="flex mt-2"> <div className="flex mt-2">
<p className="text-sm lg:text-base mb-2"> <p className="text-xs lg:text-sm mb-2">
oleh&nbsp;<span className="font-semibold text-black">{indeksData?.uploaderName}</span>&nbsp; | &nbsp;Diupdate pada {indeksData?.createdAt} WIB &nbsp; {t("by")}&nbsp;<span className="font-semibold text-black">{indeksData?.uploaderName}</span>&nbsp; | &nbsp;{t("updatedOn")} {indeksData?.createdAt} WIB &nbsp;
</p> </p>
</div> </div>
</div> </div>
@ -180,10 +182,10 @@ const IndeksDetail = () => {
<div className="w-full"> <div className="w-full">
<div className="flex flex-col py-5 p-0 lg:p-10 bg-[#f7f7f7]"> <div className="flex flex-col py-5 p-0 lg:p-10 bg-[#f7f7f7]">
<div className="gap-5 flex flex-col px-4 lg:px-16"> <div className="gap-5 flex flex-col px-4 lg:px-16">
<p className="flex items-start text-bases lg:text-lg">Berikan Komentar</p> <p className="flex items-start text-bases lg:text-lg">{t("comment")}</p>
<Textarea placeholder="Type your comments here." className="flex w-full" onChange={getInputValue} value={message} /> <Textarea placeholder="Type your comments here." className="flex w-full" onChange={getInputValue} value={message} />
<button className="flex items-start bg-[#bb3523] text-white rounded-lg text-sm lg:text-base w-fit px-3 lg:px-4 py-1" onClick={() => postData()}> <button className="flex items-start bg-[#bb3523] text-white rounded-lg text-sm lg:text-base w-fit px-3 lg:px-4 py-1" onClick={() => postData()}>
Kirim {t("send")}
</button> </button>
</div> </div>
@ -202,7 +204,7 @@ const IndeksDetail = () => {
<p className="text-slate-500 text-sm lg:text-base mb-4">{data.message}</p> <p className="text-slate-500 text-sm lg:text-base mb-4">{data.message}</p>
<div className="gap-3"> <div className="gap-3">
<a href="javascript:void(0)" className="text-xs lg:text-sm mr-2 bg-blue-500 text-white py-1 px-2 hover:bg-blue-300 hover:text-black rounded-md" onClick={() => showInput(`comment-id-${data.id}`)}> <a href="javascript:void(0)" className="text-xs lg:text-sm mr-2 bg-blue-500 text-white py-1 px-2 hover:bg-blue-300 hover:text-black rounded-md" onClick={() => showInput(`comment-id-${data.id}`)}>
Balas {t("reply")}
</a> </a>
<a <a
href="javascript:void(0)" href="javascript:void(0)"
@ -216,15 +218,15 @@ const IndeksDetail = () => {
className="text-xs lg:text-sm bg-red-500 text-white py-1 px-2 hover:bg-red-300 hover:text-black rounded-md" className="text-xs lg:text-sm bg-red-500 text-white py-1 px-2 hover:bg-red-300 hover:text-black rounded-md"
onClick={() => deleteData(data.id)} onClick={() => deleteData(data.id)}
> >
Hapus {t("delete")}
</a> </a>
</div> </div>
</div> </div>
</div> </div>
<div className="flex flex-row px-4 pl-[55px] lg:px-14 lg:pl-[135px] mt-2" id={`comment-id-${data.id}`}> <div className="flex flex-row px-4 pl-[55px] lg:px-14 lg:pl-[135px] mt-2" id={`comment-id-${data.id}`}>
<Input type="text" id={`input-comment-${data.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder="Masukkan balasan anda" /> <Input type="text" id={`input-comment-${data.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder={t("enterReply")} />
<a href="javascript:void(0)" className="flex py-1 px-2 rounded-md items-center ml-2 bg-[#f7b357] text-white text-sm lg:text-base" onClick={() => postDataChild(data.id)}> <a href="javascript:void(0)" className="flex py-1 px-2 rounded-md items-center ml-2 bg-[#f7b357] text-white text-sm lg:text-base" onClick={() => postDataChild(data.id)}>
Send {t("send")}
</a> </a>
</div> </div>
{data.children.length > 0 {data.children.length > 0
@ -242,7 +244,7 @@ const IndeksDetail = () => {
<p className="text-slate-500 text-sm mb-4">{child1.message}</p> <p className="text-slate-500 text-sm mb-4">{child1.message}</p>
<div className="gap-3"> <div className="gap-3">
<a href="javascript:void(0)" className="mr-2 text-xs lg:text-sm bg-blue-500 text-white py-1 px-2 hover:bg-blue-300 hover:text-black rounded-md" onClick={() => showInput(`comment-id-${child1.id}`)}> <a href="javascript:void(0)" className="mr-2 text-xs lg:text-sm bg-blue-500 text-white py-1 px-2 hover:bg-blue-300 hover:text-black rounded-md" onClick={() => showInput(`comment-id-${child1.id}`)}>
Balas {t("reply")}
</a> </a>
<a <a
href="javascript:void(0)" href="javascript:void(0)"
@ -256,15 +258,15 @@ const IndeksDetail = () => {
} }
onClick={() => deleteData(child1.id)} onClick={() => deleteData(child1.id)}
> >
Hapus {t("delete")}
</a> </a>
</div> </div>
</div> </div>
</div> </div>
<div className="flex flex-row justify-center px-4 pl-[87px] lg:px-14 lg:pl-[205px] mt-2" id={`comment-id-${child1.id}`}> <div className="flex flex-row justify-center px-4 pl-[87px] lg:px-14 lg:pl-[205px] mt-2" id={`comment-id-${child1.id}`}>
<Input type="text" id={`input-comment-${child1.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder="Masukkan balasan anda" /> <Input type="text" id={`input-comment-${child1.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder={t("enterReply")} />
<a href="javascript:void(0)" className="flex text-sm lg:text-base py-1 px-2 rounded-md items-center ml-2 bg-[#f7b357] text-white" onClick={() => postDataChild(child1.id)}> <a href="javascript:void(0)" className="flex text-sm lg:text-base py-1 px-2 rounded-md items-center ml-2 bg-[#f7b357] text-white" onClick={() => postDataChild(child1.id)}>
Send {t("send")}
</a> </a>
</div> </div>
{child1.children.length > 0 {child1.children.length > 0
@ -282,7 +284,7 @@ const IndeksDetail = () => {
<p className="text-slate-500 text-sm mb-4">{child2.message}</p> <p className="text-slate-500 text-sm mb-4">{child2.message}</p>
<div> <div>
<a href="javascript:void(0)" className="mr-2 text-xs lg:text-sm bg-blue-500 text-white py-1 px-2 hover:bg-blue-300 hover:text-black rounded-md" onClick={() => showInput("comment-id-" + child2.id)}> <a href="javascript:void(0)" className="mr-2 text-xs lg:text-sm bg-blue-500 text-white py-1 px-2 hover:bg-blue-300 hover:text-black rounded-md" onClick={() => showInput("comment-id-" + child2.id)}>
Balas {t("reply")}
</a> </a>
<a <a
href="javascript:void(0)" href="javascript:void(0)"
@ -296,15 +298,15 @@ const IndeksDetail = () => {
} }
onClick={() => deleteData(child2.id)} onClick={() => deleteData(child2.id)}
> >
Hapus {t("delete")}
</a> </a>
</div> </div>
</div> </div>
</div> </div>
<div className="flex flex-row px-4 pl-[120px] lg:px-14 lg:pl-[270px] mt-2" id={`comment-id-${child2.id}`}> <div className="flex flex-row px-4 pl-[120px] lg:px-14 lg:pl-[270px] mt-2" id={`comment-id-${child2.id}`}>
<Input type="text" id={`comment-id-${child2.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder="Masukkan balasan anda" /> <Input type="text" id={`comment-id-${child2.id}`} className="p-4 focus:outline-none focus:border-sky-500" placeholder={t("enterReply")} />
<a href="javascript:void(0)" className="flex text-sm lg:text-base py-1 px-2 rounded-md items-center ml-2 bg-[#f7b357] text-white" onClick={() => postDataChild(child1.id)}> <a href="javascript:void(0)" className="flex text-sm lg:text-base py-1 px-2 rounded-md items-center ml-2 bg-[#f7b357] text-white" onClick={() => postDataChild(child1.id)}>
Send {t("send")}
</a> </a>
</div> </div>
</div> </div>
@ -320,7 +322,7 @@ const IndeksDetail = () => {
{/* Konten Serupa */} {/* Konten Serupa */}
<div className="space-x-5 flex flex-col px-4 lg:px-16 py-16 gap-5"> <div className="space-x-5 flex flex-col px-4 lg:px-16 py-16 gap-5">
<h1 className="font-bold text-base lg:text-xl px-4 lg:px-8">Post Terkait</h1> <h1 className="font-bold text-base lg:text-xl px-4 lg:px-8"> {t("relatedPosts")}</h1>
<Carousel> <Carousel>
<CarouselContent className="w-full max-w-7xl"> <CarouselContent className="w-full max-w-7xl">
{indexData?.map((relate: any) => ( {indexData?.map((relate: any) => (

8
app/[locale]/(public)/video/detail/[slug]/page.tsx
View File

@ -440,7 +440,7 @@ const DetailVideo = () => {
{t("by")}&nbsp;<span className="font-semibold text-black">{detailDataVideo?.uploadedBy?.userLevel?.name}</span> {t("by")}&nbsp;<span className="font-semibold text-black">{detailDataVideo?.uploadedBy?.userLevel?.name}</span>
</p> </p>
<p className="text-xs lg:text-sm"> <p className="text-xs lg:text-sm">
&nbsp;|&nbsp;{t("updateOn")} &nbsp;|&nbsp;{t("updatedOn")}
{detailDataVideo?.updatedAt} WIB &nbsp;|&nbsp; {detailDataVideo?.updatedAt} WIB &nbsp;|&nbsp;
</p> </p>
<p className="text-xs lg:text-sm flex justify-center items-center"> <p className="text-xs lg:text-sm flex justify-center items-center">
@ -536,7 +536,7 @@ const DetailVideo = () => {
{/* Tombol Bagikan */} {/* Tombol Bagikan */}
<div className="flex flex-row justify-center py-3"> <div className="flex flex-row justify-center py-3">
<p className="text-base font-semibold">Bagikan</p> <p className="text-base font-semibold">{t("share")}</p>
<a className="ml-8 cursor-pointer" onClick={() => handleShare("fb", `https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fmediahub.polri.go.id%2F${typeString}%2Fdetail%2F${content?.id}&quote=${content?.title}`)}> <a className="ml-8 cursor-pointer" onClick={() => handleShare("fb", `https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fmediahub.polri.go.id%2F${typeString}%2Fdetail%2F${content?.id}&quote=${content?.title}`)}>
<Icon icon="brandico:facebook" height="20" className="px-auto text-red-600 text-center" /> <Icon icon="brandico:facebook" height="20" className="px-auto text-red-600 text-center" />
</a> </a>
@ -557,7 +557,7 @@ const DetailVideo = () => {
<h1 className="mb-2">{t("shareTo")}</h1> <h1 className="mb-2">{t("shareTo")}</h1>
<div className="flex flex-col mb-2"> <div className="flex flex-col mb-2">
<p className="text-base font-semibold mb-1">{t("destinationEmail")}</p> <p className="text-base font-semibold mb-1">{t("destinationEmail")}</p>
<Input value={emailShareInput} onChange={(event) => setEmailShareInput(event.target.value)} onKeyPress={handleEmailList} type="email" placeholder="Tekan Enter untuk input Email" /> <Input value={emailShareInput} onChange={(event) => setEmailShareInput(event.target.value)} onKeyPress={handleEmailList} type="email" placeholder={t("pressEnter")} />
</div> </div>
<Button className="bg-blue-500 text-white p-2 w-fit rounded-lg" onClick={() => shareToEmail()}> <Button className="bg-blue-500 text-white p-2 w-fit rounded-lg" onClick={() => shareToEmail()}>
{t("send")} {t("send")}
@ -720,7 +720,7 @@ const DetailVideo = () => {
} }
onClick={() => deleteData(child2.id)} onClick={() => deleteData(child2.id)}
> >
<small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("cancel")}</small> <small className="flex items-start bg-[#bb3523] rounded-lg w-fit text-white px-2 text-xs lg:text-base lg:px-4 py-1 cursor-pointer">{t("delete")}</small>
</a> </a>
</div> </div>
</div> </div>

7
messages/en.json
View File

@ -366,7 +366,7 @@
"previousSchedule": "Previous Schedule", "previousSchedule": "Previous Schedule",
"speaker": "Speaker :", "speaker": "Speaker :",
"nextSchedule": "Next Schedule", "nextSchedule": "Next Schedule",
"by": "By", "by": "Uploaded By",
"updatedOn": "Update On", "updatedOn": "Update On",
"creator": "Creator :", "creator": "Creator :",
"delete": "Delete", "delete": "Delete",
@ -382,7 +382,10 @@
"leaveComment": "Leave your comments here.", "leaveComment": "Leave your comments here.",
"reply": "Reply", "reply": "Reply",
"cancel": "Cancel", "cancel": "Cancel",
"enterReply": "Enter Your Replay" "enterReply": "Enter Your Replay",
"docSize": "Document Size Options",
"audioSize": "Audio Size Options",
"relatedPosts": "Related Posts"
}, },
"FilterPage": { "FilterPage": {
"image": "Image", "image": "Image",

7
messages/in.json
View File

@ -366,7 +366,7 @@
"previousSchedule": "Jadwal Sebelumnya", "previousSchedule": "Jadwal Sebelumnya",
"speaker": "Pembicara :", "speaker": "Pembicara :",
"nextSchedule": "Jadwal Selanjutnya", "nextSchedule": "Jadwal Selanjutnya",
"by": "Oleh", "by": "Diunggah Oleh",
"updatedOn": "Diupdate pada", "updatedOn": "Diupdate pada",
"creator": "Kreator :", "creator": "Kreator :",
"delete": "Hapus", "delete": "Hapus",
@ -382,7 +382,10 @@
"reply": "Balas", "reply": "Balas",
"cancel": "Batal", "cancel": "Batal",
"videoSize": "Opsi Ukuran Audio Visual", "videoSize": "Opsi Ukuran Audio Visual",
"enterReply": "Masukkan balasan Anda" "enterReply": "Masukkan balasan Anda",
"docSize": "Opsi Ukuran Teks",
"audioSize": "Opsi Ukuran Audio",
"relatedPosts": "Post Terkait"
}, },
"FilterPage": { "FilterPage": {
"image": "Foto", "image": "Foto",