import React, { useEffect } from "react";
import "./Highlight.css";

interface HighlightProps {
  targetId: string;
}

export const Highlight: React.FC<HighlightProps> = ({ targetId }) => {
  useEffect(() => {
    const targetElement = document.getElementById(targetId);
    if (targetElement) {
      targetElement.classList.add("highlighted");
    }

    return () => {
      const targetElement = document.getElementById(targetId);
      if (targetElement) {
        targetElement.classList.remove("highlighted");
      }
    };
  }, [targetId]);

  return null;
};