From 2da5a6928d59d4fb576d2be2ccc76b2c7f66064d Mon Sep 17 00:00:00 2001
From: WindFallten <egorsig@yandex.ru>
Date: Sat, 27 Apr 2024 04:42:26 +0300
Subject: [PATCH] gosha forms personalization

---
 public/banner_arr_btn.svg.svg             |  1 +
 src/components/pages/order/emailInput.tsx |  5 ++-
 src/components/pages/order/phoneInput.tsx | 44 +++++++++++------------
 src/pages/order/make.tsx                  |  5 ++-
 src/pages/personalization.tsx             |  4 +++
 5 files changed, 35 insertions(+), 24 deletions(-)

diff --git a/public/banner_arr_btn.svg.svg b/public/banner_arr_btn.svg.svg
index 820585a..1281228 100644
--- a/public/banner_arr_btn.svg.svg
+++ b/public/banner_arr_btn.svg.svg
@@ -8,3 +8,4 @@
 </clipPath>
 </defs>
 </svg>
+
diff --git a/src/components/pages/order/emailInput.tsx b/src/components/pages/order/emailInput.tsx
index b94b444..f5b34e2 100644
--- a/src/components/pages/order/emailInput.tsx
+++ b/src/components/pages/order/emailInput.tsx
@@ -21,7 +21,10 @@ const EmailInput = ({control, errors} : InputPropsType) => {
                     "inputWrapper": "h-[65px]",
                     "label": "group[data-filled-within=true] group-data-[filled-within=true]:-translate-y-[60px] group-data-[filled-within=true]:text-[#8F8F8F]"
                 }}
-                variant={"bordered"} label={"E-mail"} type={"email"} isRequired
+                variant={"bordered"}
+                label={"E-mail"}
+                type={"email"}
+                isRequired
                 labelPlacement={"outside"} {...field}
                 isInvalid={!!errors.email}
                 errorMessage={errors.email && errors.email.message}
diff --git a/src/components/pages/order/phoneInput.tsx b/src/components/pages/order/phoneInput.tsx
index f418d1f..42e0cde 100644
--- a/src/components/pages/order/phoneInput.tsx
+++ b/src/components/pages/order/phoneInput.tsx
@@ -39,7 +39,7 @@ const normalizeInput = (value: string, previousValue: string) => {
     return ""
 };
 
-const PhoneInput = ({control, errors, watch, setValue} : InputPropsType) => {
+const PhoneInput = ({control, errors, watch, setValue}: InputPropsType) => {
 
     const [phoneNumberPrev, setPhoneNumberPrev] = useState("")
     const phoneNumberCur = watch("phoneNumber")
@@ -53,27 +53,27 @@ const PhoneInput = ({control, errors, watch, setValue} : InputPropsType) => {
     }, [phoneNumberCur])
 
     return (
-    <Controller control={control}
-                name={"phoneNumber"}
-                rules={{
-                    required: "Поле обязательно для заполнения",
-                    pattern: {
-                        message: "Неверный формат номера телефона",
-                        value: /\+\d \(\d{3}\) \d{3} \d{2}-\d{2}/
-                    }
-                }}
-                render={({field}) =>
-                    <Input
-                        classNames={{
-                            "inputWrapper": "h-[65px]",
-                            "label": "group[data-filled-within=true] group-data-[filled-within=true]:-translate-y-[60px] group-data-[filled-within=true]:text-[#8F8F8F]"
-                        }}
-                        variant={"bordered"} label={"Телефон"} type={"tel"} isRequired
-                        labelPlacement={"outside"} {...field}
-                        isInvalid={!!errors.phoneNumber}
-                        errorMessage={errors.phoneNumber && errors.phoneNumber.message}
-                    />
-                }/>
+        <Controller control={control}
+                    name={"phoneNumber"}
+                    rules={{
+                        required: "Поле обязательно для заполнения",
+                        pattern: {
+                            message: "Неверный формат номера телефона",
+                            value: /\+\d \(\d{3}\) \d{3} \d{2}-\d{2}/
+                        }
+                    }}
+                    render={({field}) =>
+                        <Input
+                            classNames={{
+                                "inputWrapper": "h-[65px]",
+                                "label": "group[data-filled-within=true] group-data-[filled-within=true]:-translate-y-[60px] group-data-[filled-within=true]:text-[#8F8F8F]"
+                            }}
+                            variant={"bordered"} label={"Телефон"} type={"tel"} isRequired
+                            labelPlacement={"outside"} {...field}
+                            isInvalid={!!errors.phoneNumber}
+                            errorMessage={errors.phoneNumber && errors.phoneNumber.message}
+                        />
+                    }/>
     )
 }
 
diff --git a/src/pages/order/make.tsx b/src/pages/order/make.tsx
index 66550bf..d8047ab 100644
--- a/src/pages/order/make.tsx
+++ b/src/pages/order/make.tsx
@@ -166,7 +166,10 @@ const MakeOrder = () => {
 
                 </form>
 
-                <Modal isOpen={modalVisible} size={'4xl'}>
+                <Modal
+                    isOpen={modalVisible}
+                    size={'4xl'}
+                >
                     <ModalContent className={"text-[#151515]"}>
                         <ModalBody>
                             <div className="flex items-center flex-col p-7">
diff --git a/src/pages/personalization.tsx b/src/pages/personalization.tsx
index 5dcdc7a..b161bd2 100644
--- a/src/pages/personalization.tsx
+++ b/src/pages/personalization.tsx
@@ -4,6 +4,7 @@ import { Img } from "react-image"
 import {Input} from "@nextui-org/input";
 import Link from "next/link";
 import FormPersonalization from "@/components/reusable/formPersonalization";
+import FormCustomization from "@/components/reusable/formCustomization";
 
 
 const Mission = () => {
@@ -30,6 +31,9 @@ const Mission = () => {
                 <h2>Кастомизация</h2>
                 <p>(от англ. to customize — «настроить») — это индивидуализация продукции под заказ конкретного потребителя при помощи конструктивных доработок или настроек.</p>
             </section>
+            <section>
+                <FormCustomization/>
+            </section>
 
         </div>