<iman> update fungsion component

4 files changed, 81 insertions, 121 deletions

diff --git a/src-migrate/modules/register/components/Form.tsx b/src-migrate/modules/register/components/Form.tsx
index 5e5e0a11..29c21f62 100644
--- a/src-migrate/modules/register/components/Form.tsx
+++ b/src-migrate/modules/register/components/Form.tsx
@@ -16,7 +16,6 @@ interface FormProps {
 }
 
 const Form: React.FC<FormProps> = ({ type, required, isBisnisRegist=false }) => {
-  console.log("isBisnisRegist",isBisnisRegist)
   const {
     form,
     isCheckedTNC,
@@ -27,7 +26,6 @@ const Form: React.FC<FormProps> = ({ type, required, isBisnisRegist=false }) =>
   } = useRegisterStore()
 
   const isFormValid = useMemo(() => Object.keys(errors).length === 0, [errors])
-  console.log("errors",errors)
 
   const router = useRouter()
   const toast = useToast()
@@ -35,19 +33,6 @@ const Form: React.FC<FormProps> = ({ type, required, isBisnisRegist=false }) =>
   const handleInputChange = (event: ChangeEvent<HTMLInputElement>) => {
     const { name, value } = event.target;
     updateForm(name, value)
-    // if(!isBisnisRegist){
-    
-      // updateForm('type_acc',`individu`)
-      // updateForm('is_pkp','false')
-      // updateForm('business_name','Iman')
-      // updateForm('company_type_id','0')
-      // updateForm('email_partner','it@fixcomart.co.id')
-      // updateForm('industry_id','0')
-      // updateForm('nama_wajib_pajak','Iman')
-      // updateForm('npwp','958666666688888')
-      // updateForm('npwp_document','adsdad.pdf')
-      // updateForm('sppkp_document','fdddwedw.pdf')
-    // }
     validate()
   }
 
@@ -93,7 +78,7 @@ const Form: React.FC<FormProps> = ({ type, required, isBisnisRegist=false }) =>
         break
     }
   }
-  console.log(!isFormValid,!isCheckedTNC,mutation.isLoading,!isValidCaptcha)
+  
 
   return (
     <form className="mt-6 grid grid-cols-1 gap-y-4" onSubmit={handleSubmit}>
@@ -167,21 +152,7 @@ const Form: React.FC<FormProps> = ({ type, required, isBisnisRegist=false }) =>
         {!!errors.phone && <span className="form-msg-danger">{errors.phone}</span>}
       </div>
 
-      {type==='individu' && (
-        <>
-          <FormCaptcha />
-    
-          <TermCondition />
-          <button
-            type="submit"
-            className="btn-yellow w-full mt-2"
-            disabled={!isFormValid || !isCheckedTNC || mutation.isLoading || !isValidCaptcha}
-          >
-            {mutation.isLoading ? 'Loading...' : 'Daftar'}
-          </button>
-        </>
-
-      )}
+     
 
 
     </form>
diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx
index 5d15ab6c..1d0c930f 100644
--- a/src-migrate/modules/register/components/FormBisnis.tsx
+++ b/src-migrate/modules/register/components/FormBisnis.tsx
@@ -10,6 +10,7 @@ import getFileBase64 from '@/core/utils/getFileBase64'
 import { Controller, useForm } from 'react-hook-form'
 import HookFormSelect from '@/core/components/elements/Select/HookFormSelect'
 import odooApi from "~/libs/odooApi";
+import { toast } from 'react-hot-toast';
 
 interface FormProps {
   type: string;
@@ -31,19 +32,15 @@ interface companyType {
 const form: React.FC<FormProps> = ({ type, required, isPKP }) => {
   const {
     form,
-    isCheckedTNC,
-    isValidCaptcha,
     errors,
     updateForm,
     validate
   } = useRegisterStore()
   const { control, watch, setValue } = useForm();
   const [selectedCategory, setSelectedCategory] = useState<string>('');
-  const [selectedCompanyId, setSelectedCompanyId] = useState<string>('');
 
   const [industries, setIndustries] = useState<industry_id[]>([]);
   const [companyTypes, setCompanyTypes] = useState<companyType[]>([]);
-  const isFormValid = useMemo(() => Object.keys(errors).length === 0, [errors]);
 
   const router = useRouter();
   const toast = useToast();
@@ -60,7 +57,6 @@ const form: React.FC<FormProps> = ({ type, required, isPKP }) => {
     const selectedCompanyType = companyTypes.find(company => company.value === watch('companyType'));
     if (selectedCompanyType) {
       updateForm("company_type_id", `${selectedCompanyType?.value}`);
-      setSelectedCompanyId(selectedCompanyType?.label)
       validate();
     }
   }, [watch('companyType'), companyTypes]);
@@ -87,33 +83,26 @@ const form: React.FC<FormProps> = ({ type, required, isPKP }) => {
     updateForm('type_acc',`business`)
     updateForm('is_pkp',`${isPKP}`)
     updateForm(name, value);
-    updateForm('name',form.name);
-    updateForm('email',form.email);
-    updateForm('password',form.password);
-    updateForm('phone',form.phone);
     validate();
   };
 
   const handleFileChange = async (event: ChangeEvent<HTMLInputElement>) => {
-    // const file = poFile.current.files[0];
-    // const name = poNumber.current.value;
-    // if (typeof file === 'undefined' || !name) {
-    //   toast.error('Nomor dan Dokumen PO harus diisi');
-    //   return;
-    // }
-    // if (file.size > 5000000) {
-    //   toast.error('Maksimal ukuran file adalah 5MB');
-    //   return;
-    // }
-    // const data = { name, file: await getFileBase64(file) };
 
+    const toastProps: UseToastOptions = {
+      duration: 5000,
+      isClosable: true
+    };
     let fileBase64 = '';
     const { name} = event.target;
     const file = event.target.files?.[0];
     if (file) {
       if (typeof file !== 'undefined') {
         if (file.size > 5000000) {
-          // toast.error('Maksimal ukuran file adalah 5MB')
+          toast({
+            ...toastProps,
+            title: 'Maksimal ukuran file adalah 5MB',
+            status: 'warning'
+          });
           return;
         }
         fileBase64 = await getFileBase64(file);
@@ -310,14 +299,6 @@ const form: React.FC<FormProps> = ({ type, required, isPKP }) => {
 
         {isPKP && !required && !!errors.sppkp_document && <span className="form-msg-danger">{errors.sppkp_document}</span>}
       </div>
-
-      {/* <button
-        type="submit"
-        className="btn-yellow w-full mt-2"
-        disabled={!isFormValid || !isCheckedTNC || mutation.isLoading || !isValidCaptcha}
-      >
-        {mutation.isLoading ? 'Loading...' : 'Daftar'}
-      </button> */}
     </form>
   )
 }
diff --git a/src-migrate/modules/register/components/RegistrasiBisnis.tsx b/src-migrate/modules/register/components/RegistrasiBisnis.tsx
index c158e2f4..443ff0a0 100644
--- a/src-migrate/modules/register/components/RegistrasiBisnis.tsx
+++ b/src-migrate/modules/register/components/RegistrasiBisnis.tsx
@@ -14,7 +14,6 @@ import { useMutation } from "react-query";
 import { RegisterProps } from "~/types/auth";
 import { registerUser } from "~/services/auth";
 import router from "next/router";
-import toast from "react-hot-toast";
 import { useRouter } from "next/router";
 import { UseToastOptions, useToast } from "@chakra-ui/react";
 import Link from "next/link";
@@ -22,7 +21,6 @@ import Link from "next/link";
 const RegistrasiBisnis = () => {
   const [isPKP, setIsPKP] = useState(true);
   const [isTerdaftar, setIsTerdaftar] = useState(false);
-  const [isIndividuRequired, setIsIndividuRequired] = useState(true);
   const [isDropIndividu, setIsDropIndividu] = useState(true);
   const [isBisnisClicked, setisBisnisClicked] = useState(true);
   const [selectedValue, setSelectedValue] = useState('PKP');
@@ -55,19 +53,16 @@ const RegistrasiBisnis = () => {
     setSelectedValue(value);
     if (value === "PKP") {
       validate();
-      setIsIndividuRequired(true);
       setIsPKP(true);
     } else {
       validate();
       setIsPKP(false);
-      setIsIndividuRequired(false); // Hide and make optional the Individu form
       setIsPKP(false);
     }
   };
   
   const handleChangeBisnis = (value: string) => {
     setSelectedValueBisnis(value);
-    console.log('value',value)
     if (value === "true") {
       validate();
       updateForm('is_terdaftar','true')
@@ -87,46 +82,6 @@ const RegistrasiBisnis = () => {
     setisBisnisClicked(!isBisnisClicked)
   };
 
-  const handleSubmit = async () => {
-    console.log("form",form)
-    console.log("form Bisnis",form)
-    const response = await mutation.mutateAsync(form)
-
-    console.log("response",response)
-
-    if (response?.register === true) {
-      const urlParams = new URLSearchParams({
-        activation: 'otp',
-        email: form.email,
-        redirect: (router.query?.next || '/') as string
-      })
-      router.push(`${router.route}?${urlParams}`)
-    }
-
-    const toastProps: UseToastOptions = {
-      duration: 5000,
-      isClosable: true
-    }
-
-    switch (response?.reason) {
-      case 'EMAIL_USED':
-        toast({
-          ...toastProps,
-          title: 'Email sudah digunakan',
-          status: 'warning'
-        })
-        break;
-      case 'NOT_ACTIVE':
-        const activationUrl = `${router.route}?activation=email`
-        toast({
-          ...toastProps,
-          title: 'Akun belum aktif',
-          description: <>Akun sudah terdaftar namun belum aktif. <Link href={activationUrl} className="underline">Klik untuk aktivasi akun</Link></>,
-          status: 'warning'
-        })
-        break
-    }
-  };
   return (
     <>
       
@@ -192,19 +147,9 @@ const RegistrasiBisnis = () => {
           )}
         </div>
       </div>
+      
       <h1 className=""></h1>
-      <FormCaptcha />
-      <TermCondition />
-      <Button
-        type="submit"
-        colorScheme="red"
-        className="w-full mt-2"
-        size='lg'
-        onClick={handleSubmit}
-        // disabled={!isFormValid || !isCheckedTNC || mutation.isLoading || !isValidCaptcha}  
-      >
-        {mutation.isLoading ? 'Loading...' : 'Daftar'}
-      </Button>
+      
     </>
   );
 };
diff --git a/src-migrate/modules/register/index.tsx b/src-migrate/modules/register/index.tsx
index 5df2476e..bb94d170 100644
--- a/src-migrate/modules/register/index.tsx
+++ b/src-migrate/modules/register/index.tsx
@@ -7,8 +7,16 @@ import Link from "next/link";
 import Image from "next/image";
 import IndoteknikLogo from "~/images/logo.png";
 import AccountActivation from "../account-activation";
-import { useState } from "react";
+import { useMemo, useState } from "react";
 import { useRegisterStore } from "./stores/useRegisterStore";
+import FormCaptcha from "./components/FormCaptcha";
+import TermCondition from "./components/TermCondition";
+import {  Button } from '@chakra-ui/react'
+import { useMutation } from "react-query";
+import { UseToastOptions, useToast } from "@chakra-ui/react";
+import { RegisterProps } from "~/types/auth";
+import { registerUser } from "~/services/auth";
+import { useRouter } from "next/router";
 
 const LOGO_WIDTH = 150;
 const LOGO_HEIGHT = LOGO_WIDTH / 3;
@@ -16,10 +24,17 @@ const LOGO_HEIGHT = LOGO_WIDTH / 3;
 const Register = () => {
   const [isIndividuClicked, setIsIndividuClicked] = useState(true);
   const [isBisnisClicked, setIsBisnisClicked] = useState(false);
-  const {resetForm,
+  const {form, isCheckedTNC, isValidCaptcha, resetForm,errors,
     updateForm
   } = useRegisterStore()
 
+  const  isFormValid = useMemo(() => Object.keys(errors).length === 0, [errors])
+  const toast = useToast()
+  const router = useRouter()
+  const mutation = useMutation({
+    mutationFn: (data: RegisterProps) => registerUser(data)
+  })
+
   const handleIndividuClick = () => {
     resetForm();
     setIsIndividuClicked(true);
@@ -33,12 +48,46 @@ const Register = () => {
     setIsIndividuClicked(false);
     setIsBisnisClicked(true);
   };
+  const handleSubmit = async () => {
+    const response = await mutation.mutateAsync(form)
+    if (response?.register === true) {
+      const urlParams = new URLSearchParams({
+        activation: 'otp',
+        email: form.email,
+        redirect: (router.query?.next || '/') as string
+      })
+      router.push(`${router.route}?${urlParams}`)
+    }
+
+    const toastProps: UseToastOptions = {
+      duration: 5000,
+      isClosable: true
+    }
 
+    switch (response?.reason) {
+      case 'EMAIL_USED':
+        toast({
+          ...toastProps,
+          title: 'Email sudah digunakan',
+          status: 'warning'
+        })
+        break;
+      case 'NOT_ACTIVE':
+        const activationUrl = `${router.route}?activation=email`
+        toast({
+          ...toastProps,
+          title: 'Akun belum aktif',
+          description: <>Akun sudah terdaftar namun belum aktif. <Link href={activationUrl} className="underline">Klik untuk aktivasi akun</Link></>,
+          status: 'warning'
+        })
+        break
+    }
+  };
   return (
     <div className="container">
       <div className="grid grid-cols-1 md:grid-cols-2 gap-x-8 pt-10 px-2 md:pt-16">
-        <section className="border">
-          <div className="px-8 py-4">
+        <section className="">
+          <div className="px-8 py-4 border">
             <Link href="/" className="block md:hidden">
               <Image
                 src={IndoteknikLogo}
@@ -90,6 +139,20 @@ const Register = () => {
                 </div>
               )}
             </div>
+            <section className="mt-2">
+              <FormCaptcha />
+              <TermCondition />
+              <Button
+                type="submit"
+                colorScheme="red"
+                className="w-full mt-2"
+                size='lg'
+                onClick={handleSubmit}
+                isDisabled = {!isFormValid || !isCheckedTNC || mutation.isLoading || !isValidCaptcha}  
+              >
+                {mutation.isLoading ? 'Loading...' : 'Daftar'}
+              </Button>
+            </section>
             <section className="flex justify-center items-center flex-col">
               <div className="text-gray_r-11 mt-4 text-center md:text-left">
                 Sudah punya akun Indoteknik?{" "}