route handlers for account/main

frontend/app/(urls)/account/page.tsx

@@ -1,7 +1,115 @@
-import React from 'react'
+'use client'
 
-const page = () => {
-  return <div>page</div>
+import React from 'react'
+import { useForm } from '@/app/hooks/useForm'
+import Button from '@/components/ui/Button'
+import showToast from '@/components/ui/Toast'
+import useUserStore from '@/app/store/userStore'
+import ContactUs from '@/components/ContactUs'
+import TextInput from '@/components/ui/TextInput'
+import PhoneInput from '@/components/ui/PhoneInput'
+
+const validationRules = {
+  firstName: { required: true },
+  lastName: { required: false },
+  phone_number: { required: true },
+  email: { required: true },
 }
 
-export default page
+const AccountPage = () => {
+  const { user } = useUserStore()
+
+  const { values, handleChange, handleSubmit } = useForm(
+    {
+      firstName: user?.name || '',
+      lastName: user?.surname || '',
+      phone_number: user?.phone_number || '',
+      email: user?.email || '',
+      country: user?.country || '',
+      city: user?.city || '',
+    },
+    validationRules,
+    async (values) => {
+      try {
+        // await updateMainTab(values)
+        showToast({ type: 'success', message: 'Данные успешно обновлены!' })
+      } catch {
+        showToast({ type: 'error', message: 'Ой, что то пошло не так..' })
+      }
+    }
+  )
+
+  if (!user) {
+    return null
+  }
+
+  return (
+    <div className="space-y-3">
+      <div className="rounded-2xl shadow overflow-hidden">
+        <div className="p-6 bg-white sm:p-8">
+          <div className="space-y-4">
+            <h1 className="text-2xl">Личные данные</h1>
+            <form className="space-y-4" onSubmit={handleSubmit}>
+              <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+                <TextInput
+                  name="firstName"
+                  value={values.firstName}
+                  handleChange={handleChange}
+                  label="Имя"
+                  placeholder="Ваше имя"
+                  style="register"
+                />
+                <TextInput
+                  name="lastName"
+                  value={values.lastName}
+                  handleChange={handleChange}
+                  label="Фамилия"
+                  placeholder="Ваша фамилия"
+                  style="register"
+                />
+                <TextInput
+                  name="email"
+                  value={values.email}
+                  handleChange={handleChange}
+                  label="Email"
+                  placeholder="Ваш email"
+                  style="register"
+                />
+                <PhoneInput
+                  value={values.phone_number}
+                  handleChange={handleChange}
+                  operatorsInfo={false}
+                />
+                <TextInput
+                  name="country"
+                  value={values.country}
+                  handleChange={handleChange}
+                  label="Страна"
+                  placeholder="Ваша страна проживания"
+                  style="register"
+                />
+                <TextInput
+                  name="city"
+                  value={values.city}
+                  handleChange={handleChange}
+                  label="Город"
+                  placeholder="Ваш город проживания"
+                  style="register"
+                />
+              </div>
+
+              <Button
+                text="Сохранить изменения"
+                className="text-sm font-semibold py-4 px-6 bg-orange text-white flex items-center rounded-2xl whitespace-nowrap"
+                type="submit"
+              />
+            </form>
+          </div>
+        </div>
+      </div>
+      <ContactUs />
+    </div>
+  )
+}
+
+export default AccountPage