95 lines
2.8 KiB
TypeScript
95 lines
2.8 KiB
TypeScript
import type { LucideIcon } from "lucide-react";
|
|
import {
|
|
CheckIcon,
|
|
HeadphonesIcon,
|
|
PuzzleIcon,
|
|
ShieldCheckIcon,
|
|
} from "lucide-react";
|
|
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface FeatureGroup {
|
|
id: string;
|
|
title: string;
|
|
icon: LucideIcon;
|
|
features: { id: string; label: string }[];
|
|
}
|
|
|
|
const FEATURE_GROUPS: FeatureGroup[] = [
|
|
{
|
|
id: "security",
|
|
title: "نقش و دسترسی",
|
|
icon: ShieldCheckIcon,
|
|
features: [
|
|
{ id: "two-factor", label: "کار گروهی" },
|
|
{ id: "encryption", label: "همکاری تیمی" },
|
|
{ id: "audits", label: "مدیریت پروژه" },
|
|
{ id: "rbac", label: "همراستایی" },
|
|
{ id: "backup", label: "کار گروهی" },
|
|
],
|
|
},
|
|
{
|
|
id: "integration",
|
|
title: "چکلیست تحویل",
|
|
icon: PuzzleIcon,
|
|
features: [
|
|
{ id: "rest-api", label: "همکاری تیمی" },
|
|
{ id: "webhook", label: "مدیریت پروژه" },
|
|
{ id: "third-party", label: "همراستایی" },
|
|
{ id: "custom-endpoints", label: "کار گروهی" },
|
|
{ id: "docs", label: "همکاری تیمی" },
|
|
],
|
|
},
|
|
{
|
|
id: "support",
|
|
title: "گزارش پیشرفت",
|
|
icon: HeadphonesIcon,
|
|
features: [
|
|
{ id: "email-support", label: "مدیریت پروژه" },
|
|
{ id: "tutorials", label: "همراستایی" },
|
|
{ id: "knowledge-base", label: "کار گروهی" },
|
|
{ id: "forums", label: "همکاری تیمی" },
|
|
{ id: "webinars", label: "مدیریت پروژه" },
|
|
],
|
|
},
|
|
];
|
|
|
|
interface Feature229Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Feature229 = ({ className }: Feature229Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container">
|
|
<h2 className="max-w-5xl text-start text-xl text-balance md:text-2xll">
|
|
همکاری از راه دور را ساده کنید
|
|
</h2>
|
|
<div className="mt-16 grid gap-16 md:mt-20 md:grid-cols-3 md:gap-6">
|
|
{FEATURE_GROUPS.map((group) => (
|
|
<div key={group.id} className="text-start">
|
|
<span className="flex size-12 items-center justify-center rounded-xl bg-muted">
|
|
<group.icon className="size-5" />
|
|
</span>
|
|
<h3 className="my-6 font-semibold">{group.title}</h3>
|
|
<ul className="space-y-4">
|
|
{group.features.map((feature) => (
|
|
<li
|
|
key={feature.id}
|
|
className="flex items-center gap-2 text-pretty"
|
|
>
|
|
<CheckIcon className="size-4 shrink-0" />
|
|
{feature.label}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature229 };
|