feat(frontend): show recent listens

frontend/src/api/api.ts

@@ -1,4 +1,7 @@
-import { User } from "./user";
+import { Listen } from "./entities/listen";
+import { Pagination } from "./entities/pagination";
+import { PaginationOptions } from "./entities/pagination-options";
+import { User } from "./entities/user";
 
 export class UnauthenticatedError extends Error {}
 
@@ -38,3 +41,29 @@ export const getUsersMe = async (): Promise<User> => {
   const user: User = await res.json();
   return user;
 };
+
+export const getRecentListens = async (
+  options: PaginationOptions = { page: 1, limit: 10 }
+): Promise<Pagination<Listen>> => {
+  const { page, limit } = options;
+
+  const res = await fetch(`/api/v1/listens?page=${page}&limit=${limit}`, {
+    headers: getDefaultHeaders(),
+  });
+
+  switch (res.status) {
+    case 200: {
+      break;
+    }
+    case 401: {
+      throw new UnauthenticatedError(`No token or token expired`);
+    }
+    default: {
+      throw new Error(`Unable to getRecentListens: ${res.status}`);
+    }
+  }
+
+  const listens: Pagination<Listen> = await res.json();
+  console.log("getRecentListens", { listens });
+  return listens;
+};

frontend/src/api/entities/listen.ts

@@ -0,0 +1,32 @@
+export interface Listen {
+  id: string;
+  playedAt: string;
+  track: Track;
+}
+
+interface Track {
+  id: string;
+  name: string;
+  album: Album;
+  artists: Artist[];
+  spotify?: SpotifyInfo;
+}
+
+interface Album {
+  id: string;
+  name: string;
+  spotify?: SpotifyInfo;
+}
+
+interface Artist {
+  id: string;
+  name: string;
+  spotify?: SpotifyInfo;
+}
+
+interface SpotifyInfo {
+  id: string;
+  uri: string;
+  type: string;
+  href: string;
+}

frontend/src/api/entities/pagination-options.ts

@@ -0,0 +1,4 @@
+export interface PaginationOptions {
+  limit: number;
+  page: number;
+}

frontend/src/api/entities/pagination.ts

@@ -0,0 +1,33 @@
+export interface Pagination<PaginationObject> {
+  /**
+   * a list of items to be returned
+   */
+  items: PaginationObject[];
+  /**
+   * associated meta information (e.g., counts)
+   */
+  meta: PaginationMeta;
+}
+
+export interface PaginationMeta {
+  /**
+   * the amount of items on this specific page
+   */
+  itemCount: number;
+  /**
+   * the total amount of items
+   */
+  totalItems: number;
+  /**
+   * the amount of items that were requested per page
+   */
+  itemsPerPage: number;
+  /**
+   * the total amount of pages in this paginator
+   */
+  totalPages: number;
+  /**
+   * the current page this paginator "points" to
+   */
+  currentPage: number;
+}