Initial import of 1407 block sources under blocks/
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
ar.badiei
@@ -0,0 +1,219 @@
|
||||
import { ArrowRight } from "lucide-react";
|
||||
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
interface IntegrationItem {
|
||||
image: string;
|
||||
title: string;
|
||||
description: string;
|
||||
isConnected?: boolean;
|
||||
link: string;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
interface CtaText {
|
||||
title: string;
|
||||
ctaText: string;
|
||||
ctaLink: string;
|
||||
}
|
||||
|
||||
interface SettingsIntegrations2Props {
|
||||
heading?: string;
|
||||
description?: CtaText[];
|
||||
integrations?: IntegrationItem[];
|
||||
}
|
||||
|
||||
const SettingsIntegrations2 = ({
|
||||
heading = "یکپارچه‌سازی‌ها",
|
||||
description = [
|
||||
{
|
||||
title:
|
||||
"با اتصال اپلیکیشن‌ها و سرویس‌های محبوبتان، گردش کار خود را بهبود دهید.",
|
||||
ctaText: "بیشتر بدانید",
|
||||
ctaLink: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
title: "سؤالی درباره راه‌اندازی یکپارچه‌سازی‌ها دارید؟",
|
||||
ctaText: "صحبت با فروش",
|
||||
ctaLink: "https://ShadcnBlocks",
|
||||
},
|
||||
],
|
||||
integrations = [
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/logos/slack-icon.svg",
|
||||
title: "Slack",
|
||||
description: "اعلان‌ها و به‌روزرسانی‌ها را به کانال‌های تیم ارسال کنید.",
|
||||
isConnected: true,
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/mainline/logos/drive.svg",
|
||||
title: "فضای ابری",
|
||||
description: "به فایل‌های فضای ابری دسترسی داشته باشید و آن‌ها را همگام‌سازی کنید.",
|
||||
isConnected: true,
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/logos/notion-icon.svg",
|
||||
title: "Notion",
|
||||
description: "صفحات و پایگاه‌های داده فضای کاری را همگام‌سازی کنید.",
|
||||
isConnected: true,
|
||||
link: "https://ShadcnBlocks",
|
||||
className: "dark:invert",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/mainline/logos/jira.svg",
|
||||
title: "Jira",
|
||||
description: "مسائل را پیگیری کنید و پروژه‌های چابک خود را مدیریت کنید.",
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/mainline/logos/asana.svg",
|
||||
title: "Asana",
|
||||
description: "وظایف را مدیریت کنید و با تیم همکاری کنید.",
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/logos/dropbox-icon.svg",
|
||||
title: "Dropbox",
|
||||
description: "فایل‌ها را به‌صورت امن در فضای ابری ذخیره و به اشتراک بگذارید.",
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/logos/figma-icon.svg",
|
||||
title: "Figma",
|
||||
description: "طرح‌ها را وارد کنید و روی نمونه‌ها همکاری کنید.",
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/logos/github-icon.svg",
|
||||
title: "GitHub",
|
||||
description: "مخازن را متصل کنید و گردش کارها را خودکار کنید.",
|
||||
isConnected: true,
|
||||
link: "https://ShadcnBlocks",
|
||||
className: "dark:invert",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/ecommerce/payment-methods/stripe.svg",
|
||||
title: "Stripe",
|
||||
description: "پرداخت‌ها را پردازش کنید و اشتراک‌ها را مدیریت کنید.",
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/mainline/logos/confluence.svg",
|
||||
title: "Confluence",
|
||||
description: "مستندات تیم را ایجاد و به اشتراک بگذارید.",
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/mainline/logos/monday.svg",
|
||||
title: "Monday",
|
||||
description: "گردش کارها را ساماندهی کنید و پیشرفت پروژه را پیگیری کنید.",
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/mainline/logos/excel.svg",
|
||||
title: "Excel",
|
||||
description: "داده‌های جدول را به‌راحتی وارد و صادر کنید.",
|
||||
isConnected: true,
|
||||
link: "https://ShadcnBlocks",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/logos/vercel-icon.svg",
|
||||
title: "Vercel",
|
||||
description: "اپلیکیشن‌های وب را مستقر کنید و پیش‌نمایش بگیرید.",
|
||||
isConnected: true,
|
||||
link: "https://ShadcnBlocks",
|
||||
className: "dark:invert",
|
||||
},
|
||||
{
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/mainline/logos/retool.svg",
|
||||
title: "Retool",
|
||||
description: "ابزارها و داشبوردهای داخلی سفارشی بسازید.",
|
||||
link: "https://ShadcnBlocks",
|
||||
className: "dark:invert",
|
||||
},
|
||||
],
|
||||
}: SettingsIntegrations2Props) => {
|
||||
return (
|
||||
<section className="py-32">
|
||||
<div className="container max-w-4xl">
|
||||
<div className="flex flex-col gap-3">
|
||||
<p className="text-xl font-semibold tracking-tight sm:text-xl">
|
||||
{heading}
|
||||
</p>
|
||||
<div className="space-y-1 sm:space-y-0">
|
||||
{description.map((item, i) => {
|
||||
return (
|
||||
<p
|
||||
key={`description-${i}`}
|
||||
className="flex flex-wrap items-center gap-1 gap-y-0 text-xs text-muted-foreground sm:text-sm sm:leading-tight"
|
||||
>
|
||||
{item.title}
|
||||
<a href={item.ctaLink} className="underline">
|
||||
{item.ctaText}
|
||||
</a>
|
||||
</p>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<ul className="mt-8">
|
||||
{integrations.map((integration, i) => {
|
||||
return (
|
||||
<li
|
||||
key={`integration-${i}-${integration.title}`}
|
||||
className="border-t last:border-b"
|
||||
>
|
||||
<a
|
||||
href={integration.link}
|
||||
className="group flex cursor-pointer items-center gap-4 py-6 hover:bg-muted/50 sm:px-2"
|
||||
>
|
||||
<img
|
||||
src={integration.image}
|
||||
alt={integration.title}
|
||||
className={cn("size-6", integration.className)}
|
||||
/>
|
||||
<div className="flex-1 text-sm">
|
||||
<p className="font-medium">{integration.title}</p>
|
||||
<p className="text-xs text-muted-foreground">
|
||||
{integration.description}
|
||||
</p>
|
||||
</div>
|
||||
{integration.isConnected ? (
|
||||
<div>
|
||||
<Badge className="bg-green-100 text-green-800">
|
||||
متصل
|
||||
</Badge>
|
||||
</div>
|
||||
) : (
|
||||
<div className="opacity-0 group-hover:opacity-100">
|
||||
<ArrowRight className="size-5 text-muted-foreground rtl:rotate-180" />
|
||||
</div>
|
||||
)}
|
||||
</a>
|
||||
</li>
|
||||
);
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export { SettingsIntegrations2 };
|
||||
Reference in New Issue
Block a user