// 1. Create public/sitemap.xml
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://doc.raiontech.io/</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>1.0</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/raion-hub</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>1.0</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/crm/field-creation</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.9</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/crm/layout-design</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.9</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/crm/invite-members</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.8</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/whatsapp-automations/whatsapp-account-setup</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.9</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/whatsapp-automations/whatsapp-lead-capture</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.9</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/whatsapp-automations/whatsapp-auto-reply</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.8</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/whatsapp-automations/whatsapp-bulk-messaging</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.8</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/whatsapp-automations/whatsapp-message-template</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/whatsapp-automations/whatsapp-message-settings</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/whatsapp-automations/whatsapp-link-generator</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/leads/import-add</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.8</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/leads/assignment-reassignment</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.8</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/leads/export</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/ai-chatbot</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.8</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/roles-permissions</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/social-integration/meta-integration</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/social-integration/google-integration</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/app-installation</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>monthly</changefreq>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/faq</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.9</priority>
  </url>
  <url>
    <loc>https://doc.raiontech.io/contact</loc>
    <lastmod>2024-12-07</lastmod>
    <changefreq>monthly</changefreq>
    <priority>0.8</priority>
  </url>
</urlset>

// 2. Create public/robots.txt
User-agent: *
Allow: /

# Sitemaps
Sitemap: https://doc.raiontech.io/sitemap.xml

# Crawl-delay for respectful crawling
Crawl-delay: 1

# Allow all major search engines
User-agent: Googlebot
Allow: /

User-agent: Bingbot
Allow: /

User-agent: DuckDuckBot
Allow: /

# Performance assets
User-agent: *
Allow: /_next/static/
Allow: /images/
Allow: /favicon.ico

// 3. Update your app/layout.jsx metadata (add to existing metadata object)
export const metadata = {
  // ... your existing metadata
  
  // Add these for better SEO
  metadataBase: new URL('https://doc.raiontech.io'),
  keywords: [
    'Raion Hub documentation',
    'WhatsApp automation Malaysia', 
    'CRM setup guide',
    'lead management system',
    'AI chatbot tutorial',
    'sales automation Malaysia',
    'business process automation',
    'WhatsApp Business integration',
    'lead capture automation',
    'team collaboration CRM',
    'Malaysia CRM solution',
    'small business automation'
  ],
  authors: [{ name: 'Raion Tech', url: 'https://raiontech.io' }],
  creator: 'Raion Tech',
  publisher: 'Raion Tech',
  robots: {
    index: true,
    follow: true,
    googleBot: {
      index: true,
      follow: true,
      'max-video-preview': -1,
      'max-image-preview': 'large',
      'max-snippet': -1,
    },
  },
  openGraph: {
    type: 'website',
    locale: 'en_MY',
    url: 'https://doc.raiontech.io',
    siteName: 'Raion Hub Documentation',
    images: [
      {
        url: '/logo-long-dark.png',
        width: 1200,
        height: 630,
        alt: 'Raion Hub Documentation',
        type: 'image/png',
      }
    ],
  },
  twitter: {
    card: 'summary_large_image',
    site: '@raiontech',
    creator: '@raiontech',
  },
  verification: {
    google: 'your-google-verification-code-here', // Add your Google verification code
  },
};

// 4. Optional: Create next.config.mjs enhancement (add to your existing config)
/** @type {import('next').NextConfig} */
const nextConfig = {
  output: "export",
  images: { unoptimized: true },
  
  // Add these for better SEO
  trailingSlash: false,
  async headers() {
    return [
      {
        source: '/(.*)',
        headers: [
          {
            key: 'X-Content-Type-Options',
            value: 'nosniff',
          },
          {
            key: 'X-Frame-Options',
            value: 'DENY',
          },
          {
            key: 'X-XSS-Protection',
            value: '1; mode=block',
          },
        ],
      },
      {
        source: '/sitemap.xml',
        headers: [
          {
            key: 'Cache-Control',
            value: 'public, max-age=86400, s-maxage=86400',
          },
        ],
      },
      {
        source: '/robots.txt',
        headers: [
          {
            key: 'Cache-Control',
            value: 'public, max-age=86400, s-maxage=86400',
          },
        ],
      },
    ];
  },
};

export default withNextra(nextConfig);

// 5. Enhanced mdx-components.js for better SEO structure
import { useMDXComponents as getThemeComponents } from "nextra-theme-docs";
import { Callout, Cards, Steps, Tabs } from "nextra/components";
import NextSteps from "./components/NextSteps";
import { Label, Badge } from "./components/Badge";

const themeComponents = getThemeComponents();

// Enhanced heading components with proper anchor links
const createHeading = (level) => {
  const Component = ({ children, id, ...props }) => {
    const Tag = `h${level}`;
    const headingId = id || children?.toString().toLowerCase().replace(/\s+/g, '-').replace(/[^\w-]/g, '');
    
    return (
      <Tag 
        id={headingId}
        className={`group relative ${level === 1 ? 'scroll-mt-20' : 'scroll-mt-16'}`}
        {...props}
      >
        {children}
        {level > 1 && (
          <a
            href={`#${headingId}`}
            className="absolute -left-6 top-0 opacity-0 group-hover:opacity-100 transition-opacity text-gray-400 hover:text-gray-600"
            aria-label="Link to this section"
          >
            #
          </a>
        )}
      </Tag>
    );
  };
  Component.displayName = `Heading${level}`;
  return Component;
};

// Enhanced image component with SEO attributes
const Image = ({ src, alt, title, width, height, ...props }) => {
  return (
    <img
      src={src}
      alt={alt}
      title={title}
      width={width}
      height={height}
      loading="lazy"
      decoding="async"
      className="rounded-lg shadow-sm"
      {...props}
    />
  );
};

// Enhanced link component
const Link = ({ href, children, ...props }) => {
  const isExternal = href?.startsWith('http');
  
  return (
    <a
      href={href}
      target={isExternal ? '_blank' : undefined}
      rel={isExternal ? 'noopener noreferrer' : undefined}
      className="text-blue-600 hover:text-blue-800 underline decoration-1 underline-offset-2"
      {...props}
    >
      {children}
      {isExternal && (
        <span className="ml-1 text-xs">↗</span>
      )}
    </a>
  );
};

export function useMDXComponents(components) {
  return {
    ...themeComponents,
    ...components,
    
    // Nextra components
    Callout,
    Label,
    Badge,
    Cards,
    Steps,
    Tabs,
    NextSteps,
    
    // Enhanced HTML elements for SEO
    h1: createHeading(1),
    h2: createHeading(2), 
    h3: createHeading(3),
    h4: createHeading(4),
    h5: createHeading(5),
    h6: createHeading(6),
    img: Image,
    a: Link,
  };
}

// 6. Standard MDX page template for consistent SEO structure
/*
Create this template for all your MDX pages:

---
title: "Your Page Title"
description: "SEO-friendly description of the page content"
---

# Main Page Title

Brief overview paragraph that naturally includes relevant keywords and explains what users will learn.

---

## Overview

Clear explanation of what this page covers and why it's important for users.

<Callout type="info">
**Quick Summary:** Key benefits or important information that users should know upfront.
</Callout>

---

## Main Content Sections

### Step-by-Step Instructions

<Steps>

### Step 1: First Action
Clear, actionable instruction with specific details.

### Step 2: Second Action  
Continue with logical progression.

### Step 3: Verification
How to confirm the step worked correctly.

</Steps>

### Configuration Options

<Tabs items={['Basic Setup', 'Advanced Options', 'Troubleshooting']}>
  <Tabs.Tab>
    **Basic configuration:**
    
    - Simple setup instructions
    - Essential settings only
    - Quick start approach
  </Tabs.Tab>
  
  <Tabs.Tab>
    **Advanced features:**
    
    | Setting | Purpose | Example |
    |---------|---------|---------|
    | Option 1 | Description | Value |
    | Option 2 | Description | Value |
  </Tabs.Tab>
  
  <Tabs.Tab>
    **Common issues:**
    
    | Problem | Solution |
    |---------|----------|
    | Issue 1 | How to fix |
    | Issue 2 | Alternative approach |
  </Tabs.Tab>
</Tabs>

## Best Practices

<Callout type="warning">
**Important Considerations:**
- Key warnings or limitations
- Security considerations
- Performance implications
</Callout>

### Recommended Approach

✅ **Do:**
- Specific recommendations
- Best practice guidelines
- Security considerations

❌ **Don't:**
- Common mistakes to avoid
- Performance issues
- Security risks

## Next Steps

<NextSteps groups={['relatedFeatures']} />

*/

// 7. Component for FAQ pages with structured data
// Create components/FAQStructuredData.jsx
export function FAQStructuredData({ faqs }) {
  const structuredData = {
    "@context": "https://schema.org",
    "@type": "FAQPage",
    "mainEntity": faqs.map(faq => ({
      "@type": "Question",
      "name": faq.question,
      "acceptedAnswer": {
        "@type": "Answer",
        "text": faq.answer
      }
    }))
  };

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

// Usage in FAQ page:
// <Head>
//   <FAQStructuredData faqs={[
//     { question: "How do I setup WhatsApp?", answer: "Follow these steps..." },
//     { question: "What is lead capture?", answer: "Lead capture is..." }
//   ]} />
// </Head>

// 8. Google Analytics setup (optional)
// Create components/Analytics.jsx
export function Analytics() {
  return (
    <>
      {/* Google Analytics */}
      <script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
      <script
        dangerouslySetInnerHTML={{
          __html: `
            window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('js', new Date());
            gtag('config', 'GA_MEASUREMENT_ID');
          `,
        }}
      />
    </>
  );
}

// Add to your theme.config.mjs head function:
// import { Analytics } from './components/Analytics'
// Then add <Analytics /> in the head function

// 9. Performance optimization tips
/*
SEO Performance Checklist:

✅ Images:
- Add alt text to all images
- Use appropriate file sizes (compress images)
- Include width/height attributes
- Use descriptive filenames

✅ Content Structure:
- Use proper heading hierarchy (h1 → h2 → h3)
- Include table of contents for long pages
- Add internal links between related pages
- Use descriptive link text

✅ Meta Information:
- Unique title for each page
- Descriptive meta descriptions
- Relevant keywords (but don't overuse)
- Canonical URLs

✅ Technical SEO:
- Fast loading times
- Mobile responsive design
- Clean URL structure
- XML sitemap
- Robots.txt file

✅ User Experience:
- Clear navigation
- Readable content structure
- Search functionality
- Breadcrumb navigation
*/