// src/app/layout.tsx
import { Metadata } from 'next'

export const metadata: Metadata = {
  metadataBase: new URL('https://shipkit.io'),
  title: {
    default: 'ShipKit - Modern Full-Stack Development Kit',
    template: '%s | ShipKit'
  },
  description: 'Production-ready full-stack development kit built with Next.js, TypeScript, and modern web technologies.',
  keywords: ['Next.js', 'React', 'TypeScript', 'Full-Stack', 'Development Kit'],
  authors: [{ name: 'ShipKit Team' }],
  creator: 'ShipKit',
  publisher: 'ShipKit',
  robots: {
    index: true,
    follow: true,
  },
  openGraph: {
    type: 'website',
    locale: 'en_US',
    url: 'https://shipkit.io',
    siteName: 'ShipKit',
    title: 'ShipKit - Modern Full-Stack Development Kit',
    description: 'Production-ready full-stack development kit built with Next.js, TypeScript, and modern web technologies.',
    images: [
      {
        url: 'https://shipkit.io/og-image.jpg',
        width: 1200,
        height: 630,
        alt: 'ShipKit - Modern Full-Stack Development Kit'
      }
    ]
  },
  twitter: {
    card: 'summary_large_image',
    site: '@shipkitdev',
    creator: '@shipkitdev',
    title: 'ShipKit - Modern Full-Stack Development Kit',
    description: 'Production-ready full-stack development kit built with Next.js, TypeScript, and modern web technologies.',
    images: ['https://shipkit.io/twitter-image.jpg']
  }
}

// Example for documentation pages
// src/app/(docs)/[...slug]/page.tsx
import { Metadata } from 'next'
import { getDocBySlug } from '@/lib/docs'

interface PageProps {
  params: {
    slug: string[]
  }
}

export async function generateMetadata({ params }: PageProps): Promise<Metadata> {
  const doc = await getDocBySlug(params.slug.join('/'))

  if (!doc) {
    return {}
  }

  const ogImage = \`https://shipkit.io/api/og?title=\${encodeURIComponent(doc.title)}\`

  return {
    title: doc.title,
    description: doc.description,
    openGraph: {
      title: doc.title,
      description: doc.description,
      images: [
        {
          url: ogImage,
          width: 1200,
          height: 630,
          alt: doc.title
        }
      ]
    },
    twitter: {
      card: 'summary_large_image',
      title: doc.title,
      description: doc.description,
      images: [ogImage]
    }
  }
}

// src/components/structured-data.tsx
import { Article, WithContext } from 'schema-dts'

interface StructuredDataProps {
  title: string
  description: string
  datePublished: string
  dateModified: string
  author: string
  image: string
}

export function ArticleStructuredData({
  title,
  description,
  datePublished,
  dateModified,
  author,
  image
}: StructuredDataProps) {
  const structuredData: WithContext<Article> = {
    '@context': 'https://schema.org',
    '@type': 'TechArticle',
    headline: title,
    description: description,
    image: image,
    datePublished,
    dateModified,
    author: {
      '@type': 'Organization',
      name: author
    },
    publisher: {
      '@type': 'Organization',
      name: 'ShipKit',
      logo: {
        '@type': 'ImageObject',
        url: 'https://shipkit.io/logo.png'
      }
    }
  }

  return (
    <script
      type="application/ld+json"
      dangerouslySetInnerHTML={{ __html: JSON.stringify(structuredData) }}
    />
  )
}

// src/app/api/og/route.tsx
import { ImageResponse } from 'next/og'

export async function GET(request: Request) {
  const { searchParams } = new URL(request.url)
  const title = searchParams.get('title')

  return new ImageResponse(
    (
      <div
        style={{
          height: '100%',
          width: '100%',
          display: 'flex',
          flexDirection: 'column',
          alignItems: 'center',
          justifyContent: 'center',
          backgroundColor: '#fff',
          padding: '40px',
        }}
      >
        <img
          src="https://shipkit.io/logo.png"
          alt="ShipKit Logo"
          width="120"
          height="120"
        />
        <h1
          style={{
            fontSize: '60px',
            fontWeight: 'bold',
            textAlign: 'center',
            marginTop: '20px',
          }}
        >
          {title}
        </h1>
      </div>
    ),
    {
      width: 1200,
      height: 630,
    }
  )
}

// src/app/sitemap.ts
import { MetadataRoute } from 'next'
import { getAllDocs } from '@/lib/docs'

export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
  const docs = await getAllDocs()
  const baseUrl = 'https://shipkit.io'

  const docsUrls = docs.map((doc) => ({
    url: \`\${baseUrl}/\${doc.slug}\`,
    lastModified: doc.lastModified,
    changeFrequency: 'weekly' as const,
    priority: 0.8
  }))

  return [
    {
      url: baseUrl,
      lastModified: new Date(),
      changeFrequency: 'daily',
      priority: 1
    },
    ...docsUrls
  ]
}

// src/app/robots.ts
import { MetadataRoute } from 'next'

export default function robots(): MetadataRoute.Robots {
  return {
    rules: {
      userAgent: '*',
      allow: '/',
      disallow: ['/api/', '/admin/']
    },
    sitemap: 'https://shipkit.io/sitemap.xml'
  }
}