feat: integrate Hardcover API for books

- Add lib/hardcover.ts with GraphQL client for Hardcover API
- Add routes/api/books/[name].ts for creating books via Hardcover ID
- Add routes/api/books/enhance/[name].ts for enhancing books
- Add routes/api/hardcover/query.ts for searching books
- Add routes/books/[name].tsx and index.tsx for book pages

routes/books/[name].tsx

@@ -0,0 +1,122 @@
+import { Handlers, PageProps } from "$fresh/server.ts";
+import { MainLayout } from "@components/layouts/main.tsx";
+import { KMenu } from "@islands/KMenu.tsx";
+import { YoutubePlayer } from "@components/Youtube.tsx";
+import { HashTags } from "@components/HashTags.tsx";
+import { isYoutubeLink } from "@lib/string.ts";
+import { removeImage, renderMarkdown } from "@lib/markdown.ts";
+import { RedirectSearchHandler } from "@islands/Search.tsx";
+import PageHero from "@components/PageHero.tsx";
+import { Star } from "@components/Stars.tsx";
+import { MetaTags } from "@components/MetaTags.tsx";
+import { fetchResource } from "@lib/marka/index.ts";
+import { BookResource } from "@lib/marka/schema.ts";
+import { parseRating } from "@lib/helpers.ts";
+
+export const handler: Handlers<{ book: BookResource; session: unknown }> =
+  {
+    async GET(_, ctx) {
+      const book = await fetchResource<BookResource>(
+        `books/${ctx.params.name}.md`,
+      );
+      if (!book) {
+        return ctx.renderNotFound();
+      }
+      return ctx.render({ book, session: ctx.state.session });
+    },
+  };
+
+export default function Greet(
+  props: PageProps<
+    { book: BookResource; session: Record<string, string> }
+  >,
+) {
+  const { book, session } = props.data;
+
+  const { author, datePublished, reviewRating, bookBody = "", reviewBody } =
+    book?.content || {};
+
+  const bookContent = renderMarkdown(
+    removeImage(bookBody, book.image?.url),
+  );
+
+  const reviewContent = reviewBody
+    ? renderMarkdown(removeImage(reviewBody, book.image?.url))
+    : undefined;
+
+  const rating = reviewRating?.ratingValue &&
+    parseRating(reviewRating.ratingValue);
+
+  return (
+    <MainLayout
+      url={props.url}
+      title={`Book > ${book.content.headline}`}
+      context={book}
+    >
+      <RedirectSearchHandler />
+      <KMenu type="main" context={book} />
+      <MetaTags resource={book} />
+
+      <PageHero
+        image={book.image?.url}
+        thumbhash={book.image?.thumbhash}
+      >
+        <PageHero.Header>
+          <PageHero.BackLink href="/books" />
+          {session && (
+            <PageHero.EditLink
+              href={`https://notes.max-richter.dev/resources/books/${book.name}`}
+            />
+          )}
+        </PageHero.Header>
+        <PageHero.Footer>
+          <PageHero.Title link={book.content.url}>
+            {book.content.headline}
+          </PageHero.Title>
+          <PageHero.Subline
+            entries={[
+              author?.name && {
+                title: author.name,
+                href: `/?q=${encodeURIComponent(author?.name)}`,
+              },
+              datePublished?.toString(),
+            ]}
+          >
+            {rating && <Star rating={rating} />}
+          </PageHero.Subline>
+        </PageHero.Footer>
+      </PageHero>
+      {book.content?.keywords?.length && (
+        <>
+          <br />
+          <HashTags tags={book.content.keywords} />
+        </>
+      )}
+
+      <div class="px-8 text-white mt-10">
+        {(book.content.url && isYoutubeLink(book.content.url)) && (
+          <YoutubePlayer link={book.content.url} />
+        )}
+        <pre
+          class="whitespace-break-spaces markdown-body"
+          data-color-mode="dark"
+          data-dark-theme="dark"
+          // deno-lint-ignore react-no-danger
+          dangerouslySetInnerHTML={{ __html: bookContent || "" }}
+        />
+        {reviewContent && (
+          <>
+            <h2 class="text-4xl font-bold mb-4 mt-8">Review</h2>
+            <pre
+              class="whitespace-break-spaces markdown-body"
+              data-color-mode="dark"
+              data-dark-theme="dark"
+              // deno-lint-ignore react-no-danger
+              dangerouslySetInnerHTML={{ __html: reviewContent }}
+            />
+          </>
+        )}
+      </div>
+    </MainLayout>
+  );
+}