Files
reui-blocks/blocks/experience1.tsx
T

109 lines
3.7 KiB
TypeScript

import { Download } from "lucide-react";
import React from "react";
import { Button } from "@/components/ui/button";
import { cn } from "@/lib/utils";
interface ExperienceItem {
period: string;
title: string;
description: string;
company: string;
logo: string;
}
interface Experience1Props {
heading?: string;
buttonText?: string;
buttonUrl?: string;
experience?: ExperienceItem[];
className?: string;
}
const Experience1 = ({
heading = "مسیر حرفه‌ای",
buttonText = "دانلود رزومه PDF",
buttonUrl = "#",
experience = [
{
period: "۱۴۰۴ - تاکنون",
title: "مهندس ارشد محصول",
description:
"رهبری توسعه پلتفرم سامانه مدیریت ارتباط با مشتری مقیاس‌پذیر؛ اتوماسیون فروش و داشبورد زنده برای تیم‌های سازمانی.",
company: "گوگل",
logo: "/block-media/shadcnblocks/block/logos/google-icon.svg",
},
{
period: "۱۴۲ - ۱۴۰۴",
title: "مهندس فول‌استک",
description:
"ساخت ماژول‌های قیف فروش و یکپارچه‌سازی برای مشتریان B2B با تمرکز روی تجربه کاربری.",
company: "مایکروسافت",
logo: "/block-media/shadcnblocks/block/logos/microsoft-icon.svg",
},
{
period: "۱۳۹۹ - ۱۴۱",
title: "مهندس تجربه محصول",
description:
"توسعه داشبوردهای واکنش‌گرا با تمرکز روی عملکرد گزارش و دسترس‌پذیری تیم فروش.",
company: "اپل",
logo: "/block-media/shadcnblocks/block/logos/apple-icon.svg",
},
{
period: "۱۳۹۸ - ۱۳۹۹",
title: "توسعه‌دهنده تازه‌کار",
description:
"همکاری در ساخت وب‌اپلیکیشن‌ها و یادگیری شیوه‌های مدرن توسعه. مشارکت در پروژه‌های تیمی و بازبینی کد.",
company: "نتفلیکس",
logo: "/block-media/shadcnblocks/block/logos/netflix-icon.svg",
},
],
className,
}: Experience1Props) => {
return (
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
<div className="container space-y-10 lg:space-y-20">
<div className="flex w-full items-end justify-between">
<h1 className="text-2xll font-semibold tracking-tighter lg:text-2xll">
{heading}
</h1>
<Button asChild variant="ghost" size="lg" className="font-semibold">
<a href={buttonUrl}>
{buttonText} <Download className="size-4" />
</a>
</Button>
</div>
<ul>
{experience.map((exp, index) => (
<li
key={index}
className="flex flex-col justify-between border-b py-10 md:flex-row"
>
<div className="max-w-lg text-xl tracking-tighter lg:w-1/3">
{exp.period}
</div>
<div className="lg:w-1/3">
<h2 className="mb-4 text-xl font-semibold tracking-tighter">
{exp.title}
</h2>
<p className="text-foreground/50">{exp.description}</p>
</div>
<div className="flex items-start justify-start gap-3 text-start lg:w-1/4">
<img
src={exp.logo}
alt={exp.company}
className="size-6 dark:invert"
/>
{exp.company}
</div>
</li>
))}
</ul>
</div>
</section>
);
};
export { Experience1 };