Play first podcast episode in table

[nichwall]

Brief summary

This PR changes the "Play" button on the podcast page to play the first incomplete episode in the table instead of the "newest published". The "first episode" is the top row, and is dependent on the sorting and filtering options.

Which issue is fixed?

Related to #1321.

In-depth Description

This PR adds a new field to the Vuex store to track the podcast episode IDs in the LazyEpisodesTable. This takes the current sorting and filtering of the table into account. Then, when pressing the "Play" button, the uppermost incomplete episode is played instead of the most recently released incomplete episode.

This does not fully fix the issue as mentioned in #1321 (comment) because the sorting is applied to all podcasts instead of being remembered individually. No changes should need to be made for this logic once the sort order is podcast specific.

Commit overview:

1. Add the sortedEpisodeIds to the store, which stores the episode IDs of the sorted and filtered table.
2. Change the logic to use the first row of the table.
3. Update comments and remove double reverse of array

Additional question Should this just play the very first episode instead of the first incomplete episode? The filter defaults to "incomplete", so if a user has changed to show all episodes, I think it should play whatever is in the first row, regardless of the completion status.

How have you tested this?

Added several podcasts (some serial and some episodic). Changed sort and filter options, navigating between podcasts to ensure that the state was being updated correctly and the first incomplete episode was correctly played.

Screenshots

To illustrate what is happening, the episode in the red box is the episode which will be played when pressing the "Play" button above the description.

[advplyr]

I made 2 updates:

1. I updated the episode list to come from the LazyEpisodesTable component rather than using the store.
2. I updated the play button on individual episodes to populate the queue using the table episodes instead of the pub date sort.

When making change 2 I fixed an existing bug where if you press play on a finished episode it would play that episode but not add it to the queue.

Additional question Should this just play the very first episode instead of the first incomplete episode? The filter defaults to "incomplete", so if a user has changed to show all episodes, I think it should play whatever is in the first row, regardless of the completion status.

If we made that change would we also want to add every episode to the queue and not check the progress? That would probably make sense also. We can do a separate PR for that if so

Thanks!

[nichwall]

Thanks! Yeah, those changes make sense, I spent a while trying to figure out how to reference the elements from the component and the only way I could figure it out was using the store.