feat: add filtering for now playing view and sidebar

src/renderer/features/now-playing/routes/now-playing-route.tsx

@@ -1,7 +1,7 @@
 import type { Song } from '/@/shared/types/domain-types';
 import type { AgGridReact as AgGridReactType } from '@ag-grid-community/react/lib/agGridReact';
 
-import { useRef } from 'react';
+import { useRef, useState } from 'react';
 
 import { VirtualGridContainer } from '/@/renderer/components/virtual-grid';
 import { NowPlayingHeader } from '/@/renderer/features/now-playing/components/now-playing-header';
@@ -11,13 +11,19 @@ import { AnimatedPage } from '/@/renderer/features/shared';
 
 const NowPlayingRoute = () => {
     const queueRef = useRef<null | { grid: AgGridReactType<Song> }>(null);
+    const [search, setSearch] = useState<string | undefined>(undefined);
 
     return (
         <AnimatedPage>
             <VirtualGridContainer>
                 <NowPlayingHeader />
-                <PlayQueueListControls tableRef={queueRef} type="nowPlaying" />
-                <PlayQueue ref={queueRef} type="nowPlaying" />
+                <PlayQueueListControls
+                    handleSearch={setSearch}
+                    searchTerm={search}
+                    tableRef={queueRef}
+                    type="nowPlaying"
+                />
+                <PlayQueue ref={queueRef} searchTerm={search} type="nowPlaying" />
             </VirtualGridContainer>
         </AnimatedPage>
     );