Add grid view for tracks (#128)

src/renderer/features/songs/components/song-list-content.tsx

@@ -4,6 +4,7 @@ import { Spinner } from '/@/renderer/components';
 import { useListContext } from '/@/renderer/context/list-context';
 import { useListStoreByKey } from '/@/renderer/store';
 import { ListDisplayType } from '/@/renderer/types';
+import { VirtualInfiniteGridRef } from '/@/renderer/components/virtual-grid';
 
 const SongListTableView = lazy(() =>
     import('/@/renderer/features/songs/components/song-list-table-view').then((module) => ({
@@ -11,12 +12,19 @@ const SongListTableView = lazy(() =>
     })),
 );
 
+const SongListGridView = lazy(() =>
+    import('/@/renderer/features/songs/components/song-list-grid-view').then((module) => ({
+        default: module.SongListGridView,
+    })),
+);
+
 interface SongListContentProps {
+    gridRef: MutableRefObject<VirtualInfiniteGridRef | null>;
     itemCount?: number;
     tableRef: MutableRefObject<AgGridReactType | null>;
 }
 
-export const SongListContent = ({ itemCount, tableRef }: SongListContentProps) => {
+export const SongListContent = ({ itemCount, gridRef, tableRef }: SongListContentProps) => {
     const { pageKey } = useListContext();
     const { display } = useListStoreByKey({ key: pageKey });
 
@@ -25,7 +33,10 @@ export const SongListContent = ({ itemCount, tableRef }: SongListContentProps) =
     return (
         <Suspense fallback={<Spinner container />}>
             {isGrid ? (
-                <></>
+                <SongListGridView
+                    gridRef={gridRef}
+                    itemCount={itemCount}
+                />
             ) : (
                 <SongListTableView
                     itemCount={itemCount}