import { useIsomorphicEffect, UseSeoOptions } from "hooks";

const getMetaTag = (tag: string): HTMLMetaElement | undefined => {
  // Todo: check if this is the best way to get the meta tag
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore
  return document.getElementsByTagName("meta")?.[tag];
};

const addMetaTag = (tag: string, content?: string): VoidFunction | undefined => {
  if (!content) return;
  const meta = getMetaTag(tag);
  if (!meta) return;

  const initialMetaContent = meta.content;

  meta.content = content;

  return () => {
    meta.content = initialMetaContent;
  };
};

/**
 *
 * @kind 01-Client
 * @param options
 */
export const useSeo = ({
  title,
  description,
  meta,
  robots,
  rating,
  viewport,
  googlebot,
  googleSiteVerification,
}: UseSeoOptions) => {
  useIsomorphicEffect(() => {
    const initialTitle = document.title;
    document.title = title;
    return () => {
      document.title = initialTitle;
    };
  }, [title]);

  useIsomorphicEffect(() => {
    return addMetaTag("description", description);
  }, [description]);

  useIsomorphicEffect(() => {
    return addMetaTag("robots", robots);
  }, [robots]);

  useIsomorphicEffect(() => {
    return addMetaTag("rating", rating);
  }, [rating]);

  useIsomorphicEffect(() => {
    return addMetaTag("viewport", viewport);
  }, [viewport]);

  useIsomorphicEffect(() => {
    return addMetaTag("googlebot", googlebot);
  }, [googlebot]);

  useIsomorphicEffect(() => {
    return addMetaTag("google-site-verification", googleSiteVerification);
  }, [googleSiteVerification]);

  useIsomorphicEffect(() => {
    meta?.forEach((tag) => {
      return addMetaTag(tag.name, tag.content);
    });
  }, [JSON.stringify(meta)]);
};