import BlogMeta from 'components/BlogMeta'
import * as demo from 'lib/demo.data'
import { urlForImage } from 'lib/sanity.image'
import { Gallery, Settings } from 'lib/sanity.queries'

export interface GalleryPageHeadProps {
  settings: Settings
  post: Gallery
}

export default function GalleryPageHead({
  settings,
  post,
}: GalleryPageHeadProps) {
  const title = settings.title ?? demo.title
  return (
    <>
      <title>{post.title ? `${post.title} | ${title}` : title}</title>
      <BlogMeta />
      {post.coverImage?.asset?._ref && (
        <meta
          property="og:image"
          content={urlForImage(post.coverImage)
            .width(1200)
            .height(627)
            .fit('crop')
            .url()}
        />
      )}
    </>
  )
}
