If you look at this function, renaming is accomplished by cloning the playlist, changing the name of the new copy, and calling updatePlaylist. The old playlist will be replaced with this copy, because they have the same id.

To delete a track from a playlist, you should create a similar function, that instead of changing the name of the cloned playlist will filter its tracks (just don't use _.remove, on the original playlist, because it mutates the state, and that's a big no-no in Redux). An example of what the filtering could look like:

updatedPlaylist.tracks = _.filter(updatedPlaylist.tracks, track => track.id !== trackToRemove.id )

BTW. This workflow makes me think it'd be a good idea to prepare a couple of simple functionalities to implement for people who are learning and would like to contribute to some open source project but who don't feel too confident yet, so that they can solve a real life problem while being guided in a friendly way, both learning and contributing.

Thanks for the guidance, I'll try my best to implement the above example-code into a delete-track function!

To answer your above-mentioned idea about making some issues that contain a couple of simple functionalities to implement for people who are learning and would like to contribute to some open source project:
I'm currently working as a curator in Denmark but while taking some upgrading IT courses, I was absolutely overwhelmed with awe when I found out what you could do with code.
I'm currently preparing myself and my skills for searching for jobs in the software-developing industry and none of my friends know anything about code, so for you to help me solve this issue in your app means the world to me. You not only learn how to decode another persons work but you also learn how things are connected and mapped in a framework like react.
I'm sure others, who are in a similar situation as I'm in, and are trying to detach themselves from youtube tutorials and actually throw themselves at a real issue that needs to be solved for a real app will benefit greatly from it just as it has benefitted me.

It was right to have removeTrack have id as its argument. That's the information by which you can distinguish the tracks on the playlist. You don't need to touch actions/playlists.js. The place for this function is in PlaylistView/index.js, in the PlaylistView class.

Take a look how renamePlaylist updates the playlists (starts here:

The steps that you'll need to take are:

• clone the original playlist
• filter out the track clicked by the user
• replace the cloned playlist's track list with the filtered one
• update the playlist using the clone

And then after you have this function, you can connect it to the button like you already did (by supplying it in the onDelete prop of TrackRow).

Thanks, I'll give it my best shot!

You almost got it. Just remember that you don't have to modify anything in actions/playlists.js to make this work. You can revert your changes there. Maybe I'm explaining this too chaotically. I'll try to explain it better in a bit.

Hi nuke, I'm sorry it's been a while since I last made a pull request, I've been on vacation.
I deleted the code I had made in actions/playlists.js, so this should now be in order.

No problems, we don't have deadlines here. You can contribute at your own pace. I'll test your code now.

The code is still not working, but I'm pretty sure I'm getting close.

Hey @nukeop this should be the final and working code if I'm not wrong :-)

Yes, I think you've nailed it. I'll verify so that we're 100% sure.

Btw, this could be a good opportunity to add a test for this function too. I'll check if I can add code to your branch and if not I'll add it in a comment and ask you to commit it, if you agree.

I noticed that you need to add a new field to the track table header at the beginning.

I'll add the tests after you correct this small issue and merge everything, so you don't have to worry about it.

4ebaf74

This is how I intend to test the updatePlaylist function after your changes, for reference. I implemented dependency injection for deletePlaylist here, updatePlaylist will be refactored similarly.

Hi Nuke, I'm experiencing some issues with opening the app on my computer common to the error I've had before with only the logo of the app appearing when running the app in the browser. Even though I am pretty sure I can code the last bit without looking at the result of the code in the app, I still want to make sure it works before I push it to Github. I just want to make you know, that I haven't forgot about this issue and that i'll soon be pushing the final bit of code up :-)

No problem, take as much time as you need.

Hi nuke, I finally got time again to work on this project, as I have been taking a bunch of React courses and freelance work to really understand what this app is all about and how it really works. It's been a time since I've last worked in the dev version of Nuclear and now my gitbash throws me an error every time I try to use npm run:watch in the app directory saying ''webpack-dev-server' is not recognized as an internal or external command'. I downloaded webpack for this project, but is does not seem to work, do you have any suggestions for why this error might appear?

I've changed the architecture in a major way recently. You can either try using docker (it's just one command to run dev mode now), or you could clone the repo, cd to packages/app, and run the program the old way (npm run watch, and npm run electron:dev in a separate shell).