import React from 'react'
function Separator() {
return (
)
}
function Crumb({ href, children, current = false }) {
const base = 'text-xs leading-none truncate max-w-[180px] sm:max-w-[260px]'
if (current) {
return (
{children}
)
}
return (
{children}
)
}
export default function ArtworkBreadcrumbs({ artwork }) {
if (!artwork) return null
// Use the first category for the content-type + category crumbs
const firstCategory = artwork.categories?.[0] ?? null
const contentTypeSlug = firstCategory?.content_type_slug || null
const contentTypeName = contentTypeSlug
? contentTypeSlug.charAt(0).toUpperCase() + contentTypeSlug.slice(1)
: null
const categorySlug = firstCategory?.slug || null
const categoryName = firstCategory?.name || null
const categoryUrl = contentTypeSlug && categorySlug
? `/${contentTypeSlug}/${categorySlug}`
: null
return (
)
}