From d33917b541d03fef2a9e8291bafe4cc8cd832d32 Mon Sep 17 00:00:00 2001
From: Simon <simobilleter@gmail.com>
Date: Tue, 7 Jan 2025 10:02:48 +0700
Subject: [PATCH] fix playlist detail filter bar

---
 .pre-commit-config.yaml         |  2 ++
 frontend/src/pages/Playlist.tsx | 18 ++++--------------
 2 files changed, 6 insertions(+), 14 deletions(-)

diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml
index 1fed55f5..b2430617 100644
--- a/.pre-commit-config.yaml
+++ b/.pre-commit-config.yaml
@@ -35,6 +35,8 @@ repos:
     hooks:
       - id: eslint
         name: eslint
+        files: \.[jt]sx?$
+        types: [file]
         entry: npm run --prefix ./frontend lint
         pass_filenames: false
   - repo: https://github.com/pre-commit/mirrors-prettier
diff --git a/frontend/src/pages/Playlist.tsx b/frontend/src/pages/Playlist.tsx
index ff8816de..d9b9e817 100644
--- a/frontend/src/pages/Playlist.tsx
+++ b/frontend/src/pages/Playlist.tsx
@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react';
 import { Link, useNavigate, useOutletContext, useParams, useSearchParams } from 'react-router-dom';
 import loadPlaylistById from '../api/loader/loadPlaylistById';
 import { OutletContextType } from './Base';
-import { ConfigType, VideoType, ViewLayoutType } from './Home';
+import { ConfigType, VideoType } from './Home';
 import Filterbar from '../components/Filterbar';
 import { PlaylistEntryType } from './Playlists';
 import loadChannelById from '../api/loader/loadChannelById';
@@ -62,11 +62,6 @@ const Playlist = () => {
   const { currentPage, setCurrentPage } = useOutletContext() as OutletContextType;
   const isAdmin = useIsAdmin();
 
-  const userMeConfig = userConfig.config;
-
-  const [hideWatched, setHideWatched] = useState(userMeConfig.hide_watched || false);
-  const [view, setView] = useState<ViewLayoutType>(userMeConfig.view_style_home || 'grid');
-  const [gridItems, setGridItems] = useState(userMeConfig.grid_items || 3);
   const [descriptionExpanded, setDescriptionExpanded] = useState(false);
   const [refresh, setRefresh] = useState(false);
   const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
@@ -86,6 +81,9 @@ const Playlist = () => {
   const videoInPlaylistCount = pagination?.total_hits;
   const showEmbeddedVideo = videoId !== null;
 
+  const view = userConfig.config.view_style_home;
+  const gridItems = userConfig.config.grid_items;
+  const hideWatched = userConfig.config.hide_watched;
   const isGridView = view === ViewStyles.grid;
   const gridView = isGridView ? `boxed-${gridItems}` : '';
   const gridViewGrid = isGridView ? `grid-${gridItems}` : '';
@@ -322,14 +320,6 @@ const Playlist = () => {
       <div className={`boxed-content ${gridView}`}>
         <Filterbar
           hideToggleText="Hide watched videos:"
-          hideWatched={hideWatched}
-          isGridView={isGridView}
-          view={view}
-          gridItems={gridItems}
-          userMeConfig={userMeConfig}
-          setHideWatched={setHideWatched}
-          setView={setView}
-          setGridItems={setGridItems}
           viewStyleName={ViewStyleNames.playlist}
           setRefresh={setRefresh}
         />