// "use client"

// import type React from "react"
// import { useState } from "react"
// import { Upload } from "lucide-react"
// import { Button } from "@/components/ui/button"
// import { Input } from "@/components/ui/input"
// import { Label } from "@/components/ui/label"
// import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
// import { useOpenStore } from "@/lib/hooks"
// import { useToast } from "@/hooks/use-toast"

// interface OpenStorePageProps {
//   locale?: string
//   translations?: {
//     title: string
//     firstName: string
//     lastName: string
//     email: string
//     phone: string
//     uploadPatent: string
//     submit: string
//     selectedFile: string
//     firstNameRequired: string
//     lastNameRequired: string
//     emailInvalid: string
//     phoneInvalid: string
//     fileRequired: string
//     fileSizeError: string
//     fileTypeError: string
//   }
// }

// interface FormData {
//   firstName: string
//   lastName: string
//   email: string
//   phone: string
//   file: File | null
// }

// interface FormErrors {
//   firstName?: string
//   lastName?: string
//   email?: string
//   phone?: string
//   file?: string
// }

// export default function OpenStorePage({ locale = "ru", translations }: OpenStorePageProps) {
//   const [formData, setFormData] = useState<FormData>({
//     firstName: "",
//     lastName: "",
//     email: "",
//     phone: "+993",
//     file: null,
//   })
//   const [errors, setErrors] = useState<FormErrors>({})
//   const [fileName, setFileName] = useState("")

//   const { mutate: submitOpenStore, isPending: loading } = useOpenStore()
//   const { toast } = useToast()

//   const t = translations || {
//     title: "Форма подачи заявления на открытие магазина",
//     firstName: "Имя",
//     lastName: "Фамилия",
//     email: "Email",
//     phone: "Телефон",
//     uploadPatent: "Загрузите патент на розничную торговлю (PDF, JPG)",
//     submit: "Отправить",
//     selectedFile: "Выбранный файл",
//     firstNameRequired: "Имя обязательно",
//     lastNameRequired: "Фамилия обязательна",
//     emailInvalid: "Некорректный email",
//     phoneInvalid: "Некорректный номер телефона",
//     fileRequired: "Патент обязателен",
//     fileSizeError: "Файл слишком большой (макс. 25MB)",
//     fileTypeError: "Только PDF и JPG документы",
//   }

//   const validateForm = (): boolean => {
//     const newErrors: FormErrors = {}

//     if (!formData.firstName.trim()) {
//       newErrors.firstName = t.firstNameRequired
//     }

//     if (!formData.lastName.trim()) {
//       newErrors.lastName = t.lastNameRequired
//     }

//     const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
//     if (!emailRegex.test(formData.email)) {
//       newErrors.email = t.emailInvalid
//     }

//     const phoneRegex = /^\+?[0-9]{6,15}$/
//     if (!phoneRegex.test(formData.phone)) {
//       newErrors.phone = t.phoneInvalid
//     }

//     if (!formData.file) {
//       newErrors.file = t.fileRequired
//     } else {
//       const allowedTypes = ["image/jpeg", "image/jpg", "application/pdf"]
//       if (!allowedTypes.includes(formData.file.type)) {
//         newErrors.file = t.fileTypeError
//       }
//       if (formData.file.size > 25 * 1024 * 1024) {
//         newErrors.file = t.fileSizeError
//       }
//     }

//     setErrors(newErrors)
//     return Object.keys(newErrors).length === 0
//   }

//   const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
//     const { name, value } = e.target
//     setFormData((prev) => ({ ...prev, [name]: value }))
//     if (errors[name as keyof FormErrors]) {
//       setErrors((prev) => ({ ...prev, [name]: undefined }))
//     }
//   }

//   const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
//     const file = e.target.files?.[0]
//     if (file) {
//       setFormData((prev) => ({ ...prev, file }))
//       setFileName(file.name)
//       if (errors.file) {
//         setErrors((prev) => ({ ...prev, file: undefined }))
//       }
//     }
//   }

//   const handleSubmit = (e: React.FormEvent) => {
//     e.preventDefault()

//     if (!validateForm()) return

//     if (formData.file) {
//       submitOpenStore(
//         {
//           firstName: formData.firstName,
//           lastName: formData.lastName,
//           email: formData.email,
//           phone: formData.phone,
//           patentFile: formData.file,
//         },
//         {
//           onSuccess: () => {
//             toast({
//               title: "Success",
//               description: "Your store request has been submitted successfully",
//             })
//             setFormData({
//               firstName: "",
//               lastName: "",
//               email: "",
//               phone: "+993",
//               file: null,
//             })
//             setFileName("")
//           },
//           onError: (error: any) => {
//             toast({
//               title: "Error",
//               description: error?.message || "Failed to submit store request",
//               variant: "destructive",
//             })
//           },
//         },
//       )
//     }
//   }

//   return (
//     <div className="min-h-screen bg-gray-50 flex items-center justify-center p-4">
//       <Card className="w-full max-w-md shadow-lg">
//         <CardHeader>
//           <CardTitle className="text-2xl text-center">{t.title}</CardTitle>
//           <CardDescription className="text-center">Заполните форму для подачи заявления</CardDescription>
//         </CardHeader>
//         <CardContent>
//           <form onSubmit={handleSubmit} className="space-y-4">
//             {/* First Name */}
//             <div className="space-y-2">
//               <Label htmlFor="firstName">{t.firstName}</Label>
//               <Input
//                 id="firstName"
//                 name="firstName"
//                 value={formData.firstName}
//                 onChange={handleInputChange}
//                 className={errors.firstName ? "border-red-500" : ""}
//               />
//               {errors.firstName && <p className="text-sm text-red-500">{errors.firstName}</p>}
//             </div>

//             {/* Last Name */}
//             <div className="space-y-2">
//               <Label htmlFor="lastName">{t.lastName}</Label>
//               <Input
//                 id="lastName"
//                 name="lastName"
//                 value={formData.lastName}
//                 onChange={handleInputChange}
//                 className={errors.lastName ? "border-red-500" : ""}
//               />
//               {errors.lastName && <p className="text-sm text-red-500">{errors.lastName}</p>}
//             </div>

//             {/* Email */}
//             <div className="space-y-2">
//               <Label htmlFor="email">{t.email}</Label>
//               <Input
//                 id="email"
//                 name="email"
//                 type="email"
//                 value={formData.email}
//                 onChange={handleInputChange}
//                 className={errors.email ? "border-red-500" : ""}
//               />
//               {errors.email && <p className="text-sm text-red-500">{errors.email}</p>}
//             </div>

//             {/* Phone */}
//             <div className="space-y-2">
//               <Label htmlFor="phone">{t.phone}</Label>
//               <Input
//                 id="phone"
//                 name="phone"
//                 value={formData.phone}
//                 onChange={handleInputChange}
//                 placeholder="+99361111111"
//                 className={errors.phone ? "border-red-500" : ""}
//               />
//               {errors.phone && <p className="text-sm text-red-500">{errors.phone}</p>}
//             </div>

//             {/* File Upload */}
//             <div className="space-y-2">
//               <Label htmlFor="file">{t.uploadPatent}</Label>
//               <div className="flex flex-col gap-2">
//                 <Input id="file" type="file" accept=".pdf,.jpg,.jpeg" onChange={handleFileChange} className="hidden" />
//                 <Button
//                   type="button"
//                   variant="outline"
//                   className="w-full bg-transparent"
//                   onClick={() => document.getElementById("file")?.click()}
//                 >
//                   <Upload className="mr-2 h-4 w-4" />
//                   {t.uploadPatent}
//                 </Button>
//                 {fileName && (
//                   <p className="text-sm text-gray-600">
//                     {t.selectedFile}: {fileName}
//                   </p>
//                 )}
//                 {errors.file && <p className="text-sm text-red-500">{errors.file}</p>}
//               </div>
//             </div>

//             {/* Submit Button */}
//             <Button type="submit" className="w-full" disabled={loading}>
//               {loading ? "Загрузка..." : t.submit}
//             </Button>
//           </form>
//         </CardContent>
//       </Card>
//     </div>
//   )
// }