75 lines
1.8 KiB
TypeScript
75 lines
1.8 KiB
TypeScript
"use client";
|
|
|
|
import { X } from "lucide-react";
|
|
import { useState } from "react";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Banner1Props {
|
|
title: string;
|
|
description: string;
|
|
linkText: string;
|
|
linkUrl: string;
|
|
defaultVisible?: boolean;
|
|
className?: string;
|
|
}
|
|
|
|
const Banner1 = ({
|
|
title = "نسخه ۲.۰ منتشر شد",
|
|
description = "جزئیات این نسخه را",
|
|
linkText = "مشاهده کنید",
|
|
linkUrl = "#",
|
|
defaultVisible = true,
|
|
className,
|
|
}: Banner1Props) => {
|
|
const [isVisible, setIsVisible] = useState(defaultVisible);
|
|
|
|
const handleClose = () => {
|
|
setIsVisible(false);
|
|
};
|
|
|
|
if (!isVisible) return null;
|
|
|
|
return (
|
|
<section
|
|
dir="rtl"
|
|
lang="fa"
|
|
className={cn("w-full border-b bg-background px-4 py-3", className)}
|
|
>
|
|
<div className="flex items-center justify-between gap-2">
|
|
<div className="flex-1 text-center">
|
|
<span className="text-sm">
|
|
<span className="font-medium">{title}</span>{" "}
|
|
<span className="text-muted-foreground">
|
|
{description}{" "}
|
|
<a
|
|
href={linkUrl}
|
|
className="underline underline-offset-2 hover:text-foreground"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
{linkText}
|
|
</a>
|
|
.
|
|
</span>
|
|
</span>
|
|
</div>
|
|
|
|
<Button
|
|
type="button"
|
|
variant="ghost"
|
|
size="icon"
|
|
className="-ms-2 h-8 w-8 flex-none"
|
|
aria-label="بستن"
|
|
onClick={handleClose}
|
|
>
|
|
<X className="h-4 w-4" />
|
|
</Button>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Banner1 };
|