1import { type FC, type PropsWithChildren, useEffect } from "react";
 2import {
 3    ScrollArea,
 4    Sheet,
 5    SheetContent,
 6    SheetHeader,
 7    SheetTitle,
 8} from "@marzneshin/common/components";
 9import { useTranslation } from "react-i18next";
10
11export interface SettingsDialogProps {
12    onOpenChange: (state: boolean) => void;
13    open: boolean;
14    onClose?: () => void;
15}
16
17export const SettingsDialog: FC<SettingsDialogProps & PropsWithChildren> = ({
18    open,
19    onOpenChange,
20    children,
21    onClose = () => null,
22}) => {
23    const { t } = useTranslation();
24
25    useEffect(() => {
26        if (!open) onClose();
27    }, [open, onClose]);
28
29    return (
30        <Sheet open={open} onOpenChange={onOpenChange}>
31            <SheetContent className="sm:min-w-full md:min-w-[700px] space-y-5">
32                <SheetHeader>
33                    <SheetTitle>{t("settings")}</SheetTitle>
34                </SheetHeader>
35                <ScrollArea className="flex flex-col gap-4 h-[calc(100vh-100px)] max-h-full">
36                    {children}
37                </ScrollArea>
38            </SheetContent>
39        </Sheet>
40    );
41};