From 01486fc4fd5fa38d99840b69b90e986da3870352 Mon Sep 17 00:00:00 2001
From: Aamir Azad <aamirmazad@gmail.com>
Date: Thu, 25 Jul 2024 18:29:00 -0400
Subject: [PATCH] its good enough

---
 .vscode/settings.json               |  3 ++-
 src/components/audio-preview.tsx    |  4 ++--
 src/components/document-details.tsx | 22 +++++++++-------------
 src/components/document-modal.tsx   |  2 +-
 src/components/document-preview.tsx |  6 ++++--
 5 files changed, 18 insertions(+), 19 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 25a6a14..e3c099b 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -3,5 +3,6 @@
   "editor.defaultFormatter": "esbenp.prettier-vscode",
   "editor.formatOnPaste": true,
   "editor.formatOnSave": true,
-  "editor.tabSize": 2
+  "editor.tabSize": 2,
+  "typescript.preferences.importModuleSpecifier": "non-relative"
 }
diff --git a/src/components/audio-preview.tsx b/src/components/audio-preview.tsx
index 1553ede..b305cdf 100644
--- a/src/components/audio-preview.tsx
+++ b/src/components/audio-preview.tsx
@@ -10,7 +10,7 @@ import { Button, buttonVariants } from "@/components/ui/button";
 import { useRouter } from "next/navigation";
 import { ChevronLeft } from "lucide-react";
 import { useState } from "react";
-import OpenExternalLink from "./external-link";
+import OpenExternalLink from "@/components/external-link";
 import type { WhishperRecordingType } from "@/types";
 import {
   AlertDialog,
@@ -30,7 +30,7 @@ import {
   TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { toast } from "sonner";
-import BodyMessage from "./body-message";
+import BodyMessage from "@/components/body-message";
 
 const queryClient = new QueryClient();
 
diff --git a/src/components/document-details.tsx b/src/components/document-details.tsx
index 37e798b..99e7f08 100644
--- a/src/components/document-details.tsx
+++ b/src/components/document-details.tsx
@@ -14,7 +14,7 @@ import {
 } from "@/components/ui/alert-dialog";
 import { toast } from "sonner";
 import { getUserData } from "@/app/actions";
-import { Button, buttonVariants } from "./ui/button";
+import { Button, buttonVariants } from "@/components/ui/button";
 import { useRouter } from "next/navigation";
 import {
   useQuery,
@@ -26,8 +26,7 @@ import LoadingSpinner from "./loading-spinner";
 import OpenExternalLink from "./external-link";
 import type { PaperlessDocumentType } from "@/types";
 import React from "react";
-import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
-import BodyMessage from "./body-message";
+import BodyMessage from "@/components/body-message";
 
 const queryClient = new QueryClient();
 
@@ -150,17 +149,16 @@ function DocumentDetailsInner(props: { id: number }) {
   return (
     <div className="flex h-full w-full min-w-0 justify-center">
       <div className="flex h-4/5 flex-col rounded-xl bg-slate-600/50 md:w-1/2">
-        <div className="m-4 flex flex-grow flex-col justify-center gap-8 md:m-8 md:flex-row md:gap-16">
-          <div>
-            {documentData?.title}
+        <div className="m-4 flex flex-grow flex-col justify-center gap-8 md:flex-row md:gap-16">
+          <div className="w-full">
+            <h1 className="mb-2 text-xl font-bold">{documentData?.title}</h1>
             <object
               data={pdfUrl}
               type="application/pdf"
-              width="100%"
-              height="100%"
+              className="w-full h-full"
             />
           </div>
-          <div className="flex flex-col gap-8">
+          <div className="flex w-36 flex-col gap-8">
             <Button
               onClick={(e) => {
                 e.preventDefault();
@@ -169,11 +167,10 @@ function DocumentDetailsInner(props: { id: number }) {
             >
               Back
             </Button>
-            <a>
+            {/* <a className={buttonVariants({ variant: "default" })}>
               Download
               <Download />
-            </a>
-            <div id="dialog-container" />
+            </a> */}
             <OpenExternalLink
               className={buttonVariants({ variant: "default" })}
               href={`${userData.paperlessURL}/documents/${props.id}/details/`}
@@ -228,7 +225,6 @@ export default function DocumentDetails(props: { id: number }) {
   return (
     <QueryClientProvider client={queryClient}>
       <DocumentDetailsInner {...props} />
-      <ReactQueryDevtools initialIsOpen={false} />
     </QueryClientProvider>
   );
 }
diff --git a/src/components/document-modal.tsx b/src/components/document-modal.tsx
index 8c7acb9..6215b79 100644
--- a/src/components/document-modal.tsx
+++ b/src/components/document-modal.tsx
@@ -9,7 +9,7 @@ export default function ModalDocumentPage({
   return (
     <Modal>
       <div className="flex h-full w-full min-w-0 justify-center">
-        <div className="flex h-4/5 flex-col rounded-xl bg-slate-600/50 md:w-1/2">
+        <div className="flex h-full flex-col rounded-xl bg-slate-600/50 md:w-1/2">
           <div className="m-4 flex flex-grow flex-col justify-center gap-8 md:m-8 md:flex-row md:gap-16">
             <DocumentPreview id={params.id} />
           </div>
diff --git a/src/components/document-preview.tsx b/src/components/document-preview.tsx
index 3e1d605..b5d70a2 100644
--- a/src/components/document-preview.tsx
+++ b/src/components/document-preview.tsx
@@ -97,11 +97,13 @@ function Preview(props: { id: number }) {
 
   if (isPdfUrlLoading ?? isUserDataLoading) {
     return <SkeletonLoader />;
-  } else if (!pdfUrl || !userData) {
+  }
+  
+  if (!pdfUrl || !userData) {
     return <BodyMessage>Failed to get document</BodyMessage>;
   }
 
-  return <img src={pdfUrl} alt="Document Preview" className="h-full" />;
+  return <img src={pdfUrl} alt="Document Preview"/>;
 }
 
 export default function DocumentPreview(props: { id: number }) {