interface BreadcrumbsProps {
    breadcrumbPath?: string[];
}

export default function Breadcrumbs({ breadcrumbPath = ['Home'] }: BreadcrumbsProps) {
    return(
        <div className="w-full z-10 relative md:sticky md:top-0">
            <div className="breadcrumbs text-sm bg-base-200 pb-6 md:shadow-md">
                <ul className="pl-4 pt-4">
                    {breadcrumbPath.map((item, index) => (
                        <li key={index}>
                            {index < breadcrumbPath.length - 1 ? (
                                <a>{item}</a>
                            ) : (
                                item
                            )}
                        </li>
                    ))}
                </ul>
            </div>
        </div>
    )
}