diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 83009fe..eabcfaf 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -5,9 +5,10 @@ import { LoginSuccess } from "./components/LoginSuccess"; import { NavBar } from "./components/NavBar"; import { RecentListens } from "./components/RecentListens"; import { ReportListens } from "./components/ReportListens"; +import { ReportTopAlbums } from "./components/ReportTopAlbums"; +import { ReportTopArtists } from "./components/ReportTopArtists"; import { useAuth } from "./hooks/use-auth"; import "./tailwind/generated.css"; -import { ReportTopArtists } from "./components/ReportTopArtists"; export function App() { const { isLoaded } = useAuth(); @@ -28,6 +29,7 @@ export function App() { + ); diff --git a/frontend/src/api/api.ts b/frontend/src/api/api.ts index ec02fc4..2b95506 100644 --- a/frontend/src/api/api.ts +++ b/frontend/src/api/api.ts @@ -5,6 +5,8 @@ import { ListenReportItem } from "./entities/listen-report-item"; import { ListenReportOptions } from "./entities/listen-report-options"; import { Pagination } from "./entities/pagination"; import { PaginationOptions } from "./entities/pagination-options"; +import { TopAlbumsItem } from "./entities/top-albums-item"; +import { TopAlbumsOptions } from "./entities/top-albums-options"; import { TopArtistsItem } from "./entities/top-artists-item"; import { TopArtistsOptions } from "./entities/top-artists-options"; @@ -110,3 +112,40 @@ export const getTopArtists = async ( } = res; return items; }; + +export const getTopAlbums = async ( + options: TopAlbumsOptions, + client: AxiosInstance +): Promise => { + const { + time: { timePreset, customTimeStart, customTimeEnd }, + } = options; + + const res = await client.get<{ items: TopAlbumsItem[] }>( + `/api/v1/reports/top-albums`, + { + params: { + timePreset, + customTimeStart: formatISO(customTimeStart), + customTimeEnd: formatISO(customTimeEnd), + }, + } + ); + + switch (res.status) { + case 200: { + break; + } + case 401: { + throw new UnauthenticatedError(`No token or token expired`); + } + default: { + throw new Error(`Unable to getTopAlbums: ${res.status}`); + } + } + + const { + data: { items }, + } = res; + return items; +}; diff --git a/frontend/src/api/entities/album.ts b/frontend/src/api/entities/album.ts index 2fb1059..b8ad33f 100644 --- a/frontend/src/api/entities/album.ts +++ b/frontend/src/api/entities/album.ts @@ -1,7 +1,9 @@ +import { Artist } from "./artist"; import { SpotifyInfo } from "./spotify-info"; export interface Album { id: string; name: string; spotify?: SpotifyInfo; + artists?: Artist[]; } diff --git a/frontend/src/api/entities/top-albums-item.ts b/frontend/src/api/entities/top-albums-item.ts new file mode 100644 index 0000000..9dc5114 --- /dev/null +++ b/frontend/src/api/entities/top-albums-item.ts @@ -0,0 +1,6 @@ +import { Album } from "./album"; + +export interface TopAlbumsItem { + album: Album; + count: number; +} diff --git a/frontend/src/api/entities/top-albums-options.ts b/frontend/src/api/entities/top-albums-options.ts new file mode 100644 index 0000000..c4aaf6e --- /dev/null +++ b/frontend/src/api/entities/top-albums-options.ts @@ -0,0 +1,5 @@ +import { TimeOptions } from "./time-options"; + +export interface TopAlbumsOptions { + time: TimeOptions; +} diff --git a/frontend/src/api/entities/top-artists-options.ts b/frontend/src/api/entities/top-artists-options.ts index 7853978..19ab792 100644 --- a/frontend/src/api/entities/top-artists-options.ts +++ b/frontend/src/api/entities/top-artists-options.ts @@ -1,4 +1,3 @@ -import { TimePreset } from "./time-preset.enum"; import { TimeOptions } from "./time-options"; export interface TopArtistsOptions { diff --git a/frontend/src/components/NavBar.tsx b/frontend/src/components/NavBar.tsx index 4d85308..253c581 100644 --- a/frontend/src/components/NavBar.tsx +++ b/frontend/src/components/NavBar.tsx @@ -28,6 +28,9 @@ export const NavBar: React.FC = () => { Top Artists + + Top Albums + )} diff --git a/frontend/src/components/ReportTimeOptions.tsx b/frontend/src/components/ReportTimeOptions.tsx index 5763786..588efdb 100644 --- a/frontend/src/components/ReportTimeOptions.tsx +++ b/frontend/src/components/ReportTimeOptions.tsx @@ -23,7 +23,7 @@ export const ReportTimeOptions: React.FC = ({ setTimeOptions, }) => { return ( -
+