import { useEffect } from 'react';
import { useLocation } from 'react-router-dom';

export function ScrollToHashElement() {
  const { hash } = useLocation();

  useEffect(() => {
    const hashElement = document.getElementById(hash.slice(1));

    if (hashElement)
      hashElement.scrollIntoView({
        behavior: 'smooth',
        inline: 'nearest',
        block: 'start',
      });
  }, [hash]);

  return null;
}
