fix:button approve, colors

components/dialog/promo-dialog.tsx

@@ -48,10 +48,14 @@ export default function PromoDetailDialog({
 
   const router = useRouter();
 
+  const [userRoleId, setUserRoleId] = useState<string | null>(null);
+
+  const MySwal = withReactContent(Swal);
+
   // 🔹 Ambil userlevelId dari cookies
   useEffect(() => {
-    const ulne = Cookies.get("ulne"); // contoh: "3"
+    const urie = Cookies.get("urie"); // contoh: "3"
-    setUserLevelId(ulne ?? null);
+    setUserRoleId(urie ?? null);
   }, []);
 
   // FORMAT TANGGAL → DD-MM-YYYY
@@ -325,7 +329,7 @@ export default function PromoDetailDialog({
               <p className="text-center text-gray-600">Data tidak ditemukan</p>
             )}
           </div>
-          {userLevelId !== "2" && promo && (
+          {userRoleId !== "2" && promo && (
             <div className="flex justify-between items-center gap-3 px-6 py-4 border-t bg-[#F2F7FA]">
               {promo.status_id === 1 ? (
                 <>
@@ -351,7 +355,7 @@ export default function PromoDetailDialog({
                     Reject
                   </Button>
 
-                  {userLevelId === "1" && (
+                  {userRoleId === "1" && (
                     <Button
                       // variant="ghost"
                       size="sm"

components/form/agent/detail-agent-form.tsx

@@ -101,7 +101,7 @@ export default function DetailAgentForm(props: { isDetail: boolean }) {
   const id = params?.id;
   const [data, setData] = useState<any>(null);
   const [openApproverHistory, setOpenApproverHistory] = useState(false);
-  const [userLevelId, setUserLevelId] = useState<string | null>(null);
+
   const router = useRouter();
 
   const [openCommentModal, setOpenCommentModal] = useState(false);
@@ -115,11 +115,17 @@ export default function DetailAgentForm(props: { isDetail: boolean }) {
     setOpenCommentModal(false);
   };
 
+  // 🔹 Ambil userlevelId dari cookies
+  const [userRoleId, setUserRoleId] = useState<string | null>(null);
+
+  const MySwal = withReactContent(Swal);
+
   // 🔹 Ambil userlevelId dari cookies
   useEffect(() => {
-    const ulne = Cookies.get("ulne"); // contoh: "3"
+    const urie = Cookies.get("urie"); // contoh: "3"
-    setUserLevelId(ulne ?? null);
+    setUserRoleId(urie ?? null);
   }, []);
+
   useEffect(() => {
     fetchData();
   }, []);
@@ -313,7 +319,7 @@ export default function DetailAgentForm(props: { isDetail: boolean }) {
               <p>Jaecoo - Approver | 10/11/2026</p>
             </div>
           </div>
-          {userLevelId !== "2" && data && (
+          {userRoleId !== "2" && data && (
             <div className="flex justify-between items-center gap-3 px-6 py-4 border-t bg-[#F2F7FA] mt-10">
               {data.status_id === 1 ? (
                 <>
@@ -333,7 +339,7 @@ export default function DetailAgentForm(props: { isDetail: boolean }) {
                     Reject
                   </Button>
 
-                  {userLevelId === "1" && (
+                  {userRoleId === "1" && (
                     <Button
                       className="bg-green-600 hover:bg-green-700 text-white w-[180px]"
                       onClick={() => handleApproveAgent(data.id)}

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

@@ -24,7 +24,10 @@ const formSchema = z.object({
 });
 
 export default function AddProductForm() {
-  const [colors, setColors] = useState([{ id: 1 }]);
+  const [colors, setColors] = useState<
+    { id: number; name: string; file: File | null }[]
+  >([{ id: 1, name: "", file: null }]);
+
   const [selectedColor, setSelectedColor] = useState<string | null>(null);
   const [specs, setSpecs] = useState([{ id: 1 }]);
   const [file, setFile] = useState<File | null>(null);
@@ -55,24 +58,32 @@ export default function AddProductForm() {
 
       formData.append("title", data.name);
       formData.append("variant", data.variant);
-      formData.append("is_active", "1");
-      formData.append("status", "1");
       formData.append("price", data.price.toString());
-      // if (data.banner && data.banner.length > 0) {
+      formData.append("status", "1");
-      //   formData.append("thumbnail_path", data.banner[0]);
+      formData.append("is_active", "1");
-      // }
+
+      // banner
       if (file) {
         formData.append("file", file);
       }
-      const colorsArray = colors.map((c) => selectedColor || "");
-      formData.append("colors", JSON.stringify(colorsArray));
 
-      const res = await createProduct(formData);
+      // 🔥 colors JSON (object)
+      const colorsPayload = colors.map((c) => ({
+        name: c.name,
+      }));
+      formData.append("colors", JSON.stringify(colorsPayload));
 
-      console.log("API Success:", res);
+      // 🔥 color images
+      colors.forEach((c, index) => {
+        if (c.file) {
+          formData.append(`color_images[${index}]`, c.file);
+        }
+      });
+
+      await createProduct(formData);
       successSubmit("/admin/product");
-    } catch (error) {
+    } catch (err) {
-      console.error("Submit Error:", error);
+      console.error(err);
       alert("Gagal mengirim produk");
     }
   };
@@ -97,7 +108,20 @@ export default function AddProductForm() {
   };
 
   const handleAddColor = () => {
-    setColors((prev) => [...prev, { id: prev.length + 1 }]);
+    setColors((prev) => [
+      ...prev,
+      { id: prev.length + 1, name: "", file: null },
+    ]);
+  };
+
+  const handleColorFileChange = (
+    index: number,
+    e: React.ChangeEvent<HTMLInputElement>,
+  ) => {
+    const file = e.target.files?.[0] || null;
+    const updated = [...colors];
+    updated[index].file = file;
+    setColors(updated);
   };
 
   const formatRupiah = (value: string) => {
@@ -228,19 +252,29 @@ export default function AddProductForm() {
 
                 {/* Upload Foto Warna */}
                 <div>
-                  <Label>Foto Warna {index + 1}</Label>
+                  <label
-                  <div className="border-2 border-dashed rounded-lg flex flex-col items-center justify-center py-6 cursor-pointer hover:bg-gray-50 transition">
+                    htmlFor={`color-file-${index}`}
+                    className="border-2 border-dashed rounded-lg flex flex-col items-center justify-center py-6 cursor-pointer hover:bg-gray-50 transition"
+                  >
                     <Upload className="w-6 h-6 text-gray-400 mb-2" />
                     <p className="text-sm text-gray-500 text-center">
                       Klik untuk upload foto mobil warna ini
                     </p>
                     <p className="text-xs text-gray-400">PNG, JPG (max 5 MB)</p>
+
                     <input
+                      id={`color-file-${index}`}
                       type="file"
                       accept="image/png,image/jpeg"
                       className="hidden"
+                      onChange={(e) => handleColorFileChange(index, e)}
                     />
-                  </div>
+                  </label>
+                  {color.file && (
+                    <p className="text-xs text-teal-700 mt-2">
+                      {color.file.name}
+                    </p>
+                  )}
                 </div>
               </div>
             ))}