Upon finishing the “Jammming” challenge project, I went ahead like everyone else to the feature request supplement. I’ll admit that I felt too lazy to draft and implement a new feature request from scratch, so I decided to implement the example provided. Building on the base project, the web app also retrieves a list of existing playlists on the user’s account, any of which they can select. The app’s state is updated with the selected playlist’s ID, name and tracks upon selection, allowing the user to modify the playlist by adding and removing tracks, as well as editing the playlist’s name.
However, I went a few steps further and added some functionality to spruce things up:
- The web app only displays playlists created (owned) by the user, both public and private.
- The user may refresh the list of playlists displayed by using the “Refresh” button beneath (makes a fresh call to the Spotify API). The list is also automatically refreshed once the current playlist is saved.
- Upon selecting an existing playlist and adding/removing tracks, the user may save the changes to the current playlist as a new playlist (resets playlist ID state to
nulland calls the save function).
- The user may clear the current playlist from the web app (resets state for playlist ID, name and tracks to default) and start editing again from scratch.
I also modified the CSS to deal with the issue with overflowing text in the search results, playlist and list of playlists.