78 lines
2.9 KiB
TypeScript
78 lines
2.9 KiB
TypeScript
import { Badge } from "@/components/ui/badge";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
export interface FaqItem {
|
|
question: string;
|
|
answer: string;
|
|
}
|
|
|
|
export interface Faq5Props {
|
|
badge?: string;
|
|
heading?: string;
|
|
description?: string;
|
|
faqs?: FaqItem[];
|
|
className?: string;
|
|
}
|
|
|
|
const defaultFaqs: FaqItem[] = [
|
|
{
|
|
question: "تیکت‌ها چطور به کارشناس درست می‌رسند؟",
|
|
answer:
|
|
"با قوانین مسیریابی بر اساس موضوع، اولویت و مهارت تیم، هر درخواست بدون صف دستی به مسئول مناسب ارجاع می‌شود.",
|
|
},
|
|
{
|
|
question: "آیا پاسخ‌های آماده داریم؟",
|
|
answer:
|
|
"کتابخانه پاسخ و ماکروها را تیم شما می‌سازد تا زمان پاسخ‌گویی کم شود و لحن پشتیبانی یکدست بماند.",
|
|
},
|
|
{
|
|
question: "SLA را چطور کنترل می‌کنم؟",
|
|
answer:
|
|
"زمان اولین پاسخ و حل را بر اساس پلن مشتری تعریف کنید؛ هشدار تخطی روی داشبورد و اعلان ظاهر می‌شود.",
|
|
},
|
|
{
|
|
question: "گفتگو از چند کانال جمع می‌شود؟",
|
|
answer:
|
|
"ایمیل، چت وب و پیام‌رسان در یک صندوق دیده می‌شوند تا تاریخچه مشتری پراکنده نماند.",
|
|
},
|
|
];
|
|
|
|
const Faq5 = ({
|
|
badge = "پشتیبانی مشتریان",
|
|
heading = "سوالات رایج درباره میز خدمت",
|
|
description = "مسیریابی تیکت، SLA و کانال‌های پشتیبانی را شفاف ببینید تا تیم خدمات سریع‌تر پاسخ دهد.",
|
|
faqs = defaultFaqs,
|
|
className,
|
|
}: Faq5Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container mx-auto max-w-3xl">
|
|
<div className="text-center">
|
|
<Badge className="text-xs font-medium">{badge}</Badge>
|
|
<h1 className="mt-4 text-xl font-semibold">{heading}</h1>
|
|
<p className="mt-6 font-medium text-muted-foreground">
|
|
{description}
|
|
</p>
|
|
</div>
|
|
<div className="mx-auto mt-14 max-w-xl text-start">
|
|
{faqs.map((faq, index) => (
|
|
<div key={index} className="mb-8 flex gap-4">
|
|
<span className="flex size-6 shrink-0 items-center justify-center rounded-sm bg-secondary font-mono text-xs text-primary">
|
|
{(index + 1).toLocaleString("fa-IR")}
|
|
</span>
|
|
<div>
|
|
<div className="mb-2 flex items-center justify-between">
|
|
<h3 className="font-medium">{faq.question}</h3>
|
|
</div>
|
|
<p className="text-sm text-muted-foreground">{faq.answer}</p>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Faq5 };
|