Marc Mintel
103d71851c
Some checks failed
🧪 CI (QA) / 🧪 Quality Assurance (push) Failing after 1m3s
- Restructure to pnpm monorepo (site moved to apps/web) - Integrate @mintel/tsconfig, @mintel/eslint-config, @mintel/husky-config - Implement Docker service architecture (Varnish, Directus, Gatekeeper) - Setup environment-aware Gitea Actions deployment
90 lines
2.1 KiB
TypeScript
90 lines
2.1 KiB
TypeScript
import { ImageResponse } from 'next/og';
|
|
import { blogPosts } from '../../../../src/data/blogPosts';
|
|
|
|
export const runtime = 'edge';
|
|
|
|
export async function GET(
|
|
request: Request,
|
|
{ params }: { params: Promise<{ slug?: string[] }> }
|
|
) {
|
|
const { slug: slugArray } = await params;
|
|
const slug = slugArray?.[0] || 'home';
|
|
|
|
let title: string;
|
|
let description: string;
|
|
|
|
if (slug === 'home') {
|
|
title = 'Marc Mintel';
|
|
description = 'Technical problem solver\'s blog - practical insights and learning notes';
|
|
} else {
|
|
const post = blogPosts.find(p => p.slug === slug);
|
|
title = post?.title || 'Marc Mintel';
|
|
description = (post?.description || 'Technical problem solver\'s blog - practical insights and learning notes').slice(0, 100);
|
|
}
|
|
|
|
return new ImageResponse(
|
|
(
|
|
<div
|
|
style={{
|
|
height: '100%',
|
|
width: '100%',
|
|
display: 'flex',
|
|
flexDirection: 'column',
|
|
alignItems: 'flex-start',
|
|
justifyContent: 'center',
|
|
backgroundColor: '#fff',
|
|
padding: '60px',
|
|
}}
|
|
>
|
|
<div
|
|
style={{
|
|
position: 'absolute',
|
|
top: '60px',
|
|
right: '60px',
|
|
width: '120px',
|
|
height: '4px',
|
|
backgroundColor: '#3b82f6',
|
|
borderRadius: '2px',
|
|
}}
|
|
/>
|
|
<div
|
|
style={{
|
|
fontSize: '48px',
|
|
fontWeight: 700,
|
|
color: '#1e293b',
|
|
marginBottom: '20px',
|
|
fontFamily: 'sans-serif',
|
|
}}
|
|
>
|
|
{title}
|
|
</div>
|
|
<div
|
|
style={{
|
|
fontSize: '24px',
|
|
fontWeight: 400,
|
|
color: '#64748b',
|
|
marginBottom: 'auto',
|
|
fontFamily: 'sans-serif',
|
|
}}
|
|
>
|
|
{description}
|
|
</div>
|
|
<div
|
|
style={{
|
|
fontSize: '18px',
|
|
fontWeight: 500,
|
|
color: '#94a3b8',
|
|
fontFamily: 'sans-serif',
|
|
}}
|
|
>
|
|
mintel.me
|
|
</div>
|
|
</div>
|
|
),
|
|
{
|
|
width: 1200,
|
|
height: 630,
|
|
}
|
|
);
|
|
}
|