import React from 'react';
import { Helmet } from 'react-helmet';

const SEO = ({ 
  title, 
  description, 
  keywords, 
  image,
  ogImage,
  url,
  type = 'website'
}) => {
  const siteTitle = 'Infinitus Texas';
  const defaultOgTitle = 'Infinitus Texas - Expert Test Prep & Academic Tutoring';
  const fullTitle = title ? `${title} | ${siteTitle}` : defaultOgTitle;
  const defaultDescription = 'Master EOC, TSIA2, and ACT/SAT with Infinitus Texas. Expert tutoring and test preparation for academic success.';
  const metaDescription = description || defaultDescription;
  const siteUrl = url || 'https://infinitustexas.com';
  
  // Use provided ogImage, fallback to image, or use default US Education stock image
  const defaultImage = 'https://horizons-cdn.hostinger.com/65092222-b2d0-4ab6-9cc2-75725fc08b4f/fab90908d9731deb9904657366caf7ae.png';
  let baseImage = ogImage || image || defaultImage;

  // Ensure absolute URL for the image
  if (baseImage.startsWith('/')) {
    baseImage = `https://infinitustexas.com${baseImage}`;
  }

  // Add cache-busting query parameter to force fresh previews
  const cacheBuster = 'v=20260224';
  const metaImage = baseImage.includes('?') 
    ? `${baseImage}&${cacheBuster}` 
    : `${baseImage}?${cacheBuster}`;

  return (
    <Helmet>
      <title>{fullTitle}</title>
      <meta name="description" content={metaDescription} />
      {keywords && <meta name="keywords" content={keywords} />}
      
      {/* Open Graph / Facebook */}
      <meta property="og:type" content={type} />
      <meta property="og:url" content={siteUrl} />
      <meta property="og:title" content={title || defaultOgTitle} />
      <meta property="og:description" content={metaDescription} />
      <meta property="og:image" content={metaImage} />
      <meta property="og:image:width" content="1200" />
      <meta property="og:image:height" content="630" />
      <meta property="og:site_name" content={siteTitle} />
      
      {/* Twitter */}
      <meta property="twitter:card" content="summary_large_image" />
      <meta property="twitter:url" content={siteUrl} />
      <meta property="twitter:title" content={title || defaultOgTitle} />
      <meta property="twitter:description" content={metaDescription} />
      <meta property="twitter:image" content={metaImage} />
      
      {/* Additional SEO */}
      <meta name="robots" content="index, follow" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <meta httpEquiv="Content-Type" content="text/html; charset=utf-8" />
      <link rel="canonical" href={siteUrl} />
    </Helmet>
  );
};

export default SEO;