LB-619: Improve page navigation on History page

[ishaanshah]

Problem

• If an user directly goes to a page /user/u/history?page=4&range=all_time&entity=artist, they see the page flash with the contents of page 1, before being replaced with the contents of page 4. Ideally the page should just show the data of page 4 immediately.
• If an user goes to a page, and then click the next button, the URL updates, and the data updates, but if they click the browser's back button, the URL changes but the data on the page doesn't change.

Jira Ticket - LB-619

Solution

Using the popstate event to restore the data when back or forward button is pressed solves the issue.

[MonkeyDo]

Well done on getting the navigation to work.
The component seems a bit cleaner too.

I can't test this locally (no stats), but I'm happy to do a round of testing on beta.

[ishaanshah]

Well done on getting the navigation to work.
The component seems a bit cleaner too.

I can't test this locally (no stats), but I'm happy to do a round of testing on beta.

You can change the API URL in your config file to api.listenbrainz.org so that it would work without stats being present.

[paramsingh]

You can change the API URL in your config file to api.listenbrainz.org so that it would work without stats being present.

We should document this somewhere.

[paramsingh]

Deployed on beta.

• The first load starts with Top S of the Year 2020 right now, we'll probably fix it with the dual loading thing MrMonkey and alastair are working on.
• The Graph transitions seem to have gotten weird, there's some invalid state between them. Maybe when we change state, we should set a loading: true and in the render function when loading is true show a Loading spinner.

[ishaanshah]

Demo of the loader
https://drive.google.com/file/d/1OEoEta8uNwRYrrHnUPC1anKqHp9lR-y-/view?usp=sharing

[shivam-kapila]

@ishaanshah Can you please enable link sharing access for the loader demo.

[paramsingh]

Looks good to me overall. Just a few comments.