Adding from my closed request in #5189

Similarly how there is a toggle to hide watched videos from homepage I'd like to suggest a toggle to also hide videos that are in the watched state from recommended, search or sidebar when in a video, from the channel pages and from playlists. That way only videos that are unscene or unwatched are shown as options.

I don't know if there's any voting system for feature requests, but I just wanted to mention I came here looking for this kind of functionality.

In my case, I tend to watch videos sequentially from the pages I subscribe to. Sometimes I'm in a mood to just watch a couple of videos from one specific channel, but the most recent ones are all "Watched" and I have to scroll down quite a bit to find the most recent not-watched one. The same way a channel page already has a "Sort By" dropdown, I envisioned another dropdown with "Filter", so you could hide Watched or Unwatched videos (or something else). Just a suggestion.

I also know some JS and could help with it if the feature is approved (assuming it's a good first issue). Would be a neat way to get involved with the community.

Thanks!

Hi @palharesf you are good to go if you want to create a PR for it

Sounds good @efb4f5ff-1298-471a-8973-3d47447115dc - I'll read the contributing guidelines and get started as soon as possible. Is the Discussion Board (https://github.com/FreeTubeApp/FreeTube/discussions) the best place to ask questions, or is there a Discord/Slack as well for real-time questions?

@palharesf its best to join our Matrix Community for asking realtime questions. Alternatively you can ask the questions you have on this issue.

Hi! Realistically, I'm having a hard time learning Vue and the codebase, and I don't think I'll be able to work on this feature for the time being. Wanted to formalize it here so it's up for grabs by someone else.

@palharesf maybe there is something in https://github.com/FreeTubeApp/FreeTube/issues?q=is%3Aopen+is%3Aissue+label%3A%22good+first+issue%22 that will help you learn the codebase better

Hi team,
After a while and after learning more about Vue, I decided to tackle this again. The beginning has been promising, as I've been able to (mostly) finish the visual part of the feature:

Before I get started into hooking actual functionality into these buttons, I wanted to check if it's okay to continue working on this issue.

I would also love to know if I should keep the 'Filter By' nomenclature with 'Show All', 'Hide Watched' and 'Hide Unwatched' as the options, or if it's clearer to use 'View' with 'All Videos', 'Unwatched Only' and 'Watched Only' as the options.

Thanks a lot and excited to help!

I wanted to check if it's okay to continue working on this issue.

Its definitely okay to keep working on this

As for the visual part im bot sure if this is the way we should go. What i had in mind is that the already existing toggle in the Subscription settings would handle this behavior.

Thoughts needed: @absidue @ChunkyProgrammer @PikachuEXE

I think it would be good to have label text like "show watched only"/"watched only" (might not need "show" depends on the text on "Filter By"

What i had in mind is that the already existing toggle in the Subscription settings would handle this behavior.

I am thinking the opposite. I think the UI for "only show watched" is too hidden (in settings) so that I can't use them in subscription page.

What about a toggle instead of dropdown. Enabled is hide watched and off is show all?

The hide unwatched seems a bit overkill as you can also find this info on the History page

Edit: just thinking out loud here because I'm still on the fence over this direction

I particularly find the toggle really elegant. While we narrow down and settle on the design I'll start working on the functionality itself. Thanks everyone

Ok, I think I'm making some progress on understanding the videoPanel loading logic. I can see that videos passed on the grid with the class 'watched' are the ones I want to hide if the toggle is on, but it doesn't seem to me that altering the 'latestVideos' array is the way to go here.

Is there any way to retain the current structure i.e. the FtElementList loaded with data="latestVideos", but apply an additional layer of filtering on that as it starts rendering the videos on the grid? If so, a simple check to prevent loading videos with 'watched' class if the toggle variable is true would do the trick. Checking so I keep the logic consistent with the rest of the app.

PS - updated visuals below

Thanks in advance

Hi folks,

Okay, I've made a lot of progress on my end, I'm just missing one small thing - is there a property within the latestVideos object that allow me to filter between watched and non-watched videos? I've been looking for it without success, but I assume it exists somewhere (so the VideoPanel knows when to paint the 'Watched' overlays)

I think with that I'll be finished with this. Thanks in advance :)

@palharesf There is no property for that, the ft-list-video component looks up the ID of the video that it represents in the watch history itself. That avoids having to mix FreeTube state in with the video information and also means that the lookup can be delayed until the component is scrolled into view.

https://github.com/FreeTubeApp/FreeTube/blob/development/src/renderer/components/ft-list-video/ft-list-video.js#L122-L128

@absidue got it. That makes sense. I think I just need to tinker with my helper function then, I'll take a look at the implementation in ft-list-video and implement something similar.

With that and the i18n edits I'll be ready to send the PR. Looking forward to it, thank you all for the help!

PR - #7366

Please let me know if all looks good - it's my first time submitting a PR for a public project, so I apologize in advance if I failed to follow any of the contributing guidelines (as much as I tried to comply with them)