From 49702008944df9667b070d7ca13b3073bdf85236 Mon Sep 17 00:00:00 2001
From: Chris Amico <eyeseast@gmail.com>
Date: Sat, 27 Apr 2024 21:45:05 -0400
Subject: [PATCH] Move text into document route, add an api method

---
 src/common/Dropdown2.svelte                   |  6 ++--
 src/lib/api/documents.test.ts                 | 33 ++++++++++++++++++-
 src/lib/api/documents.ts                      | 15 +++++++++
 src/routes/documents/[id]-[slug]/+page.svelte | 30 +++++++++++++++++
 src/routes/documents/[id]-[slug]/+page.ts     | 11 +++++++
 .../documents/[id]-[slug]/text/+page.svelte   | 23 -------------
 .../documents/[id]-[slug]/text/+page.ts       | 26 ---------------
 7 files changed, 91 insertions(+), 53 deletions(-)
 create mode 100644 src/routes/documents/[id]-[slug]/+page.ts
 delete mode 100644 src/routes/documents/[id]-[slug]/text/+page.svelte
 delete mode 100644 src/routes/documents/[id]-[slug]/text/+page.ts

diff --git a/src/common/Dropdown2.svelte b/src/common/Dropdown2.svelte
index 65fb96489..e1ea96640 100644
--- a/src/common/Dropdown2.svelte
+++ b/src/common/Dropdown2.svelte
@@ -130,7 +130,7 @@
     position: relative;
   }
   .dropdownContainer.open {
-    z-index: var(--menuActive);
+    z-index: var(--menuActive, 16);
   }
   .title {
     display: block;
@@ -143,7 +143,7 @@
     border: 1px solid rgba(0, 0, 0, 0.1);
   }
   .title:hover {
-    background: var(--light-primary);
+    background: var(--light-primary, #eff7ff);
   }
   .title.open {
     background: var(--primary);
@@ -187,7 +187,7 @@
   }
 
   .overlay {
-    z-index: var(--menuShim);
+    z-index: var(--menuShim, 14);
     position: fixed;
     top: 0;
     left: 0;
diff --git a/src/lib/api/documents.test.ts b/src/lib/api/documents.test.ts
index 5ec5f25e6..14d492f15 100644
--- a/src/lib/api/documents.test.ts
+++ b/src/lib/api/documents.test.ts
@@ -1,4 +1,10 @@
-import type { Document, DocumentUpload, Pending, Sizes } from "./types";
+import type {
+  Document,
+  DocumentText,
+  DocumentUpload,
+  Pending,
+  Sizes,
+} from "./types";
 
 import { vi, test as base, describe, expect, afterEach } from "vitest";
 import { APP_URL, DC_BASE, IMAGE_WIDTHS_ENTRIES } from "@/config/config.js";
@@ -31,11 +37,36 @@ const test = base.extend({
 
     await use(pending);
   },
+
+  text: async ({}, use: Use<DocumentText>) => {
+    const { default: text } = await import(
+      "./fixtures/documents/document.txt.json"
+    );
+
+    await use(text);
+  },
 });
 
 describe("document fetching", () => {
   test.todo("documents.get");
   test.todo("documents.search");
+
+  test("documents.text", async ({ document, text }) => {
+    const mockFetch = vi.fn().mockImplementation(async () => ({
+      ok: true,
+      async json() {
+        return text;
+      },
+    }));
+
+    const endpoint = documents.jsonUrl(document);
+
+    documents.text(document, mockFetch).then((t) => {
+      expect(t).toMatchObject(text);
+    });
+
+    expect(mockFetch).toHaveBeenCalledWith(endpoint);
+  });
 });
 
 describe("document uploads and processing", () => {
diff --git a/src/lib/api/documents.ts b/src/lib/api/documents.ts
index 662c0fa99..b55175e55 100644
--- a/src/lib/api/documents.ts
+++ b/src/lib/api/documents.ts
@@ -3,6 +3,7 @@
  */
 import type {
   Document,
+  DocumentText,
   DocumentUpload,
   DocumentResults,
   Pending,
@@ -86,6 +87,20 @@ export async function get(
   return resp.json();
 }
 
+export async function text(
+  document: Document,
+  fetch = globalThis.fetch,
+): Promise<DocumentText> {
+  const url = jsonUrl(document);
+  const resp = await fetch(url).catch(console.error);
+
+  if (!resp || isErrorCode(resp.status)) {
+    return { updated: 0, pages: [] };
+  }
+
+  return resp.json();
+}
+
 /**
  * Create new documents in a batch (or a batch of one).
  *
diff --git a/src/routes/documents/[id]-[slug]/+page.svelte b/src/routes/documents/[id]-[slug]/+page.svelte
index e69de29bb..a24ee4fb8 100644
--- a/src/routes/documents/[id]-[slug]/+page.svelte
+++ b/src/routes/documents/[id]-[slug]/+page.svelte
@@ -0,0 +1,30 @@
+<script lang="ts">
+  import ContentLayout from "$lib/components/layouts/ContentLayout.svelte";
+  import PageToolbar from "$lib/components/common/PageToolbar.svelte";
+  import TextPage from "$lib/components/documents/TextPage.svelte";
+
+  export let data;
+
+  const modes = [
+    ["document", "Document"],
+    ["text", "Text"],
+    ["thumbnails", "Thumbnails"],
+    ["notes", "Notes"],
+  ];
+</script>
+
+<ContentLayout>
+  {#await data.text then { pages }}
+    {#each pages as { page, contents }}
+      <TextPage {page} {contents} />
+    {/each}
+  {/await}
+
+  <PageToolbar slot="footer">
+    <select name="mode" slot="left">
+      {#each modes as [value, name]}
+        <option {value}>{name}</option>
+      {/each}
+    </select>
+  </PageToolbar>
+</ContentLayout>
diff --git a/src/routes/documents/[id]-[slug]/+page.ts b/src/routes/documents/[id]-[slug]/+page.ts
new file mode 100644
index 000000000..b65c51de3
--- /dev/null
+++ b/src/routes/documents/[id]-[slug]/+page.ts
@@ -0,0 +1,11 @@
+import * as documents from "$lib/api/documents";
+
+export async function load({ fetch, parent, url }) {
+  const mode = url.searchParams.get("mode") ?? "document";
+  const { document } = await parent();
+
+  return {
+    mode,
+    text: documents.text(document, fetch),
+  };
+}
diff --git a/src/routes/documents/[id]-[slug]/text/+page.svelte b/src/routes/documents/[id]-[slug]/text/+page.svelte
deleted file mode 100644
index ac3fe2a71..000000000
--- a/src/routes/documents/[id]-[slug]/text/+page.svelte
+++ /dev/null
@@ -1,23 +0,0 @@
-<script lang="ts">
-  import TextPage from "$lib/components/documents/TextPage.svelte";
-
-  export let data;
-
-  $: pages = data.pages;
-</script>
-
-<div class="container">
-  {#each pages as { page, contents }}
-    <TextPage {page} {contents} />
-  {/each}
-</div>
-
-<style>
-  .container {
-    display: flex;
-    padding: 4.75rem 2rem 0rem 2rem;
-    flex-direction: column;
-    align-items: flex-start;
-    gap: 0.25rem;
-  }
-</style>
diff --git a/src/routes/documents/[id]-[slug]/text/+page.ts b/src/routes/documents/[id]-[slug]/text/+page.ts
deleted file mode 100644
index 6d4860c34..000000000
--- a/src/routes/documents/[id]-[slug]/text/+page.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import type { DocumentText } from "$lib/api/types";
-
-import { jsonUrl } from "$lib/api/documents";
-import { error } from "@sveltejs/kit";
-import { isErrorCode } from "@/lib/utils/api.js";
-
-export async function load({ fetch, parent }) {
-  const { document } = await parent();
-  const url = jsonUrl(document);
-
-  const resp = await fetch(url).catch(console.error);
-
-  if (!resp) {
-    error(500, "Server error");
-  }
-
-  if (isErrorCode(resp.status)) {
-    error(resp.status, resp.statusText);
-  }
-
-  const text: DocumentText = await resp.json();
-
-  return {
-    pages: text.pages,
-  };
-}