99 lines
3.7 KiB
TypeScript
99 lines
3.7 KiB
TypeScript
"use client";
|
|
|
|
import * as React from "react";
|
|
|
|
import {
|
|
Accordion,
|
|
AccordionContent,
|
|
AccordionItem,
|
|
AccordionTrigger,
|
|
} from "@/components/ui/accordion";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const FAQ_QUESTIONS = [
|
|
{
|
|
question: "این بخش چه کاربردی دارد؟",
|
|
answer:
|
|
"در این بخش پاسخ رایجترین پرسشهای کاربران درباره خدمات و امکانات سامانه ارائه شده است.",
|
|
},
|
|
{
|
|
question: "هدف این بخش چیست؟",
|
|
answer:
|
|
"هدف این بخش کاهش نیاز به تماس با پشتیبانی و دسترسی سریع کاربران به اطلاعات موردنیاز است.",
|
|
},
|
|
{
|
|
question: "چگونه پرسشهای متداول را طراحی کنیم؟",
|
|
answer:
|
|
"پرسشهای پرتکرار کاربران را جمعآوری کرده و پاسخهایی کوتاه، دقیق و شفاف برای هرکدام آماده کنید.",
|
|
},
|
|
{
|
|
question: "مزیت وجود این بخش چیست؟",
|
|
answer:
|
|
"این بخش باعث افزایش رضایت کاربران، کاهش درخواستهای پشتیبانی و دسترسی سریعتر به اطلاعات میشود.",
|
|
},
|
|
{
|
|
question: "این بخش چه کاربردی دارد؟",
|
|
answer:
|
|
"در این بخش پاسخ رایجترین پرسشهای کاربران درباره خدمات و امکانات سامانه ارائه شده است.",
|
|
},
|
|
{
|
|
question: "هدف این بخش چیست؟",
|
|
answer:
|
|
"هدف این بخش کاهش نیاز به تماس با پشتیبانی و دسترسی سریع کاربران به اطلاعات موردنیاز است.",
|
|
},
|
|
{
|
|
question: "چگونه پرسشهای متداول را طراحی کنیم؟",
|
|
answer:
|
|
"پرسشهای پرتکرار کاربران را جمعآوری کرده و پاسخهایی کوتاه، دقیق و شفاف برای هرکدام آماده کنید.",
|
|
},
|
|
{
|
|
question: "مزیت وجود این بخش چیست؟",
|
|
answer:
|
|
"این بخش باعث افزایش رضایت کاربران، کاهش درخواستهای پشتیبانی و دسترسی سریعتر به اطلاعات میشود.",
|
|
},
|
|
];
|
|
|
|
interface Faq16Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Faq16 = ({ className }: Faq16Props) => {
|
|
return (
|
|
<section
|
|
dir="rtl"
|
|
lang="fa"
|
|
className={cn("bg-background py-32", className)}
|
|
>
|
|
<div className="container mx-auto max-w-3xl">
|
|
<h1 className="mb-10 text-center text-2xll font-bold tracking-tighter text-foreground">
|
|
پرسشهای متداول
|
|
</h1>
|
|
<div className="z-20 mx-auto max-w-2xl rounded-2xl border border-border bg-background p-3">
|
|
<Accordion
|
|
type="single"
|
|
collapsible
|
|
className="flex w-full flex-col items-center justify-center gap-3 text-start"
|
|
>
|
|
{FAQ_QUESTIONS.map((item, index) => (
|
|
<AccordionItem
|
|
value={index.toString()}
|
|
key={index}
|
|
className="m-0 w-full rounded-xl bg-muted px-4 py-2"
|
|
>
|
|
<AccordionTrigger className="flex flex-1 justify-between text-start font-semibold transition-all hover:no-underline">
|
|
{item.question}
|
|
</AccordionTrigger>
|
|
<AccordionContent className="mt-2 text-muted-foreground">
|
|
{item.answer}
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
))}
|
|
</Accordion>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Faq16 };
|