import type { Metadata } from 'next';
import { Inter } from 'next/font/google';
import './globals.css';
import { ThemeProvider } from '../features/theme';
import { QueryProvider } from '../providers/query-provider';
import { I18nProvider } from '../features/theme/i18n-provider';

// EN: Configure Inter font with subsets and variable name
// VI: Cấu hình font Inter với các subsets và tên biến CSS
const inter = Inter({
  subsets: ['latin', 'vietnamese'],
  display: 'swap',
  variable: '--font-inter',
  weight: ['100', '200', '300', '400', '500', '600', '700', '800', '900'],
});
import { SkipToContent } from '../features/shared/components/accessibility/skip-to-content';

/**
 * EN: Metadata for the application
 * VI: Metadata cho ứng dụng
 */
export const metadata: Metadata = {
  title: {
    default: 'GoodGo Platform - Enterprise Microservices',
    template: '%s | GoodGo Platform',
  },
  description: 'Build, deploy, and scale microservices with confidence. Enterprise-grade microservices platform for modern development teams.',
  keywords: ['microservices', 'enterprise', 'platform', 'cloud', 'kubernetes', 'devops'],

  // EN: Brand icons for all platforms / VI: Brand icons cho tất cả platforms
  icons: {
    icon: '/brand-assets/icons/favicon.svg',
    apple: '/brand-assets/icons/favicon.svg',
  },

  // EN: Open Graph for social media sharing / VI: Open Graph cho chia sẻ mạng xã hội
  openGraph: {
    type: 'website',
    locale: 'en_US',
    url: 'https://goodgo.com',
    siteName: 'GoodGo Platform',
    title: 'GoodGo Platform - Enterprise Microservices',
    description: 'Build, deploy, and scale microservices with confidence',
  },

  // EN: Twitter Card metadata / VI: Twitter Card metadata
  twitter: {
    card: 'summary_large_image',
    title: 'GoodGo Platform',
    description: 'Enterprise Microservices Platform',
  },

  // EN: PWA manifest / VI: PWA manifest
  manifest: '/manifest.json',
};

/**
 * EN: Viewport configuration (Next.js 13+ requires separate export)
 * VI: Cấu hình viewport (Next.js 13+ yêu cầu export riêng)
 */
export const viewport = {
  width: 'device-width',
  initialScale: 1,
  maximumScale: 5,
};

/**
 * EN: Root layout component for the entire application
 * VI: Component layout gốc cho toàn bộ ứng dụng
 *
 * @param children - Child components to render / Components con để render
 */
export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    // EN: Root HTML structure with dynamic language (will be updated by I18nProvider)
    // VI: Cấu trúc HTML gốc với ngôn ngữ động (sẽ được cập nhật bởi I18nProvider)
    <html lang="en" className={inter.variable} suppressHydrationWarning>
      <body>
        <I18nProvider>
          <SkipToContent />
          <QueryProvider>
            <ThemeProvider>{children}</ThemeProvider>
          </QueryProvider>
        </I18nProvider>
      </body>
    </html>
  );
}
