Fix Scroll on left side navigation when clicking link

[GoPro16]

When the left side navigation height exceeds the window height it shows scroll bars.

When the user clicks a link in it, the scroll position will reset to the top.

You may have to render the dev tools and scroll up to make the docs have scroll bars.

[mcastre]

i can help with this!

[GoPro16]

i can help with this!

Please yes! If you have any questions about the codebase feel free to post a comment

[mcastre]

@GoPro16 After researching this issue, it definitely seems like it is not a simple fix. Since you are using links, the components in the navigation form will re-render because the router sees props changing on button clicks. Since the default behavior of the browser is to jump to the top of the page on page change, and since React is re-rendering several components, there is no simple fix.

The solution may be to write code to track the scroll position of the container, which is always a complicated solution. Since your navigation component is already fairly complex, i would recommend not adding more complexity to it, just to track user scroll position, which may or may not play nicely with all browsers.

However, it also might help to get a second opinion? Ill keep researching potential workarounds and look at the scroll position option.

[GoPro16]

There's definitely a solution to this, although I am unsure the exact details, the gatsby link does so prefetching to load the next page before it gets sent to the new one. So the replacement isn't exactly a full page refresh.

Apollo's source code does something very similar to ours as we mimic'd ours closely from that. There may be some other way they are tracking the scroll position if you want to dig into that.

[mcastre]

Ok cool I'll check out the Apollo source code.