file name and location updayed for better be

2026-03-07 16:31:18 +05:00
parent b838025ab0
commit 809438735f
82 changed files with 87 additions and 470 deletions
--- a/pages/faq/answearQuestions.tsx
+++ b/pages/faq/answearQuestions.tsx
@@ -0,0 +1,93 @@
+"use client";
+import Link from "next/link";
+import FAQAccordion, { FAQItem } from "./faqAccardion";
+import { useTranslations } from "next-intl";
+import { useQuery } from "@tanstack/react-query";
+import httpClient from "@/request/api";
+import { endPoints } from "@/request/links";
+import { useEffect, useState } from "react";
+
+export function Togle() {
+  const t = useTranslations();
+  const faqItems: FAQItem[] = [
+    {
+      id: 1,
+      question: t("faq.question1.question"),
+      answer: t("faq.question1.answer"),
+    },
+    {
+      id: 2,
+      question: t("faq.question2.question"),
+      answer: t("faq.question2.answer"),
+    },
+    {
+      id: 3,
+      question: t("faq.question3.question"),
+      answer: t("faq.question3.answer"),
+    },
+    {
+      id: 4,
+      question: t("faq.question4.question"),
+      answer: t("faq.question4.answer"),
+    },
+    {
+      id: 5,
+      question: t("faq.question5.question"),
+      answer: t("faq.question5.answer"),
+    },
+  ];
+  const [faq, setFaq] = useState<any>(faqItems);
+
+  const { data } = useQuery({
+    queryKey: ["faq"],
+    queryFn: () => httpClient(endPoints.faq),
+    select: (data) => data?.data?.results,
+  });
+
+  useEffect(() => {
+    data && setFaq(data);
+  }, [data]);
+
+  return (
+    <div className="min-h-screen bg-[#1e1d1c]">
+      <main className="mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
+        {/* Header Section */}
+        <div className="mb-16 flex items-start justify-between gap-4 lg:gap-12">
+          <div className="flex items-center md:col-span-1">
+            <h1
+              className="font-unbounded uppercase bg-linear-to-br from-white via-white/50 to-black
+  text-transparent bg-clip-text text-3xl font-bold leading-tight sm:text-4xl md:text-5xl lg:text-6xl"
+            >
+              {t("faq.banner.topic")}
+            </h1>
+          </div>
+
+          {/* FAQ Section */}
+          <div className="max-w-250 w-full">
+            <FAQAccordion items={faq} />
+          </div>
+        </div>
+        {/* ASK QUESTION */}
+        <div className="space-y-8 w-full mt-10 ">
+          <h1
+            className="font-unbounded uppercase text-center bg-linear-to-br from-white via-white/50 to-black
+  text-transparent bg-clip-text text-3xl font-bold leading-tight sm:text-4xl md:text-5xl lg:text-6xl"
+          >
+            {t("faq.ask.question")}
+          </h1>
+          <p className="font-almarai text-center text-white/80 text-lg">
+            {t("faq.ask.subtitle")}
+          </p>
+          <div className="w-full flex items-center justify-center">
+            <Link
+              href={"/contact"}
+              className="font-almarai mx-auto shadow-[0px_0px_2px_8px_#ff01015c] bg-red-600 hover:bg-red-700 text-white font-bold py-3 px-8 rounded-full transition duration-300 transform hover:scale-105 w-fit"
+            >
+              {t("faq.ask.btn")}
+            </Link>
+          </div>
+        </div>
+      </main>
+    </div>
+  );
+}