fix: all card in media update

This commit is contained in:
Sabda Yagra 2025-10-16 23:20:47 +07:00
parent 249f84c002
commit 67fac73243
7 changed files with 1847 additions and 1819 deletions

View File

@ -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>

View File

@ -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>

View File

@ -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

View File

@ -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"

View File

@ -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;
}

View File

@ -434,6 +434,39 @@ export default function MediaUpdate() {
{filteredData.map((item) => (
<SwiperSlide key={item.id}>
<div className="rounded-xl shadow-md overflow-hidden bg-white">
{/* ✅ 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
@ -444,14 +477,14 @@ export default function MediaUpdate() {
/>
</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)}