mirror of
https://github.com/supabase/supabase.git
synced 2026-10-10 03:45:06 +03:00
Danny White
ba107edbda
## What kind of change does this PR introduce? Frontmatter name change. ## What is the current behavior? We repeatedly mistake `thumb` for `image` and visa versa, meaning the wrong images are used for Open Graph and in-site thumbnails on blog posts. Events and case studies use the same naming convention too. ## What is the new behavior? These two bits of frontmatter are renamed for clarity: - Blog posts: `imgThumb` + `imgSocial` That mapping for blog posts: - `thumb` is now `imgThumb` - `image` is now `imgSocial` These related bits remain as-is: - Events - Case studies The [www/README.md](https://github.com/supabase/supabase/blob/dnywh/chore/blog-image-frontmatter/apps/www/README.md#best-practices) file has been expanded to clarify all of the above. It now also provides instructions on image optimisation. ## To test A lot of files were touched here. Please help make sure: - [ ] The CMS works as intended. This is the **biggest unknown**. - [x] All blog posts render the correct image as their on-site thumbnail and Open Graph image. You can test the latter by firing up a draft iMessage. Online Open Graph services like Facebook cache images, so aren’t reliable. - [x] All events render their correct images - [x] All case studies render their correct images - [x] All customer stories render their correct images ([known issue](https://supabase.slack.com/archives/C072FL5KKKP/p1768888063209359?thread_ts=1768885681.502169&cid=C072FL5KKKP), predates this work)
45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
import SectionHeader from 'components/UI/SectionHeader'
|
|
import CaseStudiesData from 'data/CaseStudies.json'
|
|
import { useRouter } from 'next/router'
|
|
import BlogGridItem from '../Blog/BlogGridItem'
|
|
import SectionContainer from '../Layouts/SectionContainer'
|
|
|
|
const CaseStudies = () => {
|
|
const { basePath } = useRouter()
|
|
|
|
return (
|
|
<SectionContainer>
|
|
<div>
|
|
<SectionHeader
|
|
className="mb-12"
|
|
title={'Scale up'}
|
|
title_alt={' with no extra effort'}
|
|
subtitle={'Enterprise Solutions'}
|
|
paragraph={
|
|
"Supabase is built with proven, enterprise-ready tools.\n We're supporting everything from fintech providers to social networks. "
|
|
}
|
|
/>
|
|
</div>
|
|
<div className="mx-auto mt-5 grid max-w-lg gap-8 lg:max-w-none lg:grid-cols-3 lg:gap-12">
|
|
{CaseStudiesData.map((caseStudy, idx: number) => (
|
|
<BlogGridItem
|
|
key={idx}
|
|
post={{
|
|
type: 'casestudy',
|
|
title: caseStudy.title,
|
|
description: caseStudy.description,
|
|
imgThumb: `${basePath}/${caseStudy.imgUrl}`,
|
|
hideAuthor: true,
|
|
url: caseStudy.url.replace('/blog/', ''),
|
|
path: caseStudy.path,
|
|
date: '',
|
|
}}
|
|
/>
|
|
))}
|
|
</div>
|
|
</SectionContainer>
|
|
)
|
|
}
|
|
|
|
export default CaseStudies
|