fix: all card in media update
This commit is contained in:
parent
249f84c002
commit
67fac73243
|
|
@ -5,7 +5,7 @@ const VideoDetailPage = async () => {
|
|||
return (
|
||||
<div>
|
||||
<SiteBreadcrumb />
|
||||
<div className="space-y-4">
|
||||
<div className="space-y-4 bg-slate-100">
|
||||
<FormVideoDetail />
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
import FormVideoUpdate from "@/components/form/content/audio-visual/video-update-form";
|
||||
import SiteBreadcrumb from "@/components/site-breadcrumb";
|
||||
|
||||
const VideoUpdatePage = async () => {
|
||||
return (
|
||||
<div>
|
||||
{/* <SiteBreadcrumb /> */}
|
||||
<div className="space-y-4">
|
||||
<SiteBreadcrumb />
|
||||
<div className="space-y-4 bg-slate-100">
|
||||
<FormVideoUpdate />
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -173,6 +173,7 @@ export default function FormVideoDetail() {
|
|||
htmlDescription: details?.htmlDescription,
|
||||
uploadedById: details?.createdById,
|
||||
files: details?.files || [],
|
||||
thumbnailUrl: details?.thumbnailUrl || details?.thumbnail || "",
|
||||
};
|
||||
setDetail(mappedDetail);
|
||||
setFiles(details?.files || []);
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -103,7 +103,6 @@ export default function FormVideoUpdate() {
|
|||
const MySwal = withReactContent(Swal);
|
||||
const { id } = useParams() as { id: string };
|
||||
const router = useRouter();
|
||||
|
||||
const [detail, setDetail] = useState<any>(null);
|
||||
const [categories, setCategories] = useState<Category[]>([]);
|
||||
const [tags, setTags] = useState<string[]>([]);
|
||||
|
|
@ -114,7 +113,6 @@ export default function FormVideoUpdate() {
|
|||
const [files, setFiles] = useState<FileWithPreview[]>([]);
|
||||
const [thumbsSwiper, setThumbsSwiper] = useState<any>(null);
|
||||
const [detailFiles, setDetailFiles] = useState<DetailFile[]>([]);
|
||||
|
||||
const { getRootProps, getInputProps } = useDropzone({
|
||||
accept: {
|
||||
"video/mp4": [".mp4"],
|
||||
|
|
@ -275,9 +273,9 @@ export default function FormVideoUpdate() {
|
|||
|
||||
return (
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<div className="flex flex-col lg:flex-row gap-10">
|
||||
<div className="flex flex-col lg:flex-row gap-10 border rounded-lg">
|
||||
{/* Left Side */}
|
||||
<Card className="w-full lg:w-8/12 p-6">
|
||||
<Card className="w-full lg:w-8/12 p-6 m-2">
|
||||
<h2 className="text-lg font-semibold mb-4">Update Video</h2>
|
||||
|
||||
{/* Title */}
|
||||
|
|
@ -395,7 +393,7 @@ export default function FormVideoUpdate() {
|
|||
</Card>
|
||||
|
||||
{/* Right Side */}
|
||||
<div className="w-full lg:w-4/12 space-y-4">
|
||||
<div className="w-full lg:w-4/12 space-y-4 m-2">
|
||||
<Card className="p-4">
|
||||
<Label>Creator</Label>
|
||||
<Controller
|
||||
|
|
@ -523,7 +521,7 @@ export default function FormVideoUpdate() {
|
|||
</div>
|
||||
|
||||
<div className="flex justify-end gap-3 mt-5">
|
||||
<Button type="submit">Update</Button>
|
||||
<Button type="submit" className="border rounded-lg">Update</Button>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
|
|
|
|||
|
|
@ -86,14 +86,13 @@ export default function Header() {
|
|||
fetchData();
|
||||
}, [slug]);
|
||||
|
||||
// ✅ Ambil data bookmark dari backend (bukan localStorage)
|
||||
useEffect(() => {
|
||||
const fetchBookmarks = async () => {
|
||||
const currentUserId: any = getCookiesDecrypt("uie");
|
||||
setUserId(currentUserId);
|
||||
|
||||
if (!currentUserId) {
|
||||
setBookmarkedIds(new Set()); // logout: reset
|
||||
setBookmarkedIds(new Set());
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -71,15 +71,15 @@ export default function MediaUpdate() {
|
|||
function getTypeIdByContentType(contentType: string): string {
|
||||
switch (contentType) {
|
||||
case "audiovisual":
|
||||
return "2";
|
||||
return "2";
|
||||
case "foto":
|
||||
return "1";
|
||||
return "1";
|
||||
case "audio":
|
||||
return "4";
|
||||
return "4";
|
||||
case "text":
|
||||
return "3";
|
||||
return "3";
|
||||
default:
|
||||
return "1";
|
||||
return "1";
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -173,15 +173,15 @@ export default function MediaUpdate() {
|
|||
const filtered = dataToRender.filter((item) => {
|
||||
switch (contentType) {
|
||||
case "audiovisual":
|
||||
return item.typeId === 2;
|
||||
return item.typeId === 2;
|
||||
case "audio":
|
||||
return item.typeId === 4;
|
||||
return item.typeId === 4;
|
||||
case "foto":
|
||||
return item.typeId === 1;
|
||||
return item.typeId === 1;
|
||||
case "text":
|
||||
return item.typeId === 3;
|
||||
return item.typeId === 3;
|
||||
default:
|
||||
return true;
|
||||
return true;
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -434,24 +434,57 @@ export default function MediaUpdate() {
|
|||
{filteredData.map((item) => (
|
||||
<SwiperSlide key={item.id}>
|
||||
<div className="rounded-xl shadow-md overflow-hidden bg-white">
|
||||
<div className="w-full h-[204px] relative">
|
||||
<Link href={getLink(item)}>
|
||||
<Image
|
||||
src={item.smallThumbnailLink || "/placeholder.png"}
|
||||
alt={item.title || "No Title"}
|
||||
fill
|
||||
className="object-cover cursor-pointer hover:opacity-90 transition-opacity"
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
{/* ✅ Kondisi: jika typeId = 3 (text) atau 4 (audio) tampilkan ikon, lainnya tampilkan thumbnail */}
|
||||
{item.typeId === 3 ? (
|
||||
// 📝 TEXT
|
||||
<div className="bg-[#e0c350] flex items-center justify-center h-[204px] text-white">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="90"
|
||||
height="90"
|
||||
viewBox="0 0 16 16"
|
||||
>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M5 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V5.414a1.5 1.5 0 0 0-.44-1.06L9.647 1.439A1.5 1.5 0 0 0 8.586 1zM4 3a1 1 0 0 1 1-1h3v2.5A1.5 1.5 0 0 0 9.5 6H12v7a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1zm7.793 2H9.5a.5.5 0 0 1-.5-.5V2.207z"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
) : item.typeId === 4 ? (
|
||||
// 🎵 AUDIO
|
||||
<div className="flex items-center justify-center bg-[#bb3523] w-full h-[204px] text-white">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="100"
|
||||
height="100"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M14.702 2.226A1 1 0 0 1 16 3.18v6.027a5.5 5.5 0 0 0-1-.184V6.18L8 8.368V15.5a2.5 2.5 0 1 1-1-2V5.368a1 1 0 0 1 .702-.955zM8 7.32l7-2.187V3.18L8 5.368zM5.5 14a1.5 1.5 0 1 0 0 3a1.5 1.5 0 0 0 0-3m13.5.5a4.5 4.5 0 1 1-9 0a4.5 4.5 0 0 1 9 0m-2.265-.436l-2.994-1.65a.5.5 0 0 0-.741.438v3.3a.5.5 0 0 0 .741.438l2.994-1.65a.5.5 0 0 0 0-.876"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
) : (
|
||||
// 🎬 FOTO / VIDEO (default)
|
||||
<div className="w-full h-[204px] relative">
|
||||
<Link href={getLink(item)}>
|
||||
<Image
|
||||
src={item.smallThumbnailLink || "/placeholder.png"}
|
||||
alt={item.title || "No Title"}
|
||||
fill
|
||||
className="object-cover cursor-pointer hover:opacity-90 transition-opacity"
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Caption / info */}
|
||||
<div className="p-3">
|
||||
<div className="flex gap-2 mb-1">
|
||||
<span className="text-xs text-white px-2 py-0.5 rounded bg-blue-600">
|
||||
{item.clientName || "Tanpa Kategori"}
|
||||
</span>
|
||||
{/* <span className="text-xs font-medium text-[#b3882e] capitalize">
|
||||
{tipeKonten}
|
||||
</span> */}
|
||||
</div>
|
||||
<p className="text-xs text-gray-500 mb-1">
|
||||
{formatTanggal(item.createdAt)}
|
||||
|
|
|
|||
Loading…
Reference in New Issue