feat: connect frontend to graphql

backend/package.json

@@ -10,7 +10,7 @@
   "description": "",
   "main": "dist/index.js",
   "scripts": {
-    "prestart": "pnpm exec graphql-codegen",
+    "prestart": "graphql-codegen",
     "typecheck": "tsc",
     "dev": "tsx src/index.ts",
     "build": "esbuild src/index.ts --bundle --platform=node --format=esm --target=node24 --packages=external --outfile=dist/index.js",

frontend/app/api/toBook.ts

@@ -0,0 +1,31 @@
+import type { Book } from "~/api/types";
+import type {
+  BookQuery,
+  SearchBooksQuery,
+} from "~/api/types/graphql.generated";
+
+// This complicated regex is to extract the year from the
+// publishDate string from the dataset we used in Kaggle.
+// It's not perfect, and we should probably decide later if
+// we want to extract the year in the upload script itself,
+// and turn publishedDate from a string into one integer 'year'
+// to be able to sort/filter by year.
+function yearFromPublishDate(publishDate: string | null): number | undefined {
+  const match = publishDate?.match(/\d{4}/);
+  return match ? Number(match[0]) : undefined;
+}
+
+// Converts a book from our GraphQL API to the Book type used by the components.
+export function toBook(
+  book:
+    | NonNullable<BookQuery["book"]>
+    | NonNullable<SearchBooksQuery["searchBooks"]>["books"][number],
+): Book {
+  return {
+    id: String(book.id),
+    title: book.title,
+    author: [book.author],
+    publishedYear: yearFromPublishDate(book.publishDate),
+    coverImage: book.coverImgUrl ?? undefined,
+  };
+}

frontend/app/api/types/graphql.generated.ts

@@ -0,0 +1,44 @@
+/** Internal type. DO NOT USE DIRECTLY. */
+type Exact<T extends { [key: string]: unknown }> = { [K in keyof T]: T[K] };
+/** Internal type. DO NOT USE DIRECTLY. */
+export type Incremental<T> =
+  | T
+  | {
+      [P in keyof T]?: P extends " $fragmentName" | "__typename" ? T[P] : never;
+    };
+export type BookQueryVariables = Exact<{
+  id: number;
+}>;
+
+export type BookQuery = {
+  book: {
+    __typename: "Book";
+    id: number;
+    title: string;
+    author: string;
+    publishDate: string | null;
+    coverImgUrl: string | null;
+    description: string | null;
+  } | null;
+};
+
+export type SearchBooksQueryVariables = Exact<{
+  title?: string | null | undefined;
+  limit?: number | null | undefined;
+  offset?: number | null | undefined;
+}>;
+
+export type SearchBooksQuery = {
+  searchBooks: {
+    __typename: "BookSearchResult";
+    totalCount: number;
+    books: Array<{
+      __typename: "Book";
+      id: number;
+      title: string;
+      author: string;
+      publishDate: string | null;
+      coverImgUrl: string | null;
+    }>;
+  };
+};