import type { Metadata } from 'next';
import { Suspense } from 'react';
import '@/styles/globals.css';
import { Providers } from '@/components/Providers';
import MarketingDeLayout from './MarketingDeLayout';
import { organizationSchema, websiteSchema } from '@/lib/schema';
import FacebookPixel from '@/components/analytics/FacebookPixel';

export const metadata: Metadata = {
    title: {
        default: 'QR Master – QR Code Generator & Analytics',
        template: '%s | QR Master',
    },
    description: 'Erstellen Sie dynamische QR Codes für Feedback, PDF, Coupons und App Stores. Verfolgen Sie Scans und skalieren Sie Kampagnen mit sicheren Analysen.',
    metadataBase: new URL('https://www.qrmaster.net'),
    icons: {
        icon: [
            { url: '/favicon1.png', sizes: '2048x2048', type: 'image/png' },
        ],
        shortcut: '/favicon1.png',
        apple: '/favicon1.png',
    },
    openGraph: {
        type: 'website',
        siteName: 'QR Master',
        title: 'QR Master – QR Code Generator & Analytics',
        description: 'Erstellen Sie dynamische QR Codes für Feedback, PDF, Coupons und App Stores. Verfolgen Sie Scans und skalieren Sie Kampagnen mit sicheren Analysen.',
        url: 'https://www.qrmaster.net/qr-code-erstellen',
        locale: 'de_DE',
        images: [
            {
                url: 'https://www.qrmaster.net/og-image.png',
                width: 1200,
                height: 630,
                alt: 'QR Master - Dynamischer QR Code Generator',
            },
        ],
    },
    twitter: {
        card: 'summary_large_image',
        site: '@qrmaster',
        images: ['https://www.qrmaster.net/og-image.png'],
    },
    robots: { index: true, follow: true },
    alternates: {
        canonical: 'https://www.qrmaster.net/qr-code-erstellen',
        languages: {
            'en': 'https://www.qrmaster.net/',
            'de': 'https://www.qrmaster.net/qr-code-erstellen',
        },
    },
    verification: {
        other: {
            'facebook-domain-verification': process.env.NEXT_PUBLIC_FACEBOOK_DOMAIN_VERIFICATION || '',
        },
    },
};

export default function MarketingDeGroupLayout({
    children,
}: {
    children: React.ReactNode;
}) {
    return (
        <html lang="de">
            <body className="font-sans">
                <Suspense fallback={null}>
                    <Providers>
                        <FacebookPixel />
                        <script
                            type="application/ld+json"
                            dangerouslySetInnerHTML={{ __html: JSON.stringify(organizationSchema()) }}
                        />
                        <script
                            type="application/ld+json"
                            dangerouslySetInnerHTML={{ __html: JSON.stringify(websiteSchema()) }}
                        />
                        <MarketingDeLayout>
                            {children}
                        </MarketingDeLayout>
                    </Providers>
                </Suspense>
            </body>
        </html>
    );
}
