116 lines
3.6 KiB
TypeScript
116 lines
3.6 KiB
TypeScript
import type { ReactNode } from "react";
|
|
import {
|
|
BatteryCharging,
|
|
GitPullRequest,
|
|
Layers,
|
|
RadioTower,
|
|
SquareKanban,
|
|
WandSparkles,
|
|
} from "lucide-react";
|
|
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Feature {
|
|
heading: string;
|
|
description: string;
|
|
icon: ReactNode;
|
|
}
|
|
|
|
interface Feature17Props {
|
|
label?: string;
|
|
title?: string;
|
|
features: Feature[];
|
|
buttonText?: string;
|
|
buttonUrl?: string;
|
|
className?: string;
|
|
}
|
|
|
|
const Feature17 = ({
|
|
label = "تحلیل داده",
|
|
title = "داده پراکنده را به تصمیم تبدیل کنید",
|
|
features = [
|
|
{
|
|
heading: "داشبورد سفارشی",
|
|
description:
|
|
"ویجت‌های موردنیاز هر تیم را بچینید و فقط معیارهای مرتبط را ببینید.",
|
|
icon: <GitPullRequest className="size-4 md:size-6" />,
|
|
},
|
|
{
|
|
heading: "فیلتر پیشرفته",
|
|
description:
|
|
"داده را بر اساس محصول، منطقه یا کانال برش دهید و الگو پیدا کنید.",
|
|
icon: <SquareKanban className="size-4 md:size-6" />,
|
|
},
|
|
{
|
|
heading: "نمودار روند",
|
|
description:
|
|
"تغییرات مهم را در طول زمان دنبال کنید و نقطه عطف را شناسایی کنید.",
|
|
icon: <RadioTower className="size-4 md:size-6" />,
|
|
},
|
|
{
|
|
heading: "هشدار آستانه",
|
|
description:
|
|
"وقتی شاخص از حد مجاز گذشت، فوراً مطلع شوید.",
|
|
icon: <WandSparkles className="size-4 md:size-6" />,
|
|
},
|
|
{
|
|
heading: "گزارش زمان‌بندی‌شده",
|
|
description:
|
|
"ویجت‌های موردنیاز هر تیم را بچینید و فقط معیارهای مرتبط را ببینید.",
|
|
icon: <Layers className="size-4 md:size-6" />,
|
|
},
|
|
{
|
|
heading: "تحلیل کوHORT",
|
|
description:
|
|
"داده را بر اساس محصول، منطقه یا کانال برش دهید و الگو پیدا کنید.",
|
|
icon: <BatteryCharging className="size-4 md:size-6" />,
|
|
},
|
|
],
|
|
buttonText = "داشبورد سفارشی",
|
|
buttonUrl = "https://ShadcnBlocks",
|
|
className,
|
|
}: Feature17Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container">
|
|
{(label || title) && (
|
|
<div className="mb-12 flex max-w-3xl flex-col gap-4">
|
|
<Badge variant="secondary">{label}</Badge>
|
|
<h2 className="text-3xl font-medium md:text-xl lg:text-2xll">
|
|
{title}
|
|
</h2>
|
|
</div>
|
|
)}
|
|
<div className="grid gap-12 md:grid-cols-2">
|
|
{features.map((feature, idx) => (
|
|
<div className="flex gap-6 space-y-4 rounded-lg md:block" key={idx}>
|
|
<span className="flex size-10 shrink-0 items-center justify-center rounded-full bg-accent md:size-12">
|
|
{feature.icon}
|
|
</span>
|
|
<div>
|
|
<h3 className="font-medium md:mb-2 md:text-xl">
|
|
{feature.heading}
|
|
</h3>
|
|
<p className="text-sm text-muted-foreground md:text-base">
|
|
{feature.description}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
{buttonUrl && (
|
|
<div className="mt-16 flex justify-center">
|
|
<Button size="lg" asChild>
|
|
<a href={buttonUrl}>{buttonText}</a>
|
|
</Button>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature17 };
|