84 lines
2.5 KiB
TypeScript
84 lines
2.5 KiB
TypeScript
import { Switch } from "@/components/ui/switch";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface NotificationItem {
|
|
id: string;
|
|
title: string;
|
|
description: string;
|
|
enabled: boolean;
|
|
}
|
|
|
|
interface SettingsNotifications2Props {
|
|
heading?: string;
|
|
subHeading?: string;
|
|
className?: string;
|
|
notifications?: NotificationItem[];
|
|
}
|
|
|
|
const SettingsNotifications2 = ({
|
|
heading = "اعلان‌ها",
|
|
subHeading = "انتخاب کنید کدام اعلان‌ها را دریافت کنید.",
|
|
notifications = [
|
|
{
|
|
id: "email-updates",
|
|
title: "به‌روزرسانی‌های ایمیل",
|
|
description: "ایمیل‌های مربوط به فعالیت حساب و امنیت دریافت کنید.",
|
|
enabled: true,
|
|
},
|
|
{
|
|
id: "push-notifications",
|
|
title: "اعلان‌های فوری",
|
|
description: "اعلان‌های فوری را روی موبایل دریافت کنید.",
|
|
enabled: true,
|
|
},
|
|
{
|
|
id: "weekly-digest",
|
|
title: "خلاصه هفتگی",
|
|
description: "خلاصه هفتگی فعالیت و بینش‌ها را دریافت کنید.",
|
|
enabled: false,
|
|
},
|
|
{
|
|
id: "marketing-emails",
|
|
title: "ایمیل‌های بازاریابی",
|
|
description: "نکات، به‌روزرسانی محصول و پیشنهادهای تبلیغاتی دریافت کنید.",
|
|
enabled: false,
|
|
},
|
|
],
|
|
className,
|
|
}: SettingsNotifications2Props) => {
|
|
return (
|
|
<section className="py-32">
|
|
<div
|
|
className={cn(
|
|
"container max-w-2xl space-y-8 tracking-tight",
|
|
className,
|
|
)}
|
|
>
|
|
<div className="space-y-2">
|
|
<h3 className="text-xl font-semibold">{heading}</h3>
|
|
<p className="font-medium text-muted-foreground">{subHeading}</p>
|
|
</div>
|
|
|
|
<div className="divide-y">
|
|
{notifications.map((notification) => (
|
|
<div
|
|
key={notification.id}
|
|
className="flex items-center justify-between gap-4 py-4"
|
|
>
|
|
<div className="space-y-0.5">
|
|
<p className="font-medium">{notification.title}</p>
|
|
<p className="text-sm text-muted-foreground">
|
|
{notification.description}
|
|
</p>
|
|
</div>
|
|
<Switch defaultChecked={notification.enabled} />
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { SettingsNotifications2 };
|