Add Ignored tab to Channel page (#927)

* Add Ignored tab to Channel page

* fix for Ignored button action

* use ignored parameter as bool

---------

Co-authored-by: Simon <simobilleter@gmail.com>

backend/channel/serializers.py

@@ -90,6 +90,7 @@ class ChannelNavSerializer(serializers.Serializer):
     """serialize channel navigation"""
 
     has_pending = serializers.BooleanField()
+    has_ignored = serializers.BooleanField()
     has_playlists = serializers.BooleanField()
     has_videos = serializers.BooleanField()
     has_streams = serializers.BooleanField()

backend/channel/src/nav.py

@@ -13,6 +13,7 @@ class ChannelNav:
         """build nav items"""
         nav = {
             "has_pending": self._get_has_pending(),
+            "has_ignored": self._get_has_ignored(),
             "has_playlists": self._get_has_playlists(),
         }
         nav.update(self._get_vid_types())
@@ -63,6 +64,24 @@ class ChannelNav:
 
         return bool(response["hits"]["hits"])
 
+    def _get_has_ignored(self):
+        """Check if there are ignored videos in the download queue"""
+        data = {
+            "size": 1,
+            "query": {
+                "bool": {
+                    "must": [
+                        {"term": {"status": {"value": "ignore"}}},
+                        {"term": {"channel_id": {"value": self.channel_id}}},
+                    ]
+                }
+            },
+            "_source": False,
+        }
+        response, _ = ElasticWrap("ta_download/_search").get(data=data)
+
+        return bool(response["hits"]["hits"])
+
     def _get_has_playlists(self):
         """check if channel has playlists"""
         path = "ta_playlist/_search"

frontend/src/api/loader/loadChannelNav.ts

@@ -5,6 +5,7 @@ export type ChannelNavResponseType = {
   has_shorts: boolean;
   has_playlists: boolean;
   has_pending: boolean;
+  has_ignored: boolean;
 };
 
 const loadChannelNav = async (youtubeChannelId: string) => {

frontend/src/configuration/routes/RouteList.ts

@@ -10,7 +10,8 @@ const Routes = {
   Playlists: '/playlist/',
   Playlist: (id: string) => `/playlist/${id}`,
   Downloads: '/downloads/',
-  DownloadsByChannelId: (channelId: string) => `/downloads/?channel=${channelId}`,
+  DownloadsByChannelId: (channelId: string) => `/downloads/?channel=${channelId}&ignored=false`,
+  IgnoredByChannelId: (channelId: string) => `/downloads/?channel=${channelId}&ignored=true`,
   Search: '/search/',
   SettingsDashboard: '/settings/',
   SettingsUser: '/settings/user/',

frontend/src/pages/ChannelBase.tsx

@@ -27,7 +27,7 @@ const ChannelBase = () => {
   const { data: channelNavData } = channelNav ?? {};
 
   const channel = channelResponseData;
-  const { has_streams, has_shorts, has_playlists, has_pending } = channelNavData || {};
+  const { has_streams, has_shorts, has_playlists, has_pending, has_ignored } = channelNavData || {};
 
   useEffect(() => {
     (async () => {
@@ -84,6 +84,11 @@ const ChannelBase = () => {
               <h3>Downloads</h3>
             </Link>
           )}
+          {has_ignored && isAdmin && (
+            <Link to={Routes.IgnoredByChannelId(channelId)}>
+              <h3>Ignored</h3>
+            </Link>
+          )}
         </div>
 
         <Notifications

frontend/src/pages/Download.tsx

@@ -52,6 +52,7 @@ const Download = () => {
   const { currentPage, setCurrentPage } = useOutletContext() as OutletContextType;
 
   const channelFilterFromUrl = searchParams.get('channel');
+  const ignoredOnlyParam = searchParams.get('ignored');
 
   const [refresh, setRefresh] = useState(false);
   const [showHiddenForm, setShowHiddenForm] = useState(false);
@@ -82,7 +83,8 @@ const Download = () => {
 
   const view = userConfig.view_style_downloads;
   const gridItems = userConfig.grid_items;
-  const showIgnored = userConfig.show_ignored_only;
+  const showIgnored =
+    ignoredOnlyParam !== null ? ignoredOnlyParam === 'true' : userConfig.show_ignored_only;
   const isGridView = view === ViewStyles.grid;
   const gridView = isGridView ? `boxed-${gridItems}` : '';
   const gridViewGrid = isGridView ? `grid-${gridItems}` : '';
@@ -234,6 +236,9 @@ const Download = () => {
                 id="showIgnored"
                 onChange={() => {
                   handleUserConfigUpdate({ show_ignored_only: !showIgnored });
+                  const newParams = new URLSearchParams(searchParams.toString());
+                  newParams.set('ignored', String(!showIgnored));
+                  setSearchParams(newParams);
                   setRefresh(true);
                 }}
                 type="checkbox"