faq

src/app/faq/hooks/useFaqData.ts

@@ -0,0 +1,10 @@
+import { useQuery } from "@tanstack/react-query";
+import { getFaq } from "../service/FaqService";
+
+export const useGetFaq = (page: string) => {
+  return useQuery({
+    queryKey: ["faq"],
+    queryFn: () => getFaq(page),
+    enabled: !!page,
+  });
+};

src/app/faq/page.tsx

@@ -3,35 +3,40 @@
 import { NextPage } from 'next'
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion'
 import Layout from '@/hoc/Layout'
-import { SHOP_CONFIG } from '@/config/const'
+import { useGetFaq } from './hooks/useFaqData'
+import { FaqItem } from './types/Types'
+import PageLoading from '@/components/PageLoading'
 
 const FaqPage: NextPage = () => {
-    const faqData = [
-        {
-            question: "ثبت نام به عنوان فروشنده در دیجی کالا به چه معناست؟",
-            answer: "با تکمیل ثبت نام پنل آنلاین فروشگاهی از دیجی کالا دریافت میکنید که میتوانید کالاهای خود را به صورت آنلاین به تمام نقاط ایران به فروش برسانید کار با این پنل بسیار ساده است و اصلا نیاز به تخصص خاصی ندارد."
-        },
-        {
-            question: "در مراحل ثبت نام خطای تکراری بودن شماره ملی را دریافت میکنم",
-            answer: "این خطا معمولاً زمانی رخ می‌دهد که شماره ملی قبلاً در سیستم ثبت شده است. در صورت اطمینان از صحت اطلاعات، با پشتیبانی تماس بگیرید."
-        },
-        {
-            question: `برای ثبت نام در ${SHOP_CONFIG.fullName} به چه مدارکی نیاز است؟`,
-            answer: `برای ثبت نام در ${SHOP_CONFIG.fullName} نیاز به مدارک شناسایی، مجوزهای کسب و کار و اطلاعات بانکی معتبر دارید.`
-        },
-        {
-            question: "نام تجاری به چه معناست ؟",
-            answer: "نام تجاری نامی است که کسب و کار شما با آن شناخته می‌شود و می‌تواند متفاوت از نام قانونی شرکت باشد."
-        },
-        {
-            question: "در مراحل ثبت نام پس از وارد کردن شماره شبا خطا دریافت میکنم",
-            answer: "اطمینان حاصل کنید که شماره شبا به درستی وارد شده و متعلق به حساب بانکی معتبر است."
-        },
-        {
-            question: "در مورد بندهای قرارداد سوال دارم",
-            answer: "برای دریافت اطلاعات دقیق در مورد بندهای قرارداد، لطفاً با بخش حقوقی یا پشتیبانی تماس بگیرید."
-        }
-    ]
+
+    const { data, isLoading, error } = useGetFaq('Faq');
+
+    if (isLoading) {
+        return (
+            <Layout>
+                <PageLoading />
+            </Layout>
+        )
+    }
+
+    if (error) {
+        return (
+            <Layout>
+                <div className="min-h-screen bg-white py-6 px-4 sm:py-8 sm:px-6 md:py-12 md:px-8 lg:px-20">
+                    <div className="text-center">
+                        <h1 className="text-lg sm:text-xl md:text-2xl font-bold text-gray-800 mb-4">
+                            خطا در بارگذاری اطلاعات
+                        </h1>
+                        <p className="text-gray-600 text-sm sm:text-base">
+                            متاسفانه در بارگذاری سوالات متداول مشکلی پیش آمده است. لطفا دوباره تلاش کنید.
+                        </p>
+                    </div>
+                </div>
+            </Layout>
+        )
+    }
+
+    const faqData: FaqItem[] = data?.results?.faqs || []
 
     return (
         <Layout>
@@ -42,9 +47,9 @@ const FaqPage: NextPage = () => {
                         <h1 className="text-lg sm:text-xl md:text-2xl font-bold text-gray-800 mb-2 sm:mb-3">
                             سوالات متداول
                         </h1>
-                        <p className="text-gray-600 text-sm sm:text-base leading-relaxed mx-auto max-w-3xl">
+                        {/* <p className="text-gray-600 text-sm sm:text-base leading-relaxed mx-auto max-w-3xl">
                             لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است
-                        </p>
+                        </p> */}
                     </div>
 
                     {/* FAQ Section */}

src/app/faq/service/FaqService.ts

@@ -0,0 +1,6 @@
+import axios from "@/config/axios";
+
+export const getFaq = async (page: string) => {
+  const { data } = await axios.get(`/faq?page=${page}`);
+  return data;
+};

src/app/faq/types/Types.ts

@@ -0,0 +1,20 @@
+export interface FaqItem {
+  _id: string;
+  question: string;
+  answer: string;
+  page: string;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface FaqResponse {
+  status: number;
+  success: boolean;
+  results: {
+    faqs: FaqItem[];
+  };
+}
+
+export interface FaqParams {
+  page: string;
+}