diff --git a/app/[locale]/[slug]/opengraph-image.tsx b/app/[locale]/[slug]/opengraph-image.tsx index 9bacaef4..2fe4d8f9 100644 --- a/app/[locale]/[slug]/opengraph-image.tsx +++ b/app/[locale]/[slug]/opengraph-image.tsx @@ -3,6 +3,8 @@ import { getPageBySlug } from '@/lib/pages'; import { OGImageTemplate } from '@/components/OGImageTemplate'; import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper'; +export const size = OG_IMAGE_SIZE; +export const contentType = 'image/png'; export const runtime = 'nodejs'; export default async function Image({ diff --git a/app/[locale]/blog/[slug]/opengraph-image.tsx b/app/[locale]/blog/[slug]/opengraph-image.tsx index 21265c28..9b4a1e43 100644 --- a/app/[locale]/blog/[slug]/opengraph-image.tsx +++ b/app/[locale]/blog/[slug]/opengraph-image.tsx @@ -4,6 +4,8 @@ import { OGImageTemplate } from '@/components/OGImageTemplate'; import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper'; import { SITE_URL } from '@/lib/schema'; +export const size = OG_IMAGE_SIZE; +export const contentType = 'image/png'; export const runtime = 'nodejs'; export default async function Image({ diff --git a/app/[locale]/blog/opengraph-image.tsx b/app/[locale]/blog/opengraph-image.tsx index d697076b..3848a885 100644 --- a/app/[locale]/blog/opengraph-image.tsx +++ b/app/[locale]/blog/opengraph-image.tsx @@ -3,6 +3,8 @@ import { getTranslations } from 'next-intl/server'; import { OGImageTemplate } from '@/components/OGImageTemplate'; import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper'; +export const size = OG_IMAGE_SIZE; +export const contentType = 'image/png'; export const runtime = 'nodejs'; export default async function Image({ params }: { params: Promise<{ locale: string }> }) { diff --git a/app/[locale]/contact/opengraph-image.tsx b/app/[locale]/contact/opengraph-image.tsx index e770e6ba..bd909b59 100644 --- a/app/[locale]/contact/opengraph-image.tsx +++ b/app/[locale]/contact/opengraph-image.tsx @@ -3,6 +3,8 @@ import { getTranslations } from 'next-intl/server'; import { OGImageTemplate } from '@/components/OGImageTemplate'; import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper'; +export const size = OG_IMAGE_SIZE; +export const contentType = 'image/png'; export const runtime = 'nodejs'; export default async function Image({ params }: { params: Promise<{ locale: string }> }) { diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx index 0a5cf63c..2f253a5e 100644 --- a/app/[locale]/layout.tsx +++ b/app/[locale]/layout.tsx @@ -43,15 +43,13 @@ export const viewport: Viewport = { themeColor: '#001a4d', }; -export default async function LocaleLayout({ - children, - params, -}: { +export default async function Layout(props: { children: React.ReactNode; params: Promise<{ locale: string }>; }) { - const { locale } = await params; - + const params = await props.params; + const { locale } = params; + const { children } = props; const supportedLocales = ['en', 'de']; const localeStr = (typeof locale === 'string' ? locale : '').trim(); const safeLocale = supportedLocales.includes(localeStr) ? localeStr : 'en'; diff --git a/app/[locale]/opengraph-image.tsx b/app/[locale]/opengraph-image.tsx index 2d074099..0cce481a 100644 --- a/app/[locale]/opengraph-image.tsx +++ b/app/[locale]/opengraph-image.tsx @@ -3,9 +3,12 @@ import { getTranslations } from 'next-intl/server'; import { OGImageTemplate } from '@/components/OGImageTemplate'; import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper'; +export const size = OG_IMAGE_SIZE; +export const contentType = 'image/png'; export const runtime = 'nodejs'; export default async function Image({ params }: { params: Promise<{ locale: string }> }) { + console.log('🖼️ OG Image Handler Called'); const { locale } = await params; const t = await getTranslations({ locale, namespace: 'Index.meta' }); const fonts = await getOgFonts(); diff --git a/app/[locale]/products/opengraph-image.tsx b/app/[locale]/products/opengraph-image.tsx index f59a4513..f577ddf9 100644 --- a/app/[locale]/products/opengraph-image.tsx +++ b/app/[locale]/products/opengraph-image.tsx @@ -3,6 +3,8 @@ import { getTranslations } from 'next-intl/server'; import { OGImageTemplate } from '@/components/OGImageTemplate'; import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper'; +export const size = OG_IMAGE_SIZE; +export const contentType = 'image/png'; export const runtime = 'nodejs'; export default async function Image({ params }: { params: Promise<{ locale: string }> }) { diff --git a/app/[locale]/team/opengraph-image.tsx b/app/[locale]/team/opengraph-image.tsx index e5faef5f..a08a2388 100644 --- a/app/[locale]/team/opengraph-image.tsx +++ b/app/[locale]/team/opengraph-image.tsx @@ -3,6 +3,8 @@ import { getTranslations } from 'next-intl/server'; import { OGImageTemplate } from '@/components/OGImageTemplate'; import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper'; +export const size = OG_IMAGE_SIZE; +export const contentType = 'image/png'; export const runtime = 'nodejs'; export default async function Image({ params }: { params: Promise<{ locale: string }> }) { diff --git a/docker-compose.yml b/docker-compose.yml index 4911375c..82fea0b7 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -9,8 +9,10 @@ services: image: registry.infra.mintel.me/mintel/klz-cables.com:${IMAGE_TAG:-latest} restart: unless-stopped networks: - - default - - infra + default: + infra: + aliases: + - klz.localhost env_file: - ${ENV_FILE:-.env} labels: diff --git a/next-env.d.ts b/next-env.d.ts index 9edff1c7..c4b7818f 100644 --- a/next-env.d.ts +++ b/next-env.d.ts @@ -1,6 +1,6 @@ /// /// -import "./.next/types/routes.d.ts"; +import "./.next/dev/types/routes.d.ts"; // NOTE: This file should not be edited // see https://nextjs.org/docs/app/api-reference/config/typescript for more information. diff --git a/next.config.mjs b/next.config.mjs index 08a917ee..14234b95 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -1,10 +1,18 @@ -import createNextIntlPlugin from 'next-intl/plugin'; import withMintelConfig from '@mintel/next-config'; -const withNextIntl = createNextIntlPlugin(); +console.log('🚀 NEXT CONFIG LOADED FROM:', process.cwd()); /** @type {import('next').NextConfig} */ const nextConfig = { + onDemandEntries: { + // Make sure entries are not disposed too quickly + maxInactiveAge: 60 * 1000, + }, + logging: { + fetches: { + fullUrl: true, + }, + }, output: 'standalone', async redirects() { return [ @@ -342,6 +350,4 @@ const nextConfig = { }, }; -const nextIntlConfig = withNextIntl(nextConfig); - -export default withMintelConfig(nextIntlConfig); +export default withMintelConfig(nextConfig); diff --git a/middleware.ts b/proxy.ts similarity index 86% rename from middleware.ts rename to proxy.ts index d2074386..695ae3e4 100644 --- a/middleware.ts +++ b/proxy.ts @@ -42,11 +42,8 @@ export default function middleware(request: NextRequest) { // Prioritize x-forwarded-host (passed by Traefik) over the local Host header const hostHeader = headers.get('x-forwarded-host') || headers.get('host') || 'testing.klz-cables.com'; - hostHeader.split(':'); urlObj.protocol = proto; - // urlObj.hostname = publicHostname; // Don't rewrite hostname yet as it breaks internal fetches in dev - // urlObj.port = ''; // DON'T clear internal port (3000) anymore effectiveRequest = new NextRequest(urlObj, { headers: request.headers, @@ -55,7 +52,7 @@ export default function middleware(request: NextRequest) { }); console.log( - `🛡️ Middleware: Fixed internal URL leak: ${url} -> ${urlObj.toString()} | Proto: ${proto} | Host: ${hostHeader}`, + `🛡️ Proxy: Fixed internal URL leak: ${url} -> ${urlObj.toString()} | Proto: ${proto} | Host: ${hostHeader}`, ); } @@ -95,6 +92,5 @@ export default function middleware(request: NextRequest) { } export const config = { - // Match only internationalized pathnames - matcher: ['/((?!api|_next|_vercel|.*\\..*).*)', '/', '/(de|en)/:path*'], + matcher: ['/((?!api|_next/static|_next/image|favicon.ico).*)'], }; diff --git a/scripts/check-og-images.ts b/scripts/check-og-images.ts index c0632afd..f3110495 100644 --- a/scripts/check-og-images.ts +++ b/scripts/check-og-images.ts @@ -22,7 +22,7 @@ async function verifyImage(path: string): Promise { console.log(`Checking ${url}...`); - const body = await response.text(); + const body = await response.clone().text(); const contentType = response.headers.get('content-type'); if (response.status !== 200) {