2022-12-31 18:03:26 -08:00
|
|
|
import type { AgGridReact as AgGridReactType } from '@ag-grid-community/react/lib/agGridReact';
|
|
|
|
|
import { useRef } from 'react';
|
|
|
|
|
import { useParams } from 'react-router';
|
2023-01-01 13:58:05 -08:00
|
|
|
import { AnimatedPage } from '/@/renderer/features/shared';
|
2022-12-31 18:03:26 -08:00
|
|
|
|
|
|
|
|
const PlaylistDetailRoute = () => {
|
2023-01-01 13:58:05 -08:00
|
|
|
// const tableRef = useRef<AgGridReactType | null>(null);
|
2022-12-31 18:03:26 -08:00
|
|
|
const { playlistId } = useParams() as { playlistId: string };
|
|
|
|
|
|
2023-01-01 13:58:05 -08:00
|
|
|
// const detailsQuery = usePlaylistDetail({
|
|
|
|
|
// id: playlistId,
|
|
|
|
|
// });
|
2022-12-31 18:03:26 -08:00
|
|
|
|
2023-01-01 13:58:05 -08:00
|
|
|
// const playlistSongsQuery = usePlaylistSongList({
|
|
|
|
|
// id: playlistId,
|
|
|
|
|
// limit: 50,
|
|
|
|
|
// startIndex: 0,
|
|
|
|
|
// });
|
2022-12-31 18:03:26 -08:00
|
|
|
|
2023-01-01 13:58:05 -08:00
|
|
|
// const imageUrl = playlistSongsQuery.data?.items?.[0]?.imageUrl;
|
|
|
|
|
// const background = useFastAverageColor(imageUrl);
|
|
|
|
|
// const containerRef = useRef();
|
2022-12-31 18:03:26 -08:00
|
|
|
|
2023-01-01 13:58:05 -08:00
|
|
|
// const { ref, entry } = useIntersection({
|
|
|
|
|
// root: containerRef.current,
|
|
|
|
|
// threshold: 0.3,
|
|
|
|
|
// });
|
2022-12-31 18:03:26 -08:00
|
|
|
|
2023-01-01 13:58:05 -08:00
|
|
|
return <AnimatedPage key={`playlist-detail-${playlistId}`}>Placeholder</AnimatedPage>;
|
2022-12-31 18:03:26 -08:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
export default PlaylistDetailRoute;
|