update

app/(admin)/admin/agent/page.tsx

@@ -41,7 +41,7 @@ export default function AgentPage() {
           </div>
 
           <div className="dark:bg-[#18181b] rounded-xl p-3">
-            {userLevelId !== "3" && (
+            {userLevelId !== "1" && (
               <Link href={"/admin/agent/create"}>
                 <Button className="bg-[#1F6779] text-white w-full lg:w-fit hover:bg-[#1a9bb5] flex items-center gap-2">
                   <Plus className="h-4 w-4" />

app/(admin)/admin/banner/page.tsx

@@ -58,7 +58,7 @@ export default function BasicPage() {
           </div>
 
           <div className="dark:bg-[#18181b] rounded-xl p-3">
-            {userLevelId !== "3" && (
+            {userLevelId !== "1" && (
               <Button
                 className="bg-[#1F6779] text-white w-full lg:w-fit hover:bg-[#1a9bb5] flex items-center gap-2"
                 onClick={() => setOpenDialog(true)}

app/(admin)/admin/galery/page.tsx

@@ -39,7 +39,7 @@ export default function GaleryPage() {
           </div>
 
           <div className="dark:bg-[#18181b] rounded-xl p-3">
-            {userLevelId !== "3" && (
+            {userLevelId !== "1" && (
               <Button
                 className="bg-[#1F6779] text-white w-full lg:w-fit hover:bg-[#1a9bb5] flex items-center gap-2"
                 onClick={() => setOpenDialog(true)}

app/(admin)/admin/product/page.tsx

@@ -40,7 +40,7 @@ export default function ProductPage() {
           </div>
 
           <div className="dark:bg-[#18181b] rounded-xl p-3">
-            {userLevelId !== "3" && (
+            {userLevelId !== "1" && (
               <Link href={"/admin/product/create"}>
                 <Button className="bg-[#1F6779] text-white w-full lg:w-fit hover:bg-[#1a9bb5] flex items-center gap-2">
                   <Plus className="h-4 w-4" />

app/(admin)/admin/promotion/page.tsx

@@ -43,7 +43,7 @@ export default function PromotionPage() {
           </div>
 
           <div className="dark:bg-[#18181b] rounded-xl p-3">
-            {userLevelId !== "3" && (
+            {userLevelId !== "1" && (
               <Link href={"/admin/promotion/create"}>
                 <Button className="bg-[#1F6779] text-white w-full lg:w-fit hover:bg-[#1a9bb5] flex items-center gap-2">
                   <Plus className="h-4 w-4" />

components/form/banner-dialog.tsx

@@ -63,7 +63,7 @@ export function BannerDialog({
     formData.append("title", title);
     formData.append("position", selectedOrder.toString());
     formData.append("description", "hardcode description dulu");
-    formData.append("status", "active");
+    formData.append("status", "1");
     formData.append("thumbnail_path", "path-hardcode.png");
     formData.append("file", file);
 
@@ -152,7 +152,7 @@ export function BannerDialog({
                     "border rounded-lg py-2 flex flex-col items-center justify-center text-sm font-medium transition",
                     selectedOrder === opt.id
                       ? "bg-[#1F6779]/20 border-[#1F6779] text-[#1F6779]"
-                      : "bg-white border-gray-300 text-gray-600 hover:border-[#1F6779]/50"
+                      : "bg-white border-gray-300 text-gray-600 hover:border-[#1F6779]/50",
                   )}
                 >
                   {selectedOrder === opt.id && (

components/form/product/create-product-form.tsx

@@ -55,6 +55,7 @@ export default function AddProductForm() {
 
       formData.append("title", data.name);
       formData.append("variant", data.variant);
+      formData.append("is_active", "1");
       formData.append("price", data.price.toString());
       // if (data.banner && data.banner.length > 0) {
       //   formData.append("thumbnail_path", data.banner[0]);

components/table/article-table.tsx

@@ -47,7 +47,7 @@ import {
 import CustomPagination from "../layout/custom-pagination";
 import { EditBannerDialog } from "../form/banner-edit-dialog";
 import { deleteBanner, getBannerData, updateBanner } from "@/service/banner";
-import { CheckCheck, Eye } from "lucide-react";
+import { Check, CheckCheck, Clock, Eye, X } from "lucide-react";
 import { useRouter } from "next/navigation";
 
 const columns = [
@@ -219,6 +219,46 @@ export default function ArticleTable() {
     await updateBanner(formData, id);
   };
 
+  const handleApprove = async () => {
+    if (!viewBanner) return;
+
+    loading();
+    const formData = new FormData();
+    formData.append("status", "2"); // APPROVED
+
+    const res = await updateBanner(formData, viewBanner.id);
+
+    if (res?.error) {
+      error(res.message);
+      return;
+    }
+
+    close();
+    success("Banner berhasil disetujui");
+    setOpenViewDialog(false);
+    initState(); // refresh table
+  };
+
+  const handleReject = async () => {
+    if (!viewBanner) return;
+
+    loading();
+    const formData = new FormData();
+    formData.append("status", "3"); // REJECTED
+
+    const res = await updateBanner(formData, viewBanner.id);
+
+    if (res?.error) {
+      error(res.message);
+      return;
+    }
+
+    close();
+    success("Banner berhasil ditolak");
+    setOpenViewDialog(false);
+    initState(); // refresh table
+  };
+
   const handlePreview = (imgUrl: string) => {
     setPreviewImage(imgUrl);
     setOpenPreview(true);
@@ -423,19 +463,23 @@ export default function ArticleTable() {
 
                     {/* STATUS */}
                     <TableCell className="text-center">
-                      {/* {item.status === "Disetujui" ? (
+                      {item.status === "1" ? (
-                        <span className="bg-green-100 text-green-700 text-xs px-3 py-1 rounded-full font-medium">
-                          Disetujui
-                        </span>
-                      ) : item.status === "Menunggu" ? ( */}
                         <span className="bg-yellow-100 text-yellow-700 text-xs px-3 py-1 rounded-full font-medium">
                           Menunggu
                         </span>
-                      {/* ) : (
+                      ) : item.status === "2" ? (
-                        <span className="bg-red-100 text-red-700 text-xs px-3 py-1 rounded-full font-medium">
+                        <span className="bg-green-100 text-green-700 text-xs px-3 py-1 rounded-full font-medium">
-                          Ditolak
+                          Disetujui
                         </span>
-                      )} */}
+                      ) : item.status === "3" ? (
+                        <span className="bg-red-100 text-red-700 text-xs px-3 py-1 rounded-full font-medium">
+                          Canceled
+                        </span>
+                      ) : (
+                        <span className="bg-gray-100 text-gray-600 text-xs px-3 py-1 rounded-full font-medium">
+                          Tidak Diketahui
+                        </span>
+                      )}
                     </TableCell>
 
                     {/* AKSI */}
@@ -602,16 +646,23 @@ export default function ArticleTable() {
               {/* Badge */}
               <div className="flex items-center gap-2 mt-3">
                 <span
-                  className={`text-xs font-medium px-3 py-1 rounded-full
+                  className={`text-xs font-medium px-3 py-1 rounded-full ${
-              ${
+                    viewBanner.status === "1"
-                viewBanner.status === "Menunggu"
                       ? "bg-yellow-100 text-yellow-800"
-                  : viewBanner.status === "Disetujui"
+                      : viewBanner.status === "2"
                         ? "bg-green-100 text-green-800"
-                    : "bg-red-100 text-red-800"
+                        : viewBanner.status === "3"
+                          ? "bg-red-100 text-red-800"
+                          : "bg-gray-100 text-gray-800"
                   }`}
                 >
-                  {viewBanner.status}
+                  {viewBanner.status === "1"
+                    ? "Menunggu"
+                    : viewBanner.status === "2"
+                      ? "Disetujui"
+                      : viewBanner.status === "3"
+                        ? "Reject"
+                        : "Tidak Diketahui"}
                 </span>
 
                 <span className="bg-white text-[#0F6C75] text-xs font-medium px-3 py-1 rounded-full">
@@ -665,11 +716,11 @@ export default function ArticleTable() {
                 <div className="space-y-4">
                   <div className="flex gap-3">
                     <div className="w-6 h-6 rounded-full bg-green-100 flex items-center justify-center">
-                      <CheckCheck className="w-4 h-4 text-green-600" />
+                      <Check className="w-4 h-4 text-green-600" />
                     </div>
                     <div>
                       <p className="font-medium text-gray-800">
-                        Diupload oleh {viewBanner.createdByName}
+                        Diupload oleh Operator
                       </p>
                       <p className="text-sm text-gray-500">
                         {convertDateFormat(viewBanner.created_at)} WIB
@@ -678,25 +729,51 @@ export default function ArticleTable() {
                   </div>
 
                   <div className="flex gap-3">
-                    <div className="w-6 h-6 rounded-full bg-yellow-100 flex items-center justify-center">
+                    <div
-                      ⏳
+                      className={`w-6 h-6 rounded-full flex items-center justify-center ${
+                        viewBanner.status === "1"
+                          ? "bg-yellow-100"
+                          : viewBanner.status === "2"
+                            ? "bg-green-100"
+                            : "bg-red-100"
+                      }`}
+                    >
+                      {viewBanner.status === "1" ? (
+                        <Clock className="w-4 h-4 text-yellow-700" />
+                      ) : viewBanner.status === "2" ? (
+                        <Check className="w-4 h-4 text-green-600" />
+                      ) : (
+                        <X className="w-4 h-4 text-red-700" />
+                      )}
                     </div>
+
                     <div>
                       <p className="font-medium text-gray-800">
-                        Menunggu disetujui oleh Approver
+                        {viewBanner.status === "1"
+                          ? "Menunggu disetujui oleh Approver"
+                          : viewBanner.status === "2"
+                            ? "Disetujui oleh Approver"
+                            : "Ditolak oleh Approver"}
                       </p>
+
                       <p className="text-sm text-gray-500">
                         {convertDateFormat(viewBanner.updated_at)} WIB
                       </p>
                     </div>
                   </div>
 
+                  <div className="border rounded-lg px-3 py-3">
+                    <p>Comment : </p>
+                    <div className="flex flex-row justify-between">
                       <button
                         onClick={handleOpenApproverHistory}
                         className="text-sm text-blue-600 hover:underline mt-2"
                       >
                         View Approver History
                       </button>
+                      <p>Jaecoo - Approver | 10/11/2026</p>
+                    </div>
+                  </div>
                 </div>
               </div>
             </div>
@@ -704,6 +781,8 @@ export default function ArticleTable() {
             {/* FOOTER */}
             {userLevelId !== "2" && (
               <div className="flex justify-between items-center gap-3 px-6 py-4 border-t bg-[#F2F7FA]">
+                {viewBanner.status === "1" ? (
+                  <>
                     <Button
                       variant="secondary"
                       className="bg-blue-200 hover:bg-blue-400"
@@ -715,12 +794,39 @@ export default function ArticleTable() {
                       Beri Tanggapan
                     </Button>
 
-                <Button variant="destructive" className="w-[180]">
+                    <Button
+                      variant="destructive"
+                      className="w-[180]"
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        handleReject();
+                      }}
+                    >
                       Reject
                     </Button>
-                <Button className="bg-green-600 hover:bg-green-700 text-white w-[180]">
+
+                    <Button
+                      className="bg-green-600 hover:bg-green-700 text-white w-[180]"
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        handleApprove();
+                      }}
+                    >
                       Approved
                     </Button>
+                  </>
+                ) : (
+                  <Button
+                    variant="secondary"
+                    className="mx-auto"
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      setOpenViewDialog(false);
+                    }}
+                  >
+                    Tutup
+                  </Button>
+                )}
               </div>
             )}
           </div>