add question

src/app/product/components/AddComment.tsx

@@ -12,7 +12,7 @@ import Rate from 'rc-rate'
 import 'rc-rate/assets/index.css'
 import { Textarea } from '@/components/ui/textarea'
 import { useParams } from 'next/navigation'
-import { useAddComment, useGetDetailProduct } from '../hooks/useProductData'
+import { useAddComment } from '../hooks/useProductData'
 import { toast } from '@/components/Toast'
 import { extractErrorMessage } from '@/helpers/errorUtils'
 
@@ -32,7 +32,6 @@ const AddComment: FC<Props> = (props) => {
     const [currentAdvantage, setCurrentAdvantage] = useState<string>('')
     const [currentDisadvantage, setCurrentDisadvantage] = useState<string>('')
     const [rating, setRating] = useState<number>(0)
-    const { refetch } = useGetDetailProduct(id as string)
     const { mutate: addComment, isPending } = useAddComment()
 
     const validationSchema = yup.object({
@@ -100,7 +99,6 @@ const AddComment: FC<Props> = (props) => {
         addComment(data, {
             onSuccess: (res) => {
                 toast(res?.results?.message, 'success')
-                refetch()
                 close()
             },
             onError: (error: Error) => {

src/app/product/components/AddQuestion.tsx

@@ -0,0 +1,89 @@
+import DefaulModal from '@/components/DefaulModal'
+import { Button } from '@/components/ui/button'
+import { FC } from 'react'
+import { useForm } from 'react-hook-form'
+import { AddQuestionProps } from '../types/Types'
+import * as yup from 'yup'
+import { yupResolver } from '@hookform/resolvers/yup'
+import { Textarea } from '@/components/ui/textarea'
+import { useParams } from 'next/navigation'
+import { useAddQuestion } from '../hooks/useProductData'
+import { toast } from '@/components/Toast'
+import { extractErrorMessage } from '@/helpers/errorUtils'
+
+type Props = {
+    open: boolean,
+    close: () => void,
+}
+
+const AddQuestion: FC<Props> = (props) => {
+    const { open, close } = props
+    const { id } = useParams()
+    const { mutate: addQuestion, isPending } = useAddQuestion()
+
+    const validationSchema = yup.object({
+        content: yup.string().required('متن سوال خود را وارد کنید'),
+        productId: yup.string().optional()
+    })
+
+    const {
+        register,
+        handleSubmit,
+        formState: { errors },
+        reset
+    } = useForm({
+        resolver: yupResolver(validationSchema),
+        defaultValues: {
+            content: '',
+            productId: id as string
+        }
+    })
+
+    const onSubmit = (data: AddQuestionProps) => {
+        addQuestion(data, {
+            onSuccess: (res) => {
+                toast(res?.results?.message, 'success')
+                reset()
+                close()
+            },
+            onError: (error: Error) => {
+                toast(extractErrorMessage(error), 'error')
+            }
+        })
+    }
+
+    return (
+        <DefaulModal
+            open={open}
+            close={close}
+            isHeader
+            title_header='ثبت سوال'
+        >
+            <form onSubmit={handleSubmit(onSubmit)} className="space-y-6">
+                {/* متن سوال */}
+                <div className="space-y-2">
+                    <label className="text-sm font-medium text-gray-700">
+                        متن سوال شما
+                    </label>
+                    <Textarea
+                        {...register('content')}
+                        placeholder="سوال خود را در مورد این محصول بپرسید..."
+                        className="w-full h-32 p-3 text-sm rounded-xl border border-[#D0D0D0] resize-none focus:outline-none focus:ring-2 focus:ring-primary/20"
+                        error_text={errors.content?.message}
+                    />
+                </div>
+
+                {/* دکمه ثبت */}
+                <Button
+                    type="submit"
+                    className="w-full"
+                    isLoading={isPending}
+                >
+                    ثبت سوال
+                </Button>
+            </form>
+        </DefaulModal>
+    )
+}
+
+export default AddQuestion

src/app/product/components/Questions.tsx

@@ -4,6 +4,7 @@ import { FC, Fragment, useMemo, useState } from 'react'
 import { Button } from '@/components/ui/button'
 import { ArrowDown2, MessageQuestion } from 'iconsax-react'
 import { Product, Question } from '@/types/product.types'
+import AddQuestion from './AddQuestion'
 
 interface QuestionsProps {
     product: Product
@@ -13,7 +14,7 @@ interface QuestionsProps {
 const Questions: FC<QuestionsProps> = ({ questions = [] }) => {
     const [sort, setSort] = useState<'new' | 'answers'>('new')
     const [expandedId, setExpandedId] = useState<string | null>(null)
-
+    const [open, setOpen] = useState(false)
     const sorted = useMemo(() => {
         if (sort === 'new') {
             return [...questions].sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime())
@@ -121,10 +122,13 @@ const Questions: FC<QuestionsProps> = ({ questions = [] }) => {
                         <div className="mt-3 sm:mt-4 text-xs text-[#7F7F7F] leading-5 sm:leading-6 text-justify">
                             شما هم درباره این کالا پرسش خود را ثبت کنید
                         </div>
-                        <Button className="w-full mt-4 sm:mt-5 text-xs sm:text-sm">ثبت پرسش</Button>
+                        <Button className="w-full mt-4 sm:mt-5 text-xs sm:text-sm" onClick={() => setOpen(true)}>ثبت پرسش</Button>
                     </div>
                 </div>
             </div>
+
+            <AddQuestion open={open} close={() => setOpen(false)} />
+
         </div>
     )
 }

src/app/product/hooks/useProductData.ts

@@ -18,3 +18,9 @@ export const useAddComment = () => {
     mutationFn: api.addComment,
   });
 };
+
+export const useAddQuestion = () => {
+  return useMutation({
+    mutationFn: api.addQuestion,
+  });
+};

src/app/product/service/Service.ts

@@ -1,6 +1,6 @@
 import axios from "@/config/axios";
 import { ProductDetailResponse } from "@/types/product.types";
-import { AddCommentProps } from "../types/Types";
+import { AddCommentProps, AddQuestionProps } from "../types/Types";
 
 export const getProduct = async (
   id: string
@@ -16,3 +16,11 @@ export const addComment = async (params: AddCommentProps) => {
   );
   return data;
 };
+
+export const addQuestion = async (params: AddQuestionProps) => {
+  const { data } = await axios.post(
+    `/product/${params.productId}/questions`,
+    params
+  );
+  return data;
+};

src/app/product/types/Types.ts

@@ -6,3 +6,8 @@ export type AddCommentProps = {
   rate: number;
   productId?: string;
 };
+
+export type AddQuestionProps = {
+  content: string;
+  productId?: string;
+};