AeThex-OS/temp-forge-extract/aethex-forge-main/client/components/SEO.tsx

import { useEffect } from "react";

export type SEOProps = {
  pageTitle: string;
  description?: string;
  image?: string | null;
  canonical?: string | null;
  noIndex?: boolean;
};

function upsertMeta(selector: string, attrs: Record<string, string>) {
  let el = document.querySelector(selector) as HTMLElement | null;
  if (!el) {
    const tag = selector.startsWith("meta[")
      ? "meta"
      : selector.startsWith("link[")
        ? "link"
        : "meta";
    el = document.createElement(tag);
    document.head.appendChild(el);
  }
  Object.entries(attrs).forEach(([k, v]) => (el as any).setAttribute(k, v));
}

export default function SEO({
  pageTitle,
  description,
  image,
  canonical,
  noIndex,
}: SEOProps) {
  useEffect(() => {
    const title = `AeThex | ${pageTitle}`;
    document.title = title;

    if (canonical) {
      upsertMeta('link[rel="canonical"]', {
        rel: "canonical",
        href: canonical,
      });
      upsertMeta('meta[property="og:url"]', {
        property: "og:url",
        content: canonical,
      });
    }

    if (description) {
      upsertMeta('meta[name="description"]', {
        name: "description",
        content: description,
      });
      upsertMeta('meta[property="og:description"]', {
        property: "og:description",
        content: description,
      });
      upsertMeta('meta[name="twitter:description"]', {
        name: "twitter:description",
        content: description,
      });
    }

    upsertMeta('meta[property="og:title"]', {
      property: "og:title",
      content: title,
    });
    upsertMeta('meta[name="twitter:title"]', {
      name: "twitter:title",
      content: title,
    });

    if (image) {
      upsertMeta('meta[property="og:image"]', {
        property: "og:image",
        content: image,
      });
      upsertMeta('meta[name="twitter:image"]', {
        name: "twitter:image",
        content: image,
      });
    }

    if (noIndex) {
      upsertMeta('meta[name="robots"]', {
        name: "robots",
        content: "noindex, nofollow",
      });
      upsertMeta('meta[name="googlebot"]', {
        name: "googlebot",
        content: "noindex, nofollow",
      });
    }
  }, [pageTitle, description, image, canonical, noIndex]);

  return null;
}