// * Packages
import { ReactNode } from "react";
// * Components shadcn
import {
    Card,
    CardContent,
    CardDescription,
    CardHeader,
    CardTitle,
} from "@/components/ui/card";
// * Other
import { cn } from "@/lib/utils";

export default function FieldsetWrapper({
    title,
    icon,
    description,
    className,
    inline,
    children,
}: {
    title: string;
    icon: ReactNode;
    description: string;
    className?: string;
    inline?: boolean;
    children: ReactNode;
}) {
    return (
        <Card
            className={cn("mb-4", {
                "w-full sm:w-1/2 grid grid-cols-1 lg:grid-cols-2 items-center":
                    inline,
            })}
        >
            <CardHeader>
                <CardTitle className="flex flex-row w-full items-start">
                    {icon && icon}
                    {title}
                </CardTitle>
                <CardDescription>{description}</CardDescription>
            </CardHeader>
            <CardContent
                className={cn(
                    inline
                        ? "flex justify-start lg:justify-end items-center lg:pt-5"
                        : "grid grid-cols-1",
                    className,
                )}
            >
                {children}
            </CardContent>
        </Card>
    );
}