fix: change url jenkins in gitlab.ci

This commit is contained in:
Sabda Yagra 2025-12-11 11:45:26 +07:00
parent c0ce2c3310
commit 5acd31dbfc
13 changed files with 1384 additions and 201 deletions

View File

@ -26,4 +26,4 @@ auto-deploy:
services:
- docker:dind
script:
- curl --user admin:$JENKINS_PWD http://38.47.180.165:8080/job/auto-deploy-new-netidhub-public/build?token=autodeploynetidhub
- curl --user admin:$JENKINS_PWD http://103.31.38.120:8080/job/auto-deploy-new-netidhub-public/build?token=autodeploynetidhub

View File

@ -1,3 +1,309 @@
// "use client";
// import { useEffect, useState } from "react";
// import { Input } from "@/components/ui/input";
// import { Textarea } from "@/components/ui/textarea";
// import { Button } from "@/components/ui/button";
// import { Label } from "@/components/ui/label";
// import { Switch } from "@/components/ui/switch";
// import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
// import { useRouter } from "next/navigation";
// import Swal from "sweetalert2";
// import withReactContent from "sweetalert2-react-content";
// import { createSchedule } from "@/service/landing/landing";
// import Cookies from "js-cookie";
// const MySwal = withReactContent(Swal);
// export default function CreateSchedulePage() {
// const router = useRouter();
// const [formData, setFormData] = useState({
// createdById: 0,
// typeId: 1,
// clientName: "",
// clientSlug: "",
// description: "",
// endDate: "",
// endTime: "",
// isLiveStreaming: false,
// location: "",
// speakers: "",
// startDate: "",
// startTime: "",
// title: "",
// liveStreamingUrl: "",
// posterImagePath: "",
// });
// const [loading, setLoading] = useState(false);
// // 🔹 Ambil data user dari cookie login
// useEffect(() => {
// try {
// const userInfo = Cookies.get("uinfo");
// if (userInfo) {
// const parsed = JSON.parse(userInfo);
// const workflowName =
// parsed?.approvalWorkflowInfo?.defaultWorkflowName || "";
// const cleanName = workflowName.replace(/WORKFLOW/gi, "").trim();
// const slug =
// cleanName?.toLowerCase()?.replace(/\s+/g, "-") || "general";
// setFormData((prev) => ({
// ...prev,
// createdById: parsed?.id || 0,
// typeId: parsed?.userLevelId || 1,
// clientName: cleanName,
// clientSlug: slug,
// }));
// console.log("✅ Auto-filled user info:", {
// createdById: parsed?.id,
// typeId: parsed?.userLevelId,
// clientName: cleanName,
// clientSlug: slug,
// });
// }
// } catch (err) {
// console.warn("⚠️ Gagal parse cookie user info:", err);
// }
// }, []);
// const handleChange = (
// e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
// ) => {
// const { name, value } = e.target;
// setFormData((prev) => ({ ...prev, [name]: value }));
// };
// const handleToggle = (checked: boolean) => {
// setFormData((prev) => ({ ...prev, isLiveStreaming: checked }));
// };
// const handleSubmit = async (e: React.FormEvent) => {
// e.preventDefault();
// setLoading(true);
// try {
// // 🔸 Format tanggal + kirim semua field
// const payload = {
// createdById: Number(formData.createdById) || 1,
// typeId: Number(formData.typeId) || 1,
// title: formData.title,
// description: formData.description,
// location: formData.location,
// speakers: formData.speakers,
// startDate: `${formData.startDate}T${formData.startTime}:00Z`,
// endDate: `${formData.endDate}T${formData.endTime}:00Z`,
// startTime: formData.startTime,
// endTime: formData.endTime,
// isLiveStreaming: formData.isLiveStreaming,
// liveStreamingUrl: formData.liveStreamingUrl,
// posterImagePath: formData.posterImagePath,
// clientName: formData.clientName,
// clientSlug: formData.clientSlug,
// };
// console.log("📦 Payload dikirim ke backend:", payload);
// const res = await createSchedule(payload);
// if (!res?.error) {
// MySwal.fire({
// icon: "success",
// title: "Berhasil!",
// text: "Schedule berhasil dibuat.",
// timer: 2000,
// showConfirmButton: false,
// });
// setTimeout(() => router.push("/admin/schedule"), 2000);
// } else {
// MySwal.fire({
// icon: "error",
// title: "Gagal!",
// text: res?.message || "Gagal membuat schedule.",
// });
// }
// } catch (error) {
// console.error("❌ Error:", error);
// MySwal.fire({
// icon: "error",
// title: "Error",
// text: "Terjadi kesalahan pada sistem.",
// });
// } finally {
// setLoading(false);
// }
// };
// return (
// <div className="max-w-4xl mx-auto mt-10">
// <Card className="shadow-lg border border-gray-200 dark:border-gray-800">
// <CardHeader>
// <CardTitle className="text-xl font-semibold">
// Buat Jadwal Baru
// </CardTitle>
// </CardHeader>
// <CardContent>
// <form onSubmit={handleSubmit} className="space-y-6">
// {/* 🔹 Info otomatis dari cookie */}
// <div className="text-sm text-gray-600 bg-gray-50 p-3 rounded-md">
// <p>
// <b>Client:</b> {formData.clientName || "-"} (
// {formData.clientSlug || "-"})
// </p>
// <p>
// <b>createdById:</b> {formData.createdById} | <b>typeId:</b>{" "}
// {formData.typeId}
// </p>
// </div>
// <div>
// <Label htmlFor="title">Judul Acara</Label>
// <Input
// id="title"
// name="title"
// value={formData.title}
// onChange={handleChange}
// placeholder="Masukkan judul acara"
// required
// />
// </div>
// <div>
// <Label htmlFor="description">Deskripsi</Label>
// <Textarea
// id="description"
// name="description"
// value={formData.description}
// onChange={handleChange}
// placeholder="Masukkan deskripsi acara"
// required
// />
// </div>
// <div className="grid grid-cols-2 gap-4">
// <div>
// <Label htmlFor="startDate">Tanggal Mulai</Label>
// <Input
// type="date"
// id="startDate"
// name="startDate"
// value={formData.startDate}
// onChange={handleChange}
// required
// />
// </div>
// <div>
// <Label htmlFor="endDate">Tanggal Selesai</Label>
// <Input
// type="date"
// id="endDate"
// name="endDate"
// value={formData.endDate}
// onChange={handleChange}
// required
// />
// </div>
// <div>
// <Label htmlFor="startTime">Jam Mulai</Label>
// <Input
// type="time"
// id="startTime"
// name="startTime"
// value={formData.startTime}
// onChange={handleChange}
// required
// />
// </div>
// <div>
// <Label htmlFor="endTime">Jam Selesai</Label>
// <Input
// type="time"
// id="endTime"
// name="endTime"
// value={formData.endTime}
// onChange={handleChange}
// required
// />
// </div>
// </div>
// <div>
// <Label htmlFor="location">Lokasi</Label>
// <Input
// id="location"
// name="location"
// value={formData.location}
// onChange={handleChange}
// placeholder="Masukkan lokasi acara"
// required
// />
// </div>
// <div>
// <Label htmlFor="speakers">Pembicara</Label>
// <Input
// id="speakers"
// name="speakers"
// value={formData.speakers}
// onChange={handleChange}
// placeholder="Nama pembicara"
// required
// />
// </div>
// <div className="flex items-center justify-between">
// <Label htmlFor="isLiveStreaming">Live Streaming?</Label>
// <Switch
// id="isLiveStreaming"
// checked={formData.isLiveStreaming}
// onCheckedChange={handleToggle}
// />
// </div>
// {formData.isLiveStreaming && (
// <div>
// <Label htmlFor="liveStreamingUrl">Link Live Streaming</Label>
// <Input
// id="liveStreamingUrl"
// name="liveStreamingUrl"
// value={formData.liveStreamingUrl}
// onChange={handleChange}
// placeholder="https://youtube.com/..."
// />
// </div>
// )}
// <div>
// <Label htmlFor="posterImagePath">Poster (opsional)</Label>
// <Input
// id="posterImagePath"
// name="posterImagePath"
// value={formData.posterImagePath}
// onChange={handleChange}
// placeholder="/uploads/poster/namafile.png"
// />
// </div>
// <Button
// type="submit"
// className="w-full h-11 font-semibold"
// disabled={loading}
// >
// {loading ? "Menyimpan..." : "Simpan Jadwal"}
// </Button>
// </form>
// </CardContent>
// </Card>
// </div>
// );
// }
"use client";
import { useState } from "react";

View File

@ -121,7 +121,7 @@ export default function EditSchedulePage() {
timer: 2000,
showConfirmButton: false,
});
setTimeout(() => router.push("/admin/schedules"), 2000);
setTimeout(() => router.push("/admin/schedule"), 2000);
} else {
MySwal.fire({
icon: "error",

View File

@ -138,7 +138,7 @@ export default function ScheduleListPage() {
<CalendarDays className="w-6 h-6 text-blue-600" />
Daftar Jadwal
</h1>
<Button onClick={() => router.push("/admin/schedules/create")}>
<Button onClick={() => router.push("/admin/schedule/create")}>
<Plus className="mr-2 h-4 w-4" /> Tambah Jadwal
</Button>
</div>

View File

@ -1,5 +1,5 @@
import DetailCommentVideo from "@/components/main/comment-detail-video";
import DetailCommentText from "@/components/main/comment-detail-text";
export default async function DetailCommentInfo() {
return <DetailCommentVideo />;
return <DetailCommentText />;
}

View File

@ -205,12 +205,53 @@ export default function Navbar() {
</button>
{showProfileMenu && (
<div className="absolute right-0 mt-2 w-40 bg-white border rounded shadow z-50">
<div className="absolute right-0 mt-2 w-40 bg-white border rounded shadow z-50 ">
<Link
href="/admin/dashboard"
className="flex flex-row items-center text-left px-4 py-2 hover:bg-gray-100 text-gray-700"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 24 24"
>
<path
fill="currentColor"
d="M14 21a1 1 0 0 1-1-1v-8a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1zM4 13a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1zm5-2V5H5v6zM4 21a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1zm1-2h4v-2H5zm10 0h4v-6h-4zM13 4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1h-6a1 1 0 0 1-1-1zm2 1v2h4V5z"
/>
</svg>
&nbsp;Dashboard
</Link>
<button
onClick={handleLogout}
className="w-full text-left px-4 py-2 text-sm hover:bg-gray-100 text-gray-700"
className="w-full flex flex-row text-left px-4 py-2 hover:bg-gray-100 text-gray-700 cursor-pointer"
>
{t("logout")}
<svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 24 24"
>
<g
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeWidth="1.5"
>
<path
strokeLinejoin="round"
d="M13.477 21.245H8.34a4.92 4.92 0 0 1-5.136-4.623V7.378A4.92 4.92 0 0 1 8.34 2.755h5.136"
/>
<path strokeMiterlimit="10" d="M20.795 12H7.442" />
<path
strokeLinejoin="round"
d="m16.083 17.136l4.404-4.404a1.04 1.04 0 0 0 0-1.464l-4.404-4.404"
/>
</g>
</svg>
&nbsp;{t("logout")}
</button>
</div>
)}
@ -329,7 +370,9 @@ export default function Navbar() {
{t("subscribeTitle")}
</h2>
<Input type="email" placeholder={t("subscribePlaceholder")} />
<Button className="bg-[#C6A455] mt-2">{t("subscribeButton")}</Button>
<Button className="bg-[#C6A455] mt-2">
{t("subscribeButton")}
</Button>
</Card>
</div>

View File

@ -21,37 +21,47 @@ import {
} from "@/components/ui/select";
import { Badge } from "@/components/ui/badge";
import { getAllSchedules } from "@/service/landing/landing";
import { getPublicClients } from "@/service/client/public-clients";
export default function Schedule() {
const [search, setSearch] = useState("");
const [startDate, setStartDate] = useState<Date | undefined>(new Date());
const [endDate, setEndDate] = useState<Date | undefined>(new Date());
const [selectedCategory, setSelectedCategory] = useState("SEMUA");
const [selectedSlug, setSelectedSlug] = useState<string | undefined>(
undefined
);
const [scheduleData, setScheduleData] = useState<any[]>([]);
const [clients, setClients] = useState<any[]>([]);
const [loading, setLoading] = useState(false);
const categories = [
"SEMUA",
"POLRI",
"MAHKAMAH AGUNG",
"DPR",
"MPR",
"KEJAKSAAN AGUNG",
"KPK",
"PUPR",
"BSKDN",
"BUMN",
"KPU",
];
// 🔹 Fetch daftar client
useEffect(() => {
async function fetchClients() {
try {
const res = await getPublicClients();
if (res?.data?.success && res.data.data) {
setClients(res.data.data);
} else {
setClients([]);
}
} catch (error) {
console.error("Error fetching clients:", error);
setClients([]);
}
}
fetchClients();
}, []);
// 🔹 Fetch jadwal dari API (termasuk clientSlug)
const fetchSchedules = async () => {
try {
setLoading(true);
const params = {
title: search || undefined,
startDate: startDate ? format(startDate, "yyyy-MM-dd") : undefined,
endDate: endDate ? format(endDate, "yyyy-MM-dd") : undefined,
clientSlug: selectedSlug, // 🔥 Tambahkan clientSlug untuk filter
page: 1,
limit: 50,
sortBy: "startDate",
@ -68,7 +78,6 @@ export default function Schedule() {
: Array.isArray(res.data?.records)
? res.data.records
: [];
setScheduleData(apiData);
} else {
console.error("Gagal memuat jadwal:", res.message);
@ -82,21 +91,10 @@ export default function Schedule() {
}
};
// 🔹 Re-fetch setiap kali filter berubah
useEffect(() => {
fetchSchedules();
}, [startDate, endDate, search]);
const filteredData = Array.isArray(scheduleData)
? scheduleData.filter((item) => {
const matchesCategory =
selectedCategory === "SEMUA" ||
item.type?.toUpperCase() === selectedCategory;
const matchesSearch = item.title
?.toLowerCase()
.includes(search.toLowerCase());
return matchesCategory && matchesSearch;
})
: [];
}, [startDate, endDate, search, selectedSlug]);
return (
<div className="p-6 max-w-[1350px] mx-auto">
@ -156,38 +154,54 @@ export default function Schedule() {
</PopoverContent>
</Popover>
</div>
{/* Publikasi */}
<div className="flex flex-col gap-2">
<label className="text-sm font-medium">Publikasi</label>
<Select>
<SelectTrigger className="w-[150px]">
<SelectValue placeholder="Semua" />
</SelectTrigger>
<SelectContent>
<SelectItem value="semua">K/L</SelectItem>
<SelectItem value="dipublikasikan">BUMN</SelectItem>
<SelectItem value="belum">PEMERINTAH DAERAH</SelectItem>
</SelectContent>
</Select>
</div>
</div>
{/* Filter Chips */}
{/* 🔹 Dynamic Category dari API */}
<div className="flex w-full gap-5 overflow-x-auto pb-2 border-b border-[#C6A455] mb-6">
{categories.map((cat) => (
<Button
key="SEMUA"
variant={selectedCategory === "SEMUA" ? "default" : "outline"}
className={cn(
"rounded-sm whitespace-nowrap",
selectedCategory === "SEMUA" && "bg-[#C6A455] text-white"
)}
onClick={() => {
setSelectedCategory("SEMUA");
setSelectedSlug(undefined); // reset filter
}}
>
SEMUA
</Button>
{clients.map((client) => (
<Button
key={cat}
variant={selectedCategory === cat ? "default" : "outline"}
key={client.slug || client.name}
variant={
selectedCategory === client.name.toUpperCase()
? "default"
: "outline"
}
className={cn(
"rounded-sm whitespace-nowrap",
selectedCategory === cat && "bg-[#C6A455] text-white"
"rounded-sm whitespace-nowrap flex items-center gap-2",
selectedCategory === client.name.toUpperCase() &&
"bg-[#C6A455] text-white"
)}
onClick={() => setSelectedCategory(cat)}
onClick={() => {
setSelectedCategory(client.name.toUpperCase());
setSelectedSlug(client.slug); // 🔥 Set slug untuk filter API
}}
>
{cat}
{client.logoUrl && (
<img
src={client.logoUrl}
alt={client.name}
className="w-5 h-5 rounded"
/>
)}
{client.name}
</Button>
))}
<Button variant="ghost">
<ChevronRight className="w-5 h-5" />
</Button>
@ -202,41 +216,51 @@ export default function Schedule() {
<div className="text-center text-muted-foreground py-10">
Memuat data jadwal...
</div>
) : filteredData.length === 0 ? (
) : scheduleData.length === 0 ? (
<div className="text-center text-muted-foreground py-10">
Tidak ada jadwal ditemukan.
</div>
) : (
<div className="flex flex-col gap-3">
{filteredData.map((item, index) => (
<div className="flex flex-col gap-3 justify-between">
{scheduleData.map((item, index) => (
<div
key={index}
className="flex justify-between items-start border-b pb-2"
>
<div className="w-1/6 text-sm text-muted-foreground">
{item.startDate
? format(new Date(item.startDate), "dd MMM yyyy")
: "-"}
<div className="w-2/5">
{item.startDate ? (
<>
{format(new Date(item.startDate), "dd MMM yyyy")}
{item.endDate &&
item.endDate !== item.startDate &&
`${format(new Date(item.endDate), "dd MMM yyyy")}`}
</>
) : (
"-"
)}
</div>
<div className="w-2/5 text-xs text-gray-400 mt-0.5">
{item.startTime && item.endTime ? (
<>
{item.startTime.slice(0, 5)} {item.endTime.slice(0, 5)}
</>
) : item.startTime ? (
item.startTime.slice(0, 5)
) : (
""
)}
</div>
{/* Client */}
<div className="w-1/5">
<Badge
className={cn("text-white", {
"bg-red-600": item.type === "POLRI",
"bg-yellow-500": item.type === "DPR",
"bg-green-600": item.type === "KEJAKSAAN AGUNG",
"bg-blue-700": item.type === "BUMN",
"bg-amber-500": item.type === "MPR",
"bg-pink-500": item.type === "KPU",
"bg-red-700": item.type === "KPK",
})}
>
{item.type || "-"}
<Badge className="bg-[#C6A455] text-white">
{item.clientName || "-"}
</Badge>
</div>
<div className="w-2/5 text-sm">{item.title}</div>
<div className="w-1/3 text-sm text-muted-foreground">
{item.location}
</div>
{/* Judul & Lokasi */}
<div className="w-2/5">{item.title}</div>
<div className="w-1/3 text-muted-foreground">{item.location}</div>
</div>
))}
</div>

View File

@ -0,0 +1,409 @@
"use client";
import { useState, useEffect } from "react";
import { Button } from "@/components/ui/button";
import { Textarea } from "@/components/ui/textarea";
import { MessageCircle, Share2, Trash2 } from "lucide-react";
import { useRouter, useParams } from "next/navigation";
import {
getArticleDetail,
createArticleComment,
getArticleComments,
deleteArticleComment,
} from "@/service/content/content";
import { getCookiesDecrypt } from "@/lib/utils";
import Swal from "sweetalert2";
import withReactContent from "sweetalert2-react-content";
// 🎨 Avatar color helper
function getAvatarColor(name: string) {
const colors = [
"#F87171",
"#FB923C",
"#FACC15",
"#4ADE80",
"#60A5FA",
"#A78BFA",
"#F472B6",
];
const index = name.charCodeAt(0) % colors.length;
return colors[index];
}
export default function DetailCommentText() {
const [isLoggedIn, setIsLoggedIn] = useState(false);
const [currentUserId, setCurrentUserId] = useState<number | null>(null);
const [textArticle, setTextArticle] = useState<any>(null);
const [comments, setComments] = useState<any[]>([]);
const [newComment, setNewComment] = useState("");
const [replyParentId, setReplyParentId] = useState<number | null>(null);
const [replyMessage, setReplyMessage] = useState("");
const router = useRouter();
const params = useParams();
const MySwal = withReactContent(Swal);
const id = Number(params?.id);
// 🚀 Initial load
useEffect(() => {
checkLoginStatus();
if (id) {
fetchTextDetail(id);
fetchComments(id);
}
}, [id]);
// 🔐 Cek login user dari cookies
const checkLoginStatus = () => {
const userId = getCookiesDecrypt("urie");
if (userId) {
setIsLoggedIn(true);
setCurrentUserId(Number(userId));
} else {
setIsLoggedIn(false);
setCurrentUserId(null);
}
};
// 📄 Ambil detail artikel text
const fetchTextDetail = async (textId: number) => {
try {
const res = await getArticleDetail(textId);
if (res?.data?.data) setTextArticle(res.data.data);
} catch (error) {
console.error("Gagal memuat detail artikel:", error);
}
};
// 💬 Ambil komentar dari API
const fetchComments = async (textId: number) => {
try {
const res = await getArticleComments(textId);
if (res?.data?.data) {
const all = res.data.data.map((c: any) => ({
...c,
parentId: c.parentId ?? 0,
}));
const structured = buildCommentTree(all);
setComments(structured);
}
} catch (error) {
console.error("Gagal memuat komentar:", error);
}
};
// 🪄 Susun komentar menjadi struktur nested (tree)
const buildCommentTree: any = (comments: any[], parentId = 0) =>
comments
.filter((c) => c.parentId === parentId)
.map((c) => ({
...c,
replies: buildCommentTree(comments, c.id),
}));
// ✏️ Kirim komentar baru
const handlePostComment = async () => {
if (!newComment.trim()) {
MySwal.fire("Oops!", "Komentar tidak boleh kosong.", "warning");
return;
}
await sendComment({
articleId: id,
message: newComment,
isPublic: true,
parentId: 0,
});
setNewComment("");
};
// 💬 Kirim balasan komentar
const handleReplySubmit = async (parentId: number) => {
if (!replyMessage.trim()) {
MySwal.fire("Oops!", "Balasan tidak boleh kosong.", "warning");
return;
}
await sendComment({
articleId: id,
message: replyMessage,
isPublic: true,
parentId,
});
setReplyMessage("");
setReplyParentId(null);
};
// 🚀 Fungsi umum untuk kirim komentar / balasan
const sendComment = async (payload: any) => {
MySwal.fire({
title: "Mengirim komentar...",
didOpen: () => MySwal.showLoading(),
allowOutsideClick: false,
showConfirmButton: false,
});
try {
const res = await createArticleComment(payload);
if (res?.data?.success || !res?.error) {
MySwal.fire({
icon: "success",
title: "Komentar terkirim!",
timer: 1000,
showConfirmButton: false,
});
fetchComments(id);
} else {
MySwal.fire(
"Gagal",
res.message || "Tidak dapat mengirim komentar.",
"error"
);
}
} catch (error) {
console.error(error);
MySwal.fire("Error", "Terjadi kesalahan saat mengirim komentar.", "error");
}
};
// 🗑️ Hapus komentar
const handleDeleteComment = async (commentId: number) => {
const confirm = await MySwal.fire({
title: "Hapus komentar ini?",
text: "Tindakan ini tidak dapat dibatalkan!",
icon: "warning",
showCancelButton: true,
confirmButtonColor: "#d33",
cancelButtonColor: "#6b7280",
confirmButtonText: "Ya, hapus",
cancelButtonText: "Batal",
});
if (!confirm.isConfirmed) return;
MySwal.fire({
title: "Menghapus komentar...",
didOpen: () => MySwal.showLoading(),
allowOutsideClick: false,
showConfirmButton: false,
});
try {
const res = await deleteArticleComment(commentId);
if (res?.data?.success || !res?.error) {
MySwal.fire({
icon: "success",
title: "Komentar dihapus!",
timer: 1000,
showConfirmButton: false,
});
fetchComments(id);
} else {
MySwal.fire(
"Gagal",
res.message || "Tidak dapat menghapus komentar.",
"error"
);
}
} catch (error) {
console.error("Gagal menghapus komentar:", error);
MySwal.fire("Error", "Terjadi kesalahan saat menghapus komentar.", "error");
}
};
return (
<div className="max-w-5xl mx-auto p-4 space-y-6">
<button
onClick={() => router.back()}
className="text-sm text-gray-500 hover:underline cursor-pointer"
>
Kembali ke Artikel Teks
</button>
<div>
<p className="font-semibold text-sm uppercase text-gray-600 mb-1">
Comments on:
</p>
<h1 className="text-lg font-bold">
{textArticle?.title || "Memuat judul artikel..."}
</h1>
</div>
{/* ✏️ Form komentar */}
<div className="rounded-md p-3 space-y-3 bg-gray-50 border border-gray-200 shadow-sm">
{isLoggedIn ? (
<>
<Textarea
placeholder="Tulis komentar kamu di sini..."
className="min-h-[80px] border border-[#C6A455]"
value={newComment}
onChange={(e) => setNewComment(e.target.value)}
/>
<div className="flex justify-end">
<Button size="sm" onClick={handlePostComment}>
Kirim Komentar
</Button>
</div>
</>
) : (
<>
<Textarea
disabled
placeholder="Tulis komentar kamu di sini..."
className="min-h-[80px] opacity-70"
/>
<Button
onClick={() => router.push("/auth")}
className="w-full bg-blue-600 hover:bg-blue-700 text-white"
>
Sign in and Join the Conversation
</Button>
</>
)}
</div>
{/* 💬 Daftar komentar */}
<div className="space-y-6">
{comments.length > 0 ? (
comments.map((comment) => (
<CommentTree
key={comment.id}
comment={comment}
level={0}
replyParentId={replyParentId}
setReplyParentId={setReplyParentId}
replyMessage={replyMessage}
setReplyMessage={setReplyMessage}
onReplySubmit={handleReplySubmit}
onDelete={handleDeleteComment}
currentUserId={currentUserId}
/>
))
) : (
<p className="text-sm text-gray-500 text-center py-4">
Belum ada komentar.
</p>
)}
</div>
</div>
);
}
// 🧱 Komponen rekursif untuk komentar & balasan
function CommentTree({
comment,
level,
replyParentId,
setReplyParentId,
replyMessage,
setReplyMessage,
onReplySubmit,
onDelete,
currentUserId,
}: any) {
const color = getAvatarColor(comment.commentFromName || "Anonim");
const canDelete =
currentUserId &&
(comment.commentFromId == currentUserId ||
comment.userId == currentUserId ||
comment.createdBy == currentUserId);
return (
<div
className={`space-y-3 ${
level > 0 ? "ml-6 border-l-2 border-gray-200 pl-4" : ""
}`}
>
<div className="p-2 rounded-lg transition hover:bg-gray-50 bg-white">
<div className="flex items-start gap-2">
<div
className="w-8 h-8 rounded-full flex items-center justify-center text-white font-bold"
style={{ backgroundColor: color }}
>
{comment.commentFromName?.[0]?.toUpperCase() || "U"}
</div>
<div className="flex-1">
<p className="font-semibold text-sm">
{comment.commentFromName}{" "}
<span className="text-gray-500 text-xs font-normal">
{new Date(comment.createdAt).toLocaleString("id-ID")}
</span>
</p>
<p className="text-gray-800 text-sm leading-snug mt-1">
{comment.message}
</p>
<div className="flex items-center gap-3 mt-1 text-xs text-gray-600">
<button
onClick={() =>
setReplyParentId(
replyParentId === comment.id ? null : comment.id
)
}
className="hover:underline flex items-center gap-1"
>
<MessageCircle className="w-3 h-3" /> Reply
</button>
<button className="hover:underline flex items-center gap-1">
<Share2 className="w-3 h-3" /> Share
</button>
{canDelete && (
<button
onClick={() => onDelete(comment.id)}
className="flex items-center gap-1 px-2 py-1 text-xs bg-red-100 text-red-600 rounded-md hover:bg-red-200"
>
<Trash2 className="w-3 h-3" /> Delete
</button>
)}
</div>
</div>
</div>
{replyParentId === comment.id && (
<div className="mt-3 ml-10 space-y-2">
<Textarea
placeholder={`Balas komentar ${comment.commentFromName}`}
className="min-h-[60px] border border-[#C6A455]"
value={replyMessage}
onChange={(e) => setReplyMessage(e.target.value)}
/>
<div className="flex justify-end gap-2">
<Button
variant="outline"
size="sm"
onClick={() => setReplyParentId(null)}
>
Batal
</Button>
<Button
variant="outline"
size="sm"
onClick={() => onReplySubmit(comment.id)}
>
Kirim Balasan
</Button>
</div>
</div>
)}
</div>
{comment.replies && comment.replies.length > 0 && (
<div className="space-y-3">
{comment.replies.map((reply: any) => (
<CommentTree
key={reply.id}
comment={reply}
level={level + 1}
replyParentId={replyParentId}
setReplyParentId={setReplyParentId}
replyMessage={replyMessage}
setReplyMessage={setReplyMessage}
onReplySubmit={onReplySubmit}
onDelete={onDelete}
currentUserId={currentUserId}
/>
))}
</div>
)}
</div>
);
}

View File

@ -1,29 +1,218 @@
"use client";
import { useState } from "react";
import { useState, useEffect } from "react";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Textarea } from "@/components/ui/textarea";
import { MessageCircle, Share2, Trash2 } from "lucide-react";
import { useRouter, useParams } from "next/navigation";
import {
ChevronDown,
Flag,
MessageCircle,
Share2,
ThumbsUp,
} from "lucide-react";
import { useRouter } from "next/navigation";
getArticleDetail,
createArticleComment,
getArticleComments,
deleteArticleComment,
} from "@/service/content/content";
import { getCookiesDecrypt } from "@/lib/utils";
import Swal from "sweetalert2";
import withReactContent from "sweetalert2-react-content";
function getAvatarColor(name: string) {
const colors = [
"#F87171",
"#FB923C",
"#FACC15",
"#4ADE80",
"#60A5FA",
"#A78BFA",
"#F472B6",
];
const index = name.charCodeAt(0) % colors.length;
return colors[index];
}
export default function DetailCommentVideo() {
const [isLoggedIn, setIsLoggedIn] = useState(false);
const [currentUserId, setCurrentUserId] = useState<number | null>(null);
const [video, setVideo] = useState<any>(null);
const [comments, setComments] = useState<any[]>([]);
const [newComment, setNewComment] = useState("");
const [replyParentId, setReplyParentId] = useState<number | null>(null);
const [replyMessage, setReplyMessage] = useState("");
const router = useRouter();
const params = useParams();
const MySwal = withReactContent(Swal);
const id = Number(params?.id);
useEffect(() => {
checkLoginStatus();
if (id) {
fetchVideoDetail(id);
fetchComments(id);
}
}, [id]);
const checkLoginStatus = () => {
const userId = getCookiesDecrypt("urie");
if (userId) {
setIsLoggedIn(true);
setCurrentUserId(Number(userId));
} else {
setIsLoggedIn(false);
setCurrentUserId(null);
}
};
const fetchVideoDetail = async (videoId: number) => {
try {
const res = await getArticleDetail(videoId);
if (res?.data?.data) setVideo(res.data.data);
} catch (error) {
console.error("Gagal memuat video:", error);
}
};
const fetchComments = async (videoId: number) => {
try {
const res = await getArticleComments(videoId);
if (res?.data?.data) {
const all = res.data.data.map((c: any) => ({
...c,
parentId: c.parentId ?? 0,
}));
const structured = buildCommentTree(all);
setComments(structured);
}
} catch (error) {
console.error("Gagal memuat komentar:", error);
}
};
const buildCommentTree: any = (comments: any[], parentId = 0) =>
comments
.filter((c) => c.parentId === parentId)
.map((c) => ({
...c,
replies: buildCommentTree(comments, c.id),
}));
const handlePostComment = async () => {
if (!newComment.trim()) {
MySwal.fire("Oops!", "Komentar tidak boleh kosong.", "warning");
return;
}
await sendComment({
articleId: id,
message: newComment,
isPublic: true,
parentId: 0,
});
setNewComment("");
};
const handleReplySubmit = async (parentId: number) => {
if (!replyMessage.trim()) {
MySwal.fire("Oops!", "Balasan tidak boleh kosong.", "warning");
return;
}
await sendComment({
articleId: id,
message: replyMessage,
isPublic: true,
parentId,
});
setReplyMessage("");
setReplyParentId(null);
};
const sendComment = async (payload: any) => {
MySwal.fire({
title: "Mengirim komentar...",
didOpen: () => MySwal.showLoading(),
allowOutsideClick: false,
showConfirmButton: false,
});
try {
const res = await createArticleComment(payload);
if (res?.data?.success || !res?.error) {
MySwal.fire({
icon: "success",
title: "Komentar terkirim!",
timer: 1000,
showConfirmButton: false,
});
fetchComments(id);
} else {
MySwal.fire(
"Gagal",
res.message || "Tidak dapat mengirim komentar.",
"error"
);
}
} catch (error) {
console.error(error);
MySwal.fire(
"Error",
"Terjadi kesalahan saat mengirim komentar.",
"error"
);
}
};
const handleDeleteComment = async (commentId: number) => {
const confirm = await MySwal.fire({
title: "Hapus komentar ini?",
text: "Tindakan ini tidak dapat dibatalkan!",
icon: "warning",
showCancelButton: true,
confirmButtonColor: "#d33",
cancelButtonColor: "#6b7280",
confirmButtonText: "Ya, hapus",
cancelButtonText: "Batal",
});
if (!confirm.isConfirmed) return;
MySwal.fire({
title: "Menghapus komentar...",
didOpen: () => MySwal.showLoading(),
allowOutsideClick: false,
showConfirmButton: false,
});
try {
const res = await deleteArticleComment(commentId);
if (res?.data?.success || !res?.error) {
MySwal.fire({
icon: "success",
title: "Komentar dihapus!",
timer: 1000,
showConfirmButton: false,
});
fetchComments(id);
} else {
MySwal.fire(
"Gagal",
res.message || "Tidak dapat menghapus komentar.",
"error"
);
}
} catch (error) {
console.error("Gagal menghapus komentar:", error);
MySwal.fire(
"Error",
"Terjadi kesalahan saat menghapus komentar.",
"error"
);
}
};
return (
<div className="max-w-5xl mx-auto p-4 space-y-6">
<button
onClick={() => router.back()}
className="text-sm text-gray-500 hover:underline"
className="text-sm text-gray-500 hover:underline cursor-pointer"
>
Kembali ke Article
Kembali ke Video
</button>
<div>
@ -31,143 +220,360 @@ export default function DetailCommentVideo() {
Comments on:
</p>
<h1 className="text-lg font-bold">
Kolaborasi dengan Ponpes Darunnajah, Pererat Sinergi Keamanan Hingga
Pembinaan Generasi Muda
{video?.title || "Memuat judul video..."}
</h1>
</div>
{/* Comment Form */}
<div className=" rounded-md p-3 space-y-3">
<div className="rounded-md p-3 space-y-3 bg-gray-50 border border-gray-200 shadow-sm">
{isLoggedIn ? (
<>
<Textarea
placeholder="Post a comment"
placeholder="Tulis komentar kamu di sini..."
className="min-h-[80px] border border-[#C6A455]"
value={newComment}
onChange={(e) => setNewComment(e.target.value)}
/>
<div className="flex justify-end">
<Button size="sm">Post</Button>
<Button size="sm" onClick={handlePostComment}>
Kirim Komentar
</Button>
</div>
</>
) : (
<>
<Textarea
disabled
placeholder="Post a comment"
placeholder="Tulis komentar kamu di sini..."
className="min-h-[80px] opacity-70"
/>
<Button className="w-full bg-blue-600 hover:bg-blue-700 text-white">
<Button
onClick={() => router.push("/auth")}
className="w-full bg-blue-600 hover:bg-blue-700 text-white"
>
Sign in and Join the Conversation
</Button>
</>
)}
</div>
{/* Sort & Comment Count */}
<div className="flex items-center justify-between border-b pb-2">
<p className="font-semibold">
All Comments{" "}
<span className="text-sm font-medium text-gray-500">4</span>
</p>
<div className="flex items-center gap-1 text-sm text-gray-600">
Sort by
<button className="flex items-center gap-1 border border-[#C6A455] px-2 py-1 rounded text-gray-700 hover:bg-gray-100">
Newest <ChevronDown className="w-4 h-4" />
</button>
</div>
</div>
{/* Comments List */}
{/* Daftar komentar */}
<div className="space-y-6">
<CommentItem
name="Mabes Ferr"
content="Lorem ipsum dolor sit amet consectetur. Adipiscing ut mi pretium elementum est. Euismod integer praesent lacus praesent lobortis. Eleifend."
time="2 hours ago"
/>
<CommentItem
name="Mabes Jerr"
content="Lorem ipsum dolor sit amet consectetur. Adipiscing ut mi pretium elementum est. Euismod integer praesent lacus praesent lobortis. Eleifend."
time="2 hours ago"
replies={[
{
name: "Mabes Herr",
time: "2 hours ago",
inReplyTo: "Mabes Jerr",
content:
"Lorem ipsum dolor sit amet consectetur. Adipiscing ut mi pretium elementum est. Euismod integer praesent lacus praesent lobortis. Eleifend.",
},
]}
/>
{comments.length > 0 ? (
comments.map((comment) => (
<CommentTree
key={comment.id}
comment={comment}
level={0}
replyParentId={replyParentId}
setReplyParentId={setReplyParentId}
replyMessage={replyMessage}
setReplyMessage={setReplyMessage}
onReplySubmit={handleReplySubmit}
onDelete={handleDeleteComment}
currentUserId={currentUserId}
/>
))
) : (
<p className="text-sm text-gray-500 text-center py-4">
Belum ada komentar.
</p>
)}
</div>
</div>
);
}
type Comment = {
name: string;
time: string;
content: string;
inReplyTo?: string;
};
function CommentTree({
comment,
level,
replyParentId,
setReplyParentId,
replyMessage,
setReplyMessage,
onReplySubmit,
onDelete,
currentUserId,
}: any) {
const color = getAvatarColor(comment.commentFromName || "Anonim");
const canDelete =
currentUserId &&
(comment.commentFromId == currentUserId ||
comment.userId == currentUserId ||
comment.createdBy == currentUserId);
function CommentItem({
name,
time,
content,
replies,
}: Comment & { replies?: Comment[] }) {
return (
<div className="space-y-3">
<div>
<p className="font-semibold">
{name}{" "}
<span className="text-gray-500 text-sm font-normal">{time}</span>
</p>
<p className="text-gray-800 text-sm">{content}</p>
<div className="flex items-center gap-4 mt-2 text-sm text-gray-600">
<ThumbsUp className="w-4 h-4 cursor-pointer" />
<button className="hover:underline flex items-center gap-1">
<MessageCircle className="w-4 h-4" /> Reply
</button>
<button className="hover:underline flex items-center gap-1">
<Share2 className="w-4 h-4" /> Share
</button>
<button className="ml-auto hover:underline text-gray-400 text-xs flex items-center gap-1">
<Flag className="w-3 h-3" /> Report
</button>
<div
className={`space-y-3 ${
level > 0 ? "ml-6 border-l-2 border-gray-200 pl-4" : ""
}`}
>
<div className="p-2 rounded-lg transition hover:bg-gray-50 bg-white">
<div className="flex items-start gap-2">
<div
className="w-8 h-8 rounded-full flex items-center justify-center text-white font-bold"
style={{ backgroundColor: color }}
>
{comment.commentFromName?.[0]?.toUpperCase() || "U"}
</div>
<div className="flex-1">
<p className="font-semibold text-sm">
{comment.commentFromName}{" "}
<span className="text-gray-500 text-xs font-normal">
{new Date(comment.createdAt).toLocaleString("id-ID")}
</span>
</p>
<p className="text-gray-800 text-sm leading-snug mt-1">
{comment.message}
</p>
<div className="flex items-center gap-3 mt-1 text-xs text-gray-600">
<button
onClick={() =>
setReplyParentId(
replyParentId === comment.id ? null : comment.id
)
}
className="hover:underline flex items-center gap-1"
>
<MessageCircle className="w-3 h-3" /> Reply
</button>
<button className="hover:underline flex items-center gap-1">
<Share2 className="w-3 h-3" /> Share
</button>
{canDelete && (
<button
onClick={() => onDelete(comment.id)}
className="flex items-center gap-1 px-2 py-1 text-xs bg-red-100 text-red-600 rounded-md hover:bg-red-200"
>
<Trash2 className="w-3 h-3" /> Delete
</button>
)}
</div>
</div>
</div>
{replyParentId === comment.id && (
<div className="mt-3 ml-10 space-y-2">
<Textarea
placeholder={`Balas komentar ${comment.commentFromName}`}
className="min-h-[60px] border border-[#C6A455]"
value={replyMessage}
onChange={(e) => setReplyMessage(e.target.value)}
/>
<div className="flex justify-end gap-2">
<Button
variant="outline"
size="sm"
onClick={() => setReplyParentId(null)}
>
Batal
</Button>
<Button
variant="outline"
size="sm"
onClick={() => onReplySubmit(comment.id)}
>
Kirim Balasan
</Button>
</div>
</div>
)}
</div>
{replies && replies.length > 0 && (
<div className="ml-6 border-l pl-4 space-y-3">
{replies.map((reply, idx) => (
<div key={idx}>
<p className="font-semibold">
{reply.name}{" "}
<span className="text-gray-500 text-sm font-normal">
{reply.time}
</span>
</p>
<p className="text-xs text-gray-500">
In Reply To {reply.inReplyTo}
</p>
<p className="text-gray-800 text-sm">{reply.content}</p>
<div className="flex items-center gap-4 mt-2 text-sm text-gray-600">
<ThumbsUp className="w-4 h-4 cursor-pointer" />
<button className="hover:underline flex items-center gap-1">
<MessageCircle className="w-4 h-4" /> Reply
</button>
<button className="hover:underline flex items-center gap-1">
<Share2 className="w-4 h-4" /> Share
</button>
<button className="ml-auto hover:underline text-gray-400 text-xs flex items-center gap-1">
<Flag className="w-3 h-3" /> Report
</button>
</div>
</div>
{comment.replies && comment.replies.length > 0 && (
<div className="space-y-3">
{comment.replies.map((reply: any) => (
<CommentTree
key={reply.id}
comment={reply}
level={level + 1}
replyParentId={replyParentId}
setReplyParentId={setReplyParentId}
replyMessage={replyMessage}
setReplyMessage={setReplyMessage}
onReplySubmit={onReplySubmit}
onDelete={onDelete}
currentUserId={currentUserId}
/>
))}
</div>
)}
</div>
);
}
// "use client";
// import { useState } from "react";
// import { Button } from "@/components/ui/button";
// import { Input } from "@/components/ui/input";
// import { Textarea } from "@/components/ui/textarea";
// import {
// ChevronDown,
// Flag,
// MessageCircle,
// Share2,
// ThumbsUp,
// } from "lucide-react";
// import { useRouter } from "next/navigation";
// export default function DetailCommentVideo() {
// const [isLoggedIn, setIsLoggedIn] = useState(false);
// const router = useRouter();
// return (
// <div className="max-w-5xl mx-auto p-4 space-y-6">
// <button
// onClick={() => router.back()}
// className="text-sm text-gray-500 hover:underline"
// >
// ← Kembali ke Article
// </button>
// <div>
// <p className="font-semibold text-sm uppercase text-gray-600 mb-1">
// Comments on:
// </p>
// <h1 className="text-lg font-bold">
// Kolaborasi dengan Ponpes Darunnajah, Pererat Sinergi Keamanan Hingga
// Pembinaan Generasi Muda
// </h1>
// </div>
// {/* Comment Form */}
// <div className=" rounded-md p-3 space-y-3">
// {isLoggedIn ? (
// <>
// <Textarea
// placeholder="Post a comment"
// className="min-h-[80px] border border-[#C6A455]"
// />
// <div className="flex justify-end">
// <Button size="sm">Post</Button>
// </div>
// </>
// ) : (
// <>
// <Textarea
// disabled
// placeholder="Post a comment"
// className="min-h-[80px] opacity-70"
// />
// <Button className="w-full bg-blue-600 hover:bg-blue-700 text-white">
// Sign in and Join the Conversation
// </Button>
// </>
// )}
// </div>
// {/* Sort & Comment Count */}
// <div className="flex items-center justify-between border-b pb-2">
// <p className="font-semibold">
// All Comments{" "}
// <span className="text-sm font-medium text-gray-500">4</span>
// </p>
// <div className="flex items-center gap-1 text-sm text-gray-600">
// Sort by
// <button className="flex items-center gap-1 border border-[#C6A455] px-2 py-1 rounded text-gray-700 hover:bg-gray-100">
// Newest <ChevronDown className="w-4 h-4" />
// </button>
// </div>
// </div>
// {/* Comments List */}
// <div className="space-y-6">
// <CommentItem
// name="Mabes Ferr"
// content="Lorem ipsum dolor sit amet consectetur. Adipiscing ut mi pretium elementum est. Euismod integer praesent lacus praesent lobortis. Eleifend."
// time="2 hours ago"
// />
// <CommentItem
// name="Mabes Jerr"
// content="Lorem ipsum dolor sit amet consectetur. Adipiscing ut mi pretium elementum est. Euismod integer praesent lacus praesent lobortis. Eleifend."
// time="2 hours ago"
// replies={[
// {
// name: "Mabes Herr",
// time: "2 hours ago",
// inReplyTo: "Mabes Jerr",
// content:
// "Lorem ipsum dolor sit amet consectetur. Adipiscing ut mi pretium elementum est. Euismod integer praesent lacus praesent lobortis. Eleifend.",
// },
// ]}
// />
// </div>
// </div>
// );
// }
// type Comment = {
// name: string;
// time: string;
// content: string;
// inReplyTo?: string;
// };
// function CommentItem({
// name,
// time,
// content,
// replies,
// }: Comment & { replies?: Comment[] }) {
// return (
// <div className="space-y-3">
// <div>
// <p className="font-semibold">
// {name}{" "}
// <span className="text-gray-500 text-sm font-normal">{time}</span>
// </p>
// <p className="text-gray-800 text-sm">{content}</p>
// <div className="flex items-center gap-4 mt-2 text-sm text-gray-600">
// <ThumbsUp className="w-4 h-4 cursor-pointer" />
// <button className="hover:underline flex items-center gap-1">
// <MessageCircle className="w-4 h-4" /> Reply
// </button>
// <button className="hover:underline flex items-center gap-1">
// <Share2 className="w-4 h-4" /> Share
// </button>
// <button className="ml-auto hover:underline text-gray-400 text-xs flex items-center gap-1">
// <Flag className="w-3 h-3" /> Report
// </button>
// </div>
// </div>
// {replies && replies.length > 0 && (
// <div className="ml-6 border-l pl-4 space-y-3">
// {replies.map((reply, idx) => (
// <div key={idx}>
// <p className="font-semibold">
// {reply.name}{" "}
// <span className="text-gray-500 text-sm font-normal">
// {reply.time}
// </span>
// </p>
// <p className="text-xs text-gray-500">
// In Reply To {reply.inReplyTo}
// </p>
// <p className="text-gray-800 text-sm">{reply.content}</p>
// <div className="flex items-center gap-4 mt-2 text-sm text-gray-600">
// <ThumbsUp className="w-4 h-4 cursor-pointer" />
// <button className="hover:underline flex items-center gap-1">
// <MessageCircle className="w-4 h-4" /> Reply
// </button>
// <button className="hover:underline flex items-center gap-1">
// <Share2 className="w-4 h-4" /> Share
// </button>
// <button className="ml-auto hover:underline text-gray-400 text-xs flex items-center gap-1">
// <Flag className="w-3 h-3" /> Report
// </button>
// </div>
// </div>
// ))}
// </div>
// )}
// </div>
// );
// }

View File

@ -274,7 +274,7 @@ export default function DocumentDetail({ id }: { id: number }) {
)}
</div>
<div className="flex gap-2 items-center">
<Link href={`/content/video/comment/${id}`}>
<Link href={`/content/text/comment/${id}`}>
<Button
variant="default"
size="lg"

View File

@ -113,7 +113,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
icon: "uil:schedule",
submenus: [
{
href: "/contributor/schedule",
href: "/admin/schedule",
label: t("schedule"),
active: pathname.includes("/schedule"),
icon: "heroicons:arrow-trending-up",

View File

@ -86,7 +86,6 @@ export async function httpGetInterceptor(pathUrl: any) {
}
}
// 🔹 Tambahkan return default biar tidak undefined
return {
error: true,
message: response?.data?.message || response?.data || "Unknown error",

View File

@ -281,20 +281,16 @@ export async function getAllSchedules(params?: {
sortBy?: string;
totalPage?: number;
}) {
// base endpoint dari swagger
let url = "schedules?";
// tambahkan semua query parameter yang memiliki nilai
Object.entries(params || {}).forEach(([key, value]) => {
if (value !== undefined && value !== null && value !== "") {
url += `${key}=${encodeURIComponent(String(value))}&`;
}
});
// hapus '&' terakhir jika ada
url = url.endsWith("&") ? url.slice(0, -1) : url;
// gunakan interceptor kamu untuk GET
return httpGetInterceptor(url);
}