diff --git a/app/[locale]/products/[...slug]/opengraph-image.tsx b/app/[locale]/products/[...slug]/opengraph-image.tsx deleted file mode 100644 index 54812d1a..00000000 --- a/app/[locale]/products/[...slug]/opengraph-image.tsx +++ /dev/null @@ -1,62 +0,0 @@ -import { ImageResponse } from 'next/og'; -import { getProductBySlug } from '@/lib/mdx'; -import { getTranslations } from 'next-intl/server'; -import { OGImageTemplate } from '@/components/OGImageTemplate'; - -export const runtime = 'nodejs'; - -export default async function Image({ params: { locale, slug } }: { params: { locale: string, slug: string[] } }) { - const productSlug = slug[slug.length - 1]; - const t = await getTranslations('Products'); - - // Check if it's a category page - const categories = ['low-voltage-cables', 'medium-voltage-cables', 'high-voltage-cables', 'solar-cables']; - if (categories.includes(productSlug)) { - const categoryKey = productSlug.replace(/-cables$/, '').replace(/-([a-z])/g, (g) => g[1].toUpperCase()); - const categoryTitle = t.has(`categories.${categoryKey}.title`) ? t(`categories.${categoryKey}.title`) : productSlug; - const categoryDesc = t.has(`categories.${categoryKey}.description`) ? t(`categories.${categoryKey}.description`) : ''; - - return new ImageResponse( - ( - - ), - { - width: 1200, - height: 630, - } - ); - } - - const product = await getProductBySlug(productSlug, locale); - - if (!product) { - return new ImageResponse( -
- ); - } - - const featuredImage = product.frontmatter.images?.[0] - ? (product.frontmatter.images[0].startsWith('http') - ? product.frontmatter.images[0] - : `https://klz-cables.com${product.frontmatter.images[0]}`) - : undefined; - - return new ImageResponse( - ( - - ), - { - width: 1200, - height: 630, - } - ); -} diff --git a/app/[locale]/products/opengraph-image.tsx b/app/[locale]/products/opengraph-image.tsx index 1db211fc..54812d1a 100644 --- a/app/[locale]/products/opengraph-image.tsx +++ b/app/[locale]/products/opengraph-image.tsx @@ -1,20 +1,57 @@ import { ImageResponse } from 'next/og'; +import { getProductBySlug } from '@/lib/mdx'; import { getTranslations } from 'next-intl/server'; import { OGImageTemplate } from '@/components/OGImageTemplate'; export const runtime = 'nodejs'; -export default async function Image({ params: { locale } }: { params: { locale: string } }) { - const t = await getTranslations({ locale, namespace: 'Products' }); - const title = t('meta.title') || t('title'); - const description = t('meta.description') || t('subtitle'); +export default async function Image({ params: { locale, slug } }: { params: { locale: string, slug: string[] } }) { + const productSlug = slug[slug.length - 1]; + const t = await getTranslations('Products'); + + // Check if it's a category page + const categories = ['low-voltage-cables', 'medium-voltage-cables', 'high-voltage-cables', 'solar-cables']; + if (categories.includes(productSlug)) { + const categoryKey = productSlug.replace(/-cables$/, '').replace(/-([a-z])/g, (g) => g[1].toUpperCase()); + const categoryTitle = t.has(`categories.${categoryKey}.title`) ? t(`categories.${categoryKey}.title`) : productSlug; + const categoryDesc = t.has(`categories.${categoryKey}.description`) ? t(`categories.${categoryKey}.description`) : ''; + + return new ImageResponse( + ( + + ), + { + width: 1200, + height: 630, + } + ); + } + + const product = await getProductBySlug(productSlug, locale); + + if (!product) { + return new ImageResponse( +
+ ); + } + + const featuredImage = product.frontmatter.images?.[0] + ? (product.frontmatter.images[0].startsWith('http') + ? product.frontmatter.images[0] + : `https://klz-cables.com${product.frontmatter.images[0]}`) + : undefined; return new ImageResponse( ( ), {