Merge branch 'new-release' into CR/form-merchant

# Conflicts:
#	src/lib/form/components/Merchant.jsx

4 files changed, 352 insertions, 3 deletions

diff --git a/src/lib/form/components/KunjunganSales.jsx b/src/lib/form/components/KunjunganSales.jsx
index 3779b836..0f63de03 100644
--- a/src/lib/form/components/KunjunganSales.jsx
+++ b/src/lib/form/components/KunjunganSales.jsx
@@ -42,7 +42,7 @@ const KunjunganSales = () => {
 
   useEffect(() => {
     const loadState = async () => {
-      let dataState = await stateApi();
+      let dataState = await stateApi({ tempo: false });
       dataState = dataState.map((state) => ({
         value: state.id,
         label: state.name,
diff --git a/src/lib/form/components/KunjunganService.jsx b/src/lib/form/components/KunjunganService.jsx
index e3c83f78..a3871054 100644
--- a/src/lib/form/components/KunjunganService.jsx
+++ b/src/lib/form/components/KunjunganService.jsx
@@ -41,7 +41,7 @@ const CreateKunjunganService = () => {
 
   useEffect(() => {
     const loadState = async () => {
-      let dataState = await stateApi();
+      let dataState = await stateApi({ tempo: false });
       dataState = dataState.map((state) => ({
         value: state.id,
         label: state.name,
diff --git a/src/lib/form/components/Merchant.jsx b/src/lib/form/components/Merchant.jsx
new file mode 100644
index 00000000..03b8fc84
--- /dev/null
+++ b/src/lib/form/components/Merchant.jsx
@@ -0,0 +1,349 @@
+import HookFormSelect from '@/core/components/elements/Select/HookFormSelect';
+import cityApi from '@/lib/address/api/cityApi';
+import stateApi from '@/lib/address/api/stateApi.js';
+import { yupResolver } from '@hookform/resolvers/yup';
+import React, { useEffect, useRef, useState } from 'react';
+import ReCAPTCHA from 'react-google-recaptcha';
+import { Controller, useForm } from 'react-hook-form';
+import { toast } from 'react-hot-toast';
+import * as Yup from 'yup';
+import createLeadApi from '../api/createLeadApi';
+import PageContent from '@/lib/content/components/PageContent';
+import { useRouter } from 'next/router';
+import useAuth from '@/core/hooks/useAuth';
+
+const CreateMerchant = () => {
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+    control,
+    reset,
+    watch,
+    setValue,
+  } = useForm({
+    resolver: yupResolver(validationSchema),
+    defaultValues,
+  });
+  const list_unit = [
+    {
+      value: 'Manufacturing',
+      label: 'Manufacturing',
+    },
+    {
+      value: 'Hospitality',
+      label: 'Hospitality',
+    },
+    {
+      value: 'Automotive',
+      label: 'Automotive',
+    },
+    {
+      value: 'Retail',
+      label: 'Retail',
+    },
+    {
+      value: 'Maining',
+      label: 'Maining',
+    },
+    {
+      value: 'Lain - Lain',
+      label: 'Lain - Lain',
+    },
+  ];
+  const [cities, setCities] = useState([]);
+  const [state, setState] = useState([]);
+  const [company_unit, setCompany_unit] = useState(list_unit);
+
+  const recaptchaRef = useRef(null);
+  const router = useRouter();
+
+  const auth = useAuth();
+  if (auth == false) {
+    router.push(`/login?next=${encodeURIComponent('/daftar-merchant')}`);
+  }
+
+  useEffect(() => {
+    const loadState = async () => {
+      let dataState = await stateApi({ tempo: false });
+      dataState = dataState.map((state) => ({
+        value: state.id,
+        label: state.name,
+      }));
+      setState(dataState);
+    };
+    loadState();
+  }, []);
+
+  const watchState = watch('state');
+  useEffect(() => {
+    if (auth == false) {
+      return;
+    }
+    const loadCities = async () => {
+      setValue('city', '');
+      let dataCities = await cityApi({ stateId: watchState });
+      dataCities = dataCities?.map((city) => ({
+        value: city.id,
+        label: city.name,
+      }));
+      setCities(dataCities);
+    };
+    loadCities();
+  }, [auth, watchState, setValue]);
+
+  const onSubmitHandler = async (values) => {
+    const recaptchaValue = recaptchaRef.current.getValue();
+    if (!recaptchaValue) {
+      toast.error('Catcha harus diisi');
+      return;
+    }
+    const data = {
+      ...values,
+      name: 'Form Merchant - ' + values.company,
+      contact_name: values.cp,
+      email_from: values.email,
+      phone: values.phone,
+      description:
+        'Nama Perusahaan : ' +
+        values.company +
+        ' \r\n  Alamat  : ' +
+        values.address +
+        ' \r\n  Kota  : ' +
+        values.city +
+        ' \r\n  Unit Perusahaan  : ' +
+        values.company_unit +
+        ' \r\n  Telepon: ' +
+        values.phone +
+        ' \r\n  Email  : ' +
+        values.email +
+        ' \r\n  Website : ' +
+        values.website +
+        ' \r\n No Hp : ' +
+        values.mobile +
+        'Keterangan  : ' +
+        values.description,
+    };
+    const create_leads = await createLeadApi({ data });
+    if (create_leads) {
+      toast.success('Berhasil menambahkan data');
+      reset();
+      recaptchaRef.current.reset();
+    }
+  };
+  if (!auth) {
+    return;
+  }
+  return (
+    <div className='container mx-auto p-4 md:p-0 my-0 md:my-10'>
+      <h1 className='text-h-sm md:text-title-sm font-semibold mb-6'>
+        Form Merchant
+      </h1>
+      <div className='w-full  p-4 bg-white border border-gray_r-6 rounded'>
+        <div
+          className='flex items-center bg-blue-100 border border-blue-400 text-blue-500 font-bold px-4 py-3 mb-4'
+          role='alert'
+        >
+          <p>
+            Penjualan online adalah hal yang HARUS dilakukan mulai sekarang.
+            Perubahan dalam banyak industri dan pola pembelian. Gabung dengan
+            platform kami dan mulai penjualan lansung di ribuan perusahaan d
+            seluruh Indonesia.{' '}
+          </p>
+        </div>
+        <div className='w-full grid grid-cols-2 gap-x-2'>
+          <form onSubmit={handleSubmit(onSubmitHandler)}>
+            <div className=''>
+              <div>
+                <label className='form-label mb-2'>Nama Perusahan *</label>
+                <input
+                  {...register('company')}
+                  placeholder='PT.Indoteknik'
+                  type='text'
+                  className='form-input'
+                />
+                <div className='text-caption-2 text-danger-500 mt-1'>
+                  {errors.company?.message}
+                </div>
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <label className='form-label mb-2'>Alamat*</label>
+                <input
+                  {...register('address')}
+                  placeholder='jl. Bandengan no.31 '
+                  type='text'
+                  className='form-input'
+                />
+                <div className='text-caption-2 text-danger-500 mt-1'>
+                  {errors.address?.message}
+                </div>
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <label className='form-label mb-2'>No. Telp *</label>
+                <input
+                  {...register('phone')}
+                  placeholder='021-XXXX'
+                  type='text'
+                  className='form-input'
+                />
+                <div className='text-caption-2 text-danger-500 mt-1'>
+                  {errors.phone?.message}
+                </div>
+              </div>
+            </div>
+            <div>
+              <label className='form-label mb-2'>Provinsi*</label>
+              <Controller
+                name='state'
+                control={control}
+                render={(props) => (
+                  <HookFormSelect {...props} options={state} />
+                )}
+              />
+              <div className='text-caption-2 text-danger-500 mt-1'>
+                {errors.state?.message}
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <label className='form-label mb-2'>Kota*</label>
+                <Controller
+                  name='city'
+                  control={control}
+                  render={(props) => (
+                    <HookFormSelect {...props} options={cities} />
+                  )}
+                />
+                <div className='text-caption-2 text-danger-500 mt-1'>
+                  {errors.city?.message}
+                </div>
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <label className='form-label mb-2'>Unit Perusahaan*</label>
+                <Controller
+                  name='company_unit'
+                  control={control}
+                  render={(props) => (
+                    <HookFormSelect {...props} options={company_unit} />
+                  )}
+                />
+                <div className='text-caption-2 text-danger-500 mt-1'>
+                  {errors.company_unit?.message}
+                </div>
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <label className='form-label mb-2'>Website *</label>
+                <input
+                  {...register('website')}
+                  placeholder='https://indoteknik.com'
+                  type='text'
+                  className='form-input'
+                />
+                <div className='text-caption-2 text-danger-500 mt-1'>
+                  {errors.website?.message}
+                </div>
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <label className='form-label mb-2'>Contact Person*</label>
+                <input
+                  {...register('cp')}
+                  placeholder='Jhone doe'
+                  type='text'
+                  className='form-input'
+                />
+                <div className='text-caption-2 text-danger-500 mt-1'>
+                  {errors.cp?.message}
+                </div>
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <label className='form-label mb-2'>No HP *</label>
+                <input
+                  {...register('mobile')}
+                  placeholder='628XXXXXXX'
+                  type='text'
+                  className='form-input'
+                />
+                <div className='text-caption-2 text-danger-500 mt-1'>
+                  {errors.mobile?.message}
+                </div>
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <label className='form-label mb-2'>Alamat Email *</label>
+                <input
+                  {...register('email')}
+                  placeholder='contoh@email.com'
+                  type='email'
+                  className='form-input'
+                />
+                <div className='text-caption-2 text-danger-500 mt-1'>
+                  {errors.email?.message}
+                </div>
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <ReCAPTCHA
+                  ref={recaptchaRef}
+                  sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_GOOGLE}
+                />
+              </div>
+            </div>
+            <div className=''>
+              <div>
+                <button
+                  type='submit'
+                  className='btn-yellow w-full md:w-fit mt-6 ml-0 md:ml-auto'
+                >
+                  Simpan
+                </button>
+              </div>
+            </div>
+          </form>
+          <PageContent path='/daftar-merchant' />
+        </div>
+      </div>
+    </div>
+  );
+};
+const validationSchema = Yup.object().shape({
+  company: Yup.string().required('Harus di-isi'),
+  email: Yup.string()
+    .email('Format harus seperti contoh@email.com')
+    .required('Harus di-isi'),
+  phone: Yup.string().required('Harus di-isi'),
+  cp: Yup.string().required('Harus di-isi'),
+  state: Yup.string().required('Harus dipilih'),
+  city: Yup.string().required('Harus di-isi'),
+  company_unit: Yup.string().required('Harus di-isi'),
+  address: Yup.string().required('Harus di-isi'),
+  website: Yup.string().required('Harus di-isi'),
+  mobile: Yup.string().required('Harus di-isi'),
+});
+const defaultValues = {
+  company: '',
+  email: '',
+  phone: '',
+  state: '',
+  city: '',
+  company_unit: '',
+  cp: '',
+  address: '',
+  website: '',
+  mobile: '',
+};
+
+export default CreateMerchant;
diff --git a/src/lib/form/components/RequestForQuotation.jsx b/src/lib/form/components/RequestForQuotation.jsx
index 170a5c62..8861338f 100644
--- a/src/lib/form/components/RequestForQuotation.jsx
+++ b/src/lib/form/components/RequestForQuotation.jsx
@@ -42,7 +42,7 @@ const RequestForQuotation = () => {
 
   useEffect(() => {
     const loadState = async () => {
-      let dataState = await stateApi();
+      let dataState = await stateApi({ tempo: false });
       dataState = dataState.map((state) => ({
         value: state.id,
         label: state.name,