rsnext/examples/cms-sanity/components/cover-image.js
Luis Alvarez D 731cfa46f9
[cms-sanity] Expose the project id to the browser (#14941)
Fixes #14792
Closes #14814

The project id is currently used by Sanity's image builder, which is used in a React component.

@maybac It was faster for me to create a new PR but the credit goes to you, thank you!.
2020-07-08 15:01:20 +00:00

29 lines
695 B
JavaScript

import cn from 'classnames'
import Link from 'next/link'
import { imageBuilder } from '../lib/sanity'
export default function CoverImage({ title, url, slug }) {
const image = (
<img
width={2000}
height={1000}
alt={`Cover Image for ${title}`}
className={cn('shadow-small', {
'hover:shadow-medium transition-shadow duration-200': slug,
})}
src={imageBuilder.image(url).height(1000).width(2000).url()}
/>
)
return (
<div className="-mx-5 sm:mx-0">
{slug ? (
<Link as={`/posts/${slug}`} href="/posts/[slug]">
<a aria-label={title}>{image}</a>
</Link>
) : (
image
)}
</div>
)
}