Routing works, but scroll bar remains static

I added a HashLink, which (when I click "Projects" in my navbar) is to scroll to a section of my home page with an id of "projects". It works, the page is smooth scrolling to the correct section.

However, I'm noticing that my scroll bar isn't changing, and remains static. This is causing the section of my home page above the id to be cut off. Here is a video to demonstrate, notice the scroll bar doesn't change when I active the HashLink by clicking "Projects".

Is there a way I can correct this issue? My NavBar currently looks like this:

import React from "react";
import "./Nav.css";
import { HashLink } from "react-router-hash-link";

export default function Nav() {
  return (
    <div>
      <ul>
        <li>
          <a href="#">About</a>
        </li>
        <li>
          <HashLink smooth to="/#projects">
            Projects
          </HashLink>
        </li>
      </ul>
    </div>
  );
}

rafgraph / react-router-hash-link

Routing works, but scroll bar remains static #101