106 lines
3.2 KiB
TypeScript
106 lines
3.2 KiB
TypeScript
import type { ReactNode } from "react";
|
|
import {
|
|
BatteryCharging,
|
|
GitPullRequest,
|
|
Layers,
|
|
RadioTower,
|
|
SquareKanban,
|
|
WandSparkles,
|
|
} from "lucide-react";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Feature {
|
|
heading: string;
|
|
description: string;
|
|
icon: ReactNode;
|
|
}
|
|
|
|
interface Feature43Props {
|
|
title?: string;
|
|
features?: Feature[];
|
|
buttonText?: string;
|
|
buttonUrl?: string;
|
|
className?: string;
|
|
}
|
|
|
|
const Feature43 = ({
|
|
title = "زمان حل مسئله را کوتاه کنید",
|
|
features = [
|
|
{
|
|
heading: "تاریخچه مشتری",
|
|
description:
|
|
"پاسخ‌های پرتکرار را ذخیره کنید و با یک کلیک ارسال کنید.",
|
|
icon: <GitPullRequest className="size-6" />,
|
|
},
|
|
{
|
|
heading: "صندوق یکپارچه",
|
|
description:
|
|
"همه کانال‌های ارتباطی را در یک محیط مدیریت کنید و هیچ پیامی گم نشود.",
|
|
icon: <SquareKanban className="size-6" />,
|
|
},
|
|
{
|
|
heading: "اولویت‌بندی تیکت",
|
|
description:
|
|
"تیکت‌های مهم بر اساس قرارداد یا شدت مسئله در صف بالاتر قرار می‌گیرند.",
|
|
icon: <RadioTower className="size-6" />,
|
|
},
|
|
{
|
|
heading: "پایگاه دانش",
|
|
description:
|
|
"مشتریان و تیم با مقالات راهنما سریع‌تر به پاسخ می‌رسند.",
|
|
icon: <WandSparkles className="size-6" />,
|
|
},
|
|
{
|
|
heading: "پاسخ آماده",
|
|
description:
|
|
"پاسخ‌های پرتکرار را ذخیره کنید و با یک کلیک ارسال کنید.",
|
|
icon: <Layers className="size-6" />,
|
|
},
|
|
{
|
|
heading: "SLA هوشمند",
|
|
description:
|
|
"همه کانال‌های ارتباطی را در یک محیط مدیریت کنید و هیچ پیامی گم نشود.",
|
|
icon: <BatteryCharging className="size-6" />,
|
|
},
|
|
],
|
|
buttonText = "رضایت مشتری",
|
|
buttonUrl = "https://ShadcnBlocks",
|
|
className,
|
|
}: Feature43Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container">
|
|
{title && (
|
|
<div className="mx-auto mb-16 max-w-3xl text-center">
|
|
<h2 className="text-xl font-medium text-pretty lg:text-2xll">
|
|
{title}
|
|
</h2>
|
|
</div>
|
|
)}
|
|
<div className="grid gap-10 md:grid-cols-2 lg:grid-cols-3">
|
|
{features.map((feature, i) => (
|
|
<div key={i} className="flex flex-col">
|
|
<div className="mb-5 flex size-16 items-center justify-center rounded-full bg-accent">
|
|
{feature.icon}
|
|
</div>
|
|
<h3 className="mb-2 text-xl font-semibold">{feature.heading}</h3>
|
|
<p className="text-muted-foreground">{feature.description}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
{buttonUrl && (
|
|
<div className="mt-16 flex justify-center">
|
|
<Button size="lg" asChild>
|
|
<a href={buttonUrl}>{buttonText}</a>
|
|
</Button>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature43 };
|