"use client";

const PageHeader = ({ title, description, children, action, className = "" }) => {
	return (
		<div className={`flex justify-between items-start mb-8 ${className}`}>
			<div className="flex-1">
				<h1 className="text-3xl font-bold text-gray-900">{title}</h1>
				{description && <p className="text-gray-600 mt-1">{description}</p>}
			</div>
			{(children || action) && (
				<div className="ml-6 flex-shrink-0">{action || children}</div>
			)}
		</div>
	);
};

export default PageHeader;