I got Storybook project where I have story with 100+ icons in it, I wrapped each icon with tag and assign corresponding icon name at the end of the
href={/?path=/story/design-system-v2-foundations-iconography--all-icons#${data.name}} and added id with the same data.name value.

The issue I am having with the window.location.hash is only when I want to go to the specific icon outiside of the Story book for example coping url to the specific icon and pasting into another browser tab.
Anyone have idea how to achieve this? THanks

  const [hash, setHash] = useState(window.location.hash);

  useEffect(() => {
    if (hash) {
      const element = document.getElementById(hash.substring(1));
      if (element) {
        element.scrollIntoView({ behavior: 'smooth', block: 'center' });
      }
    }
  }, [hash]);