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,186 @@
|
||||
"use client";
|
||||
|
||||
import { ArrowLeft, ArrowRight } from "lucide-react";
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
import { Button } from "@/components/ui/button";
|
||||
import type { CarouselApi } from "@/components/ui/carousel";
|
||||
import {
|
||||
Carousel,
|
||||
CarouselContent,
|
||||
CarouselItem,
|
||||
} from "@/components/ui/carousel";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
const projects17Prop = [
|
||||
{
|
||||
id: 1,
|
||||
title: "افزایش ۴۰٪ نرخ تبدیل",
|
||||
location: "شرکت SaaS B2B",
|
||||
year: "۱۴۰۳",
|
||||
category: "CRM",
|
||||
description:
|
||||
"پیاده‌سازی امتیازدهی لید و اتوماسیون ایمیل که نرخ تبدیل را از ۸٪ به ۲۲٪ رساند.",
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/photos/jeremy-bishop-iEjCQtcsVPY-unsplash.jpg",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "کاهش ۶۰٪ زمان پاسخ",
|
||||
location: "تیم پشتیبانی ۵۰ نفره",
|
||||
year: "۱۴۰۳",
|
||||
category: "پشتیبانی",
|
||||
description:
|
||||
"یکپارچه‌سازی CRM با سیستم تیکتینگ و خودکارسازی پاسخ به سوالات متداول.",
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/photos/ivan-bandura-hqnUYXsN5oY-unsplash.jpg",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "داشبورد فروش یکپارچه",
|
||||
location: "استارتاپ فناوری",
|
||||
year: "۱۴۰۲",
|
||||
category: "تحلیل",
|
||||
description:
|
||||
"ساخت داشبورد KPI برای نمایش درآمد، قیف فروش و پیش‌بینی فصلی در یک نما.",
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/photos/ivan-bandura-3QqzCTIfUJI-unsplash.jpg",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: "خودکارسازی کمپین ایمیل",
|
||||
location: "آژانس بازاریابی",
|
||||
year: "۱۴۰۲",
|
||||
category: "بازاریابی",
|
||||
description:
|
||||
"راه‌اندازی ۱۲ جریان ایمیل هدفمند با نرخ باز شدن ۲۶٪ و کلیک ۸٪.",
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/photos/kevin-charit-1fL2Q1JcbNc-unsplash.jpg",
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: "بهینه‌سازی SEO",
|
||||
location: "فروشگاه آنلاین",
|
||||
year: "۱۴۰۳",
|
||||
category: "سئو",
|
||||
description:
|
||||
"افزایش ترافیک ارگانیک ۸۵٪ با استراتژی محتوا و بهینه‌سازی فنی در ۶ ماه.",
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/photos/ines-alvarez-fdez-VjRc6HDXJ5s-unsplash.jpg",
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
title: "گزارش عملکرد فصلی",
|
||||
location: "شرکت سازمانی",
|
||||
year: "۱۴۰۲",
|
||||
category: "گزارش‌گیری",
|
||||
description:
|
||||
"گزارش تحلیلی سه‌ماهه با بررسی MRR، churn rate و LTV برای هیئت‌مدیره.",
|
||||
image:
|
||||
"/block-media/shadcnblocks/block/photos/john-murphey-ZWUWSEY6OGk-unsplash.jpg",
|
||||
},
|
||||
];
|
||||
|
||||
interface Projects17Props {
|
||||
className?: string;
|
||||
}
|
||||
|
||||
const Projects17 = ({ className }: Projects17Props) => {
|
||||
const [carouselApi, setCarouselApi] = useState<CarouselApi>();
|
||||
const [canScrollPrev, setCanScrollPrev] = useState(false);
|
||||
const [canScrollNext, setCanScrollNext] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (!carouselApi) return;
|
||||
const updateSelection = () => {
|
||||
setCanScrollPrev(carouselApi.canScrollPrev());
|
||||
setCanScrollNext(carouselApi.canScrollNext());
|
||||
};
|
||||
updateSelection();
|
||||
carouselApi.on("select", updateSelection);
|
||||
return () => {
|
||||
carouselApi.off("select", updateSelection);
|
||||
};
|
||||
}, [carouselApi]);
|
||||
|
||||
return (
|
||||
<section dir="rtl" lang="fa" className={cn("py-16", className)}>
|
||||
<div className="w-full">
|
||||
<div className="mb-16 px-8 text-start">
|
||||
<h1 className="text-3xl font-medium tracking-tight lg:text-6xl">
|
||||
پروژه‌ها
|
||||
</h1>
|
||||
</div>
|
||||
<div className="relative w-full">
|
||||
<Carousel
|
||||
dir="rtl"
|
||||
setApi={setCarouselApi}
|
||||
opts={{
|
||||
align: "start",
|
||||
direction: "rtl",
|
||||
loop: false,
|
||||
breakpoints: {
|
||||
"(max-width: 768px)": {
|
||||
dragFree: true,
|
||||
},
|
||||
},
|
||||
}}
|
||||
className="w-full"
|
||||
>
|
||||
<CarouselContent>
|
||||
{projects17Prop.map((project) => (
|
||||
<CarouselItem key={project.id} className="basis-auto ps-8">
|
||||
<div className="w-[500px] space-y-6 text-start">
|
||||
<div className="aspect-[4/3] overflow-hidden rounded-md">
|
||||
<img
|
||||
src={project.image || "/placeholder.svg"}
|
||||
alt={project.title}
|
||||
className="h-full w-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-4">
|
||||
<div className="space-y-2">
|
||||
<h2 className="text-2xl tracking-tight">
|
||||
{project.title}
|
||||
</h2>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{project.location}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<Button variant="secondary">مشاهده پروژه</Button>
|
||||
</div>
|
||||
</div>
|
||||
</CarouselItem>
|
||||
))}
|
||||
</CarouselContent>
|
||||
</Carousel>
|
||||
<div className="pointer-events-none absolute inset-x-4 inset-y-0 top-40 z-10 flex justify-between">
|
||||
<Button
|
||||
size="icon"
|
||||
variant="outline"
|
||||
onClick={() => carouselApi?.scrollPrev()}
|
||||
disabled={!canScrollPrev}
|
||||
className="pointer-events-auto ms-4 h-10 w-10 rounded-full border-gray-200 bg-white/90 hover:bg-white"
|
||||
>
|
||||
<ArrowRight className="h-4 w-4" />
|
||||
<span className="sr-only">اسلاید قبلی</span>
|
||||
</Button>
|
||||
<Button
|
||||
size="icon"
|
||||
variant="outline"
|
||||
onClick={() => carouselApi?.scrollNext()}
|
||||
disabled={!canScrollNext}
|
||||
className="pointer-events-auto me-4 h-10 w-10 rounded-full border-gray-200 bg-white/90 hover:bg-white"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
<span className="sr-only">اسلاید بعدی</span>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export { Projects17 };
|
||||
Reference in New Issue
Block a user