fix: signUp

components/form/sign-up.tsx

@@ -9,11 +9,9 @@ import { Input } from "../ui/input";
 import { Button } from "../ui/button";
 import { Label } from "../ui/label";
 import { RadioGroup, RadioGroupItem } from "../ui/radio-group";
-import { registerTenant } from "@/service/auth";
 
 // ✅ import services
 import { requestOTP, createUser } from "@/service/auth";
-import { EyeFilledIcon, EyeSlashFilledIcon } from "../icons";
 
 export default function SignUp() {
   const router = useRouter();
@@ -23,32 +21,14 @@ export default function SignUp() {
   const [role, setRole] = useState("umum");
   const [email, setEmail] = useState("");
   const [otp, setOtp] = useState(["", "", "", "", "", ""]);
-  const [membership, setMembership] = useState("");
+
-  const [certNumber, setCertNumber] = useState("");
+  // role-specific
   const [membershipType, setMembershipType] = useState("");
-  const [nrp, setNrp] = useState("");
+  const [certNumber, setCertNumber] = useState("");
+  const [namaTenant, setNamaTenant] = useState("");
+  const [namaPerusahaan, setNamaPerusahaan] = useState("");
   const [firstName, setFirstName] = useState("");
   const [lastName, setLastName] = useState("");
-  const [whatsapp, setWhatsapp] = useState("");
-  const [namaTenant, setNamaTenant] = useState("");
-  const [tenantPassword, setTenantPassword] = useState("");
-  const [confirmTenantPassword, setConfirmTenantPassword] = useState("");
-  const [firstNameKontributor, setFirstNameKontributor] = useState("");
-  const [lastNameKontributor, setLastNameKontributor] = useState("");
-  const [whatsappKontributor, setWhatsappKontributor] = useState("");
-  const [namaPerusahaan, setNamaPerusahaan] = useState("");
-  const [kategoriPerusahaan, setKategoriPerusahaan] = useState("");
-  const [kontributorPassword, setKontributorPassword] = useState("");
-  const [confirmKontributorPassword, setConfirmKontributorPassword] =
-    useState("");
-  const [isLoading, setIsLoading] = useState(false);
-  const [formErrors, setFormErrors] = useState<any>({});
-  // di atas, bareng useState lainnya
-  const [isVisible, setIsVisible] = useState(false);
-  const [isVisibleSetup, setIsVisibleSetup] = useState([false, false]);
-
-  // fungsi helper
-  const toggleVisibility = () => setIsVisible(!isVisible);
 
   // data user lengkap
   const [fullname, setFullname] = useState("");
@@ -60,7 +40,7 @@ export default function SignUp() {
   const [password, setPassword] = useState("");
   const [workType, setWorkType] = useState("");
 
-  // 🔹 Handle OTP Request
+  // 🔹 Kirim OTP
   const handleSendOtp = async (e: React.FormEvent) => {
     e.preventDefault();
 
@@ -69,8 +49,16 @@ export default function SignUp() {
       return;
     }
 
+    // tentukan name sesuai role
+    let name = "";
+    if (role === "tenant") name = namaTenant || `${firstName} ${lastName}`;
+    else if (role === "kontributor")
+      name = namaPerusahaan || `${firstName} ${lastName}`;
+    else if (role === "jurnalis") name = certNumber || "Jurnalis";
+    else name = fullname || email;
+
     try {
-      const res = await requestOTP({ email, name: fullname || email });
+      const res = await requestOTP({ email, name });
 
       if (!res?.error) {
         MySwal.fire("Sukses", "OTP berhasil dikirim ke email anda", "success");
@@ -82,18 +70,9 @@ export default function SignUp() {
       console.error("Error send otp:", err);
       MySwal.fire("Error", "Terjadi kesalahan server", "error");
     }
-
-    // If role is tenant, handle tenant registration directly
-    if (role === "tenant") {
-      handleTenantRegistration(e);
-      return;
-    }
-
-    // For other roles, proceed with OTP flow
-    setStep("otp");
   };
 
-  // 🔹 Handle OTP Verification (dummy → lanjut form)
+  // 🔹 Verifikasi OTP
   const handleVerifyOtp = async (e: React.FormEvent) => {
     e.preventDefault();
     const code = otp.join("");
@@ -101,21 +80,20 @@ export default function SignUp() {
       MySwal.fire("Error", "OTP harus 6 digit", "error");
       return;
     }
-    // TODO: ganti dengan verifyOTP API
     MySwal.fire("Sukses", "OTP diverifikasi!", "success");
-    setStep("form"); // lanjut ke form lengkap
+    setStep("form");
   };
 
-  // 🔹 Handle Register ke API /users
+  // 🔹 Register User (API baru)
   const handleRegister = async (e: React.FormEvent) => {
     e.preventDefault();
 
     const payload = {
       address,
-      clientId: "web-app", // contoh default
+      clientId: "78356d32-52fa-4dfc-b836-6cebf4e3eead",
       dateOfBirth,
       email,
-      fullName: fullname, // 🔥 fix disini (bukan fullname)
+      fullName: fullname,
       genderType,
       identityGroup: "",
       identityGroupNumber: "",
@@ -134,7 +112,7 @@ export default function SignUp() {
       const res = await createUser(payload);
       if (!res?.error) {
         MySwal.fire("Sukses", "Akun berhasil dibuat!", "success");
-        router.push("/login");
+        router.push("/auth");
       } else {
         MySwal.fire("Error", res.message || "Gagal membuat akun", "error");
       }
@@ -153,147 +131,116 @@ export default function SignUp() {
     if (value && nextInput) nextInput.focus();
   };
 
-  // Form validation functions
-  const validateEmail = (email: string) => {
-    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-    return emailRegex.test(email);
-  };
-
-  const validatePhone = (phone: string) => {
-    const phoneRegex = /^[0-9+\-\s()]+$/;
-    return phoneRegex.test(phone) && phone.length >= 10;
-  };
-
-  const validatePassword = (password: string) => {
-    return password.length >= 8;
-  };
-
-  const validateTenantForm = () => {
-    const errors: any = {};
-
-    if (!firstName.trim()) {
-      errors.firstName = "First name is required";
-    }
-
-    if (!lastName.trim()) {
-      errors.lastName = "Last name is required";
-    }
-
-    if (!email.trim()) {
-      errors.email = "Email is required";
-    } else if (!validateEmail(email)) {
-      errors.email = "Please enter a valid email address";
-    }
-
-    if (!whatsapp.trim()) {
-      errors.whatsapp = "WhatsApp number is required";
-    } else if (!validatePhone(whatsapp)) {
-      errors.whatsapp = "Please enter a valid phone number";
-    }
-
-    if (!namaTenant.trim()) {
-      errors.namaTenant = "Tenant name is required";
-    }
-
-    if (!tenantPassword) {
-      errors.tenantPassword = "Password is required";
-    } else if (!validatePassword(tenantPassword)) {
-      errors.tenantPassword = "Password must be at least 8 characters";
-    }
-
-    if (!confirmTenantPassword) {
-      errors.confirmTenantPassword = "Please confirm your password";
-    } else if (tenantPassword !== confirmTenantPassword) {
-      errors.confirmTenantPassword = "Passwords do not match";
-    }
-
-    setFormErrors(errors);
-    return Object.keys(errors).length === 0;
-  };
-
-  const handleTenantRegistration = async (e: React.FormEvent) => {
-    e.preventDefault();
-
-    if (!validateTenantForm()) {
-      return;
-    }
-
-    setIsLoading(true);
-    setFormErrors({});
-
-    try {
-      const registrationData = {
-        adminUser: {
-          address: "Jakarta", // Default address as per API requirement
-          email: email,
-          fullname: `${firstName} ${lastName}`,
-          password: tenantPassword,
-          phoneNumber: whatsapp,
-          username: `${firstName}-${lastName}`, // Using firstName + lastName as username
-        },
-        client: {
-          clientType: "sub_client", // Hardcoded as per API requirement
-          name: namaTenant,
-          parentClientId: "78356d32-52fa-4dfc-b836-6cebf4e3eead", // Hardcoded as per API requirement
-        },
-      };
-
-      const response = await registerTenant(registrationData);
-
-      if (response.error) {
-        MySwal.fire({
-          title: "Registration Failed",
-          text: response.message || "An error occurred during registration",
-          icon: "error",
-          confirmButtonText: "OK",
-        });
-      } else {
-        MySwal.fire({
-          title: "Registration Successful",
-          text: "Your tenant account has been created successfully!",
-          icon: "success",
-          confirmButtonText: "OK",
-        }).then(() => {
-          // Redirect to login page or dashboard
-          router.push("/auth");
-        });
-      }
-    } catch (error) {
-      console.error("Registration error:", error);
-      MySwal.fire({
-        title: "Registration Failed",
-        text: "An unexpected error occurred. Please try again.",
-        icon: "error",
-        confirmButtonText: "OK",
-      });
-    } finally {
-      setIsLoading(false);
-    }
-  };
-
   return (
     <div className="min-h-screen flex">
-      {/* Left Side Logo */}
+      {/* Left Side */}
-      <div className="hidden lg:flex lg:w-1/2 bg-white relative overflow-hidden">
+      <div className="hidden lg:flex lg:w-1/2 bg-white items-center justify-center">
-        <div className="relative z-10 flex items-center justify-center w-full p-12">
+        <div className="text-center">
-          <div className="text-center">
+          <Link href={"/"}>
-            <Link href={"/"}>
+            <img src="/Group.png" alt="Logo" className="max-w-2xl h-auto" />
-              <img src="/Group.png" alt="Logo" className="max-w-2xl h-auto" />
+          </Link>
-            </Link>
+          <h2 className="text-2xl font-bold mt-4">Portal NetIdhub</h2>
-            <div className="mt-8 text-black">
-              <h2 className="text-2xl font-bold mb-2">Portal NetIdhub</h2>
-              <p className="text-sm opacity-80">Platform beyond classic</p>
-            </div>
-          </div>
         </div>
       </div>
 
-      {/* Right Side Form */}
+      {/* Right Side */}
       <div className="w-full lg:w-1/2 flex items-center justify-center p-8">
         <div className="w-full max-w-md">
-          {/* Step 1: Kirim OTP */}
+          {/* Step 1: Pilih Role + Email */}
           {step === "login" && (
             <form onSubmit={handleSendOtp} className="space-y-4">
+              <RadioGroup
+                defaultValue="umum"
+                className="grid grid-cols-2 sm:grid-cols-4 gap-2 mb-6"
+                onValueChange={(val) => setRole(val)}
+              >
+                <div className="flex items-center space-x-2">
+                  <RadioGroupItem value="umum" id="umum" />
+                  <Label htmlFor="umum">Umum</Label>
+                </div>
+                <div className="flex items-center space-x-2">
+                  <RadioGroupItem value="jurnalis" id="jurnalis" />
+                  <Label htmlFor="jurnalis">Jurnalis</Label>
+                </div>
+                <div className="flex items-center space-x-2">
+                  <RadioGroupItem value="kontributor" id="kontributor" />
+                  <Label htmlFor="kontributor">Kontributor</Label>
+                </div>
+                <div className="flex items-center space-x-2">
+                  <RadioGroupItem value="tenant" id="tenant" />
+                  <Label htmlFor="tenant">Tenant</Label>
+                </div>
+              </RadioGroup>
+
+              {role === "jurnalis" && (
+                <>
+                  <select
+                    className="w-full border rounded-md p-2"
+                    value={membershipType}
+                    onChange={(e) => setMembershipType(e.target.value)}
+                  >
+                    <option value="">Pilih jenis keanggotaan</option>
+                    <option value="pwi">PWI</option>
+                    <option value="ijti">IJTI</option>
+                    <option value="pfi">PFI</option>
+                    <option value="aji">AJI</option>
+                    <option value="lainnya">Lainnya</option>
+                  </select>
+                  <Input
+                    type="text"
+                    placeholder="Nomor Sertifikasi Wartawan"
+                    value={certNumber}
+                    onChange={(e) => setCertNumber(e.target.value)}
+                  />
+                </>
+              )}
+
+              {role === "tenant" && (
+                <>
+                  <Input
+                    type="text"
+                    placeholder="Nama Tenant"
+                    value={namaTenant}
+                    onChange={(e) => setNamaTenant(e.target.value)}
+                  />
+                  <Input
+                    type="text"
+                    placeholder="First Name"
+                    value={firstName}
+                    onChange={(e) => setFirstName(e.target.value)}
+                  />
+                  <Input
+                    type="text"
+                    placeholder="Last Name"
+                    value={lastName}
+                    onChange={(e) => setLastName(e.target.value)}
+                  />
+                </>
+              )}
+
+              {role === "kontributor" && (
+                <>
+                  <Input
+                    type="text"
+                    placeholder="Nama Perusahaan"
+                    value={namaPerusahaan}
+                    onChange={(e) => setNamaPerusahaan(e.target.value)}
+                  />
+                  <Input
+                    type="text"
+                    placeholder="First Name"
+                    value={firstName}
+                    onChange={(e) => setFirstName(e.target.value)}
+                  />
+                  <Input
+                    type="text"
+                    placeholder="Last Name"
+                    value={lastName}
+                    onChange={(e) => setLastName(e.target.value)}
+                  />
+                </>
+              )}
+
               <Input
                 type="text"
                 placeholder="Nama Lengkap"
@@ -307,17 +254,18 @@ export default function SignUp() {
                 value={email}
                 onChange={(e) => setEmail(e.target.value)}
               />
+
               <Button type="submit" className="w-full bg-[#B89445] text-white">
                 Kirim OTP
               </Button>
             </form>
           )}
 
-          {/* Step 2: Verifikasi OTP */}
+          {/* Step 2: OTP */}
           {step === "otp" && (
             <form onSubmit={handleVerifyOtp} className="space-y-4 text-center">
               <h3 className="text-base font-semibold">Masukkan OTP</h3>
-              <div className="flex justify-between mb-4">
+              <div className="flex justify-between">
                 {otp.map((value, index) => (
                   <input
                     key={index}

service/auth.ts

@@ -99,7 +99,7 @@ export async function postEmailValidation(data: any) {
 }
 
 export async function postSetupEmail(data: any) {
-  const url = "public/users/setup-email";
+  const url = "users/setup-email";
   return httpPostInterceptor(url, data);
 }
 

service/categories/categories.ts

@@ -76,14 +76,12 @@ export async function deleteCategories(id: number) {
 }
 
 export async function createCategories(data: CreateCategoryPayload) {
-  const url = "/article-categories";
+  const url = "article-categories";
-
   return httpPostInterceptor(url, data);
 }
 
-// services/article-categories.ts
 
 export async function getArticleCategoryDetail(id: number) {
-  const url = `/article-categories/${id}`;
+  const url = `article-categories/${id}`;
   return await httpGetInterceptor(url);
 }