search

lplawlor / brushma

Next.js web app for creating a tooth-brushing playlist using the Spotify API.
https://www.brushma.com/
MIT License
3 stars 0 forks source link

Loading Screens / Bars #4

Closed lplawlor closed 1 year ago

lplawlor commented 1 year ago

Proper loading animations and/or bars should be shown as components when getting the authentication token, user info, library, or any other fetching action. This can likely be accomplished using loading.ts files (as described here) and the React Suspense feature.

In particular, providing a callback to the getFilteredLibrary() function in src/helpers/library.ts would be useful to update the screen for every HTTP request made to the Spotify API (each returns 50 songs). Currently, it takes just over a minute to fetch my entire library of 6160 songs, so an informative loading bar is particularly important here.

lplawlor commented 1 year ago

Added in a30eb3c. This does not use a callback, so is not very informative. However, 791462e reduced the runtime by about 10x, so the loading spinner is not on screen for long.