diff --git a/src/app/@modal/(.)paperless/document/[id]/page.tsx b/src/app/@modal/(.)paperless/document/[id]/page.tsx
deleted file mode 100644
index 3206bca..0000000
--- a/src/app/@modal/(.)paperless/document/[id]/page.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import DocumentViewer from "@/components/document-viewer";
-import { Modal } from "../../../../../components/modal";
-
-export default function ModalDocumentPage({
-  params,
-}: {
-  params: { id: number };
-}) {
-  return (
-    <Modal>
-      <DocumentViewer id={params.id} />
-    </Modal>
-  );
-}
diff --git a/src/components/audio-preview.tsx b/src/components/audio-preview.tsx
index d031476..903e67a 100644
--- a/src/components/audio-preview.tsx
+++ b/src/components/audio-preview.tsx
@@ -77,21 +77,6 @@ async function fetchWhishperRecording(searchId: string, whishperURL: string) {
   }
 }
 
-async function downloadWhishperRecording(url: string, name: string) {
-  const response = await fetch(url);
-  if (response.ok) {
-    const blob = await response.blob();
-    const recordingUrl = URL.createObjectURL(blob);
-    const link = document.createElement("a");
-    link.download = name;
-    link.href = recordingUrl;
-    link.click();
-  } else {
-    console.error("Failed to download");
-    return null;
-  }
-}
-
 async function deleteWhishperRecording(url: string) {
   const response = await fetch(url, {
     method: "DELETE",
@@ -263,6 +248,7 @@ function AudioInfo({ id }: AudioInfoProps) {
                               "An error occurred while deleting the recording.",
                           });
                         }
+                        router.back();
                       }}
                     >
                       Continue
diff --git a/src/components/document-viewer.tsx b/src/components/document-viewer.tsx
index 32cd80f..1f9d774 100644
--- a/src/components/document-viewer.tsx
+++ b/src/components/document-viewer.tsx
@@ -31,12 +31,8 @@ const queryClient = new QueryClient();
 
 async function getPaperlessDocument(
   documentId: number,
+  userData: UsersTableType,
 ): Promise<string | null> {
-  const userData = await getUserData();
-  if (!userData) {
-    console.error("Error getting user data");
-    return null;
-  }
   try {
     const url = `${userData.paperlessURL}/api/documents/${documentId}/download/`;
     const response = await fetch(url, {
@@ -135,44 +131,18 @@ async function deleteDocument(documentId: number) {
 function DocumentViewer(props: { id: number }) {
   const router = useRouter();
 
-  const [pdfUrl, setPdfUrl] = useState<string | null>(null);
-  const [loading, setLoading] = useState(true);
-  const fetchDataCalledRef = useRef(false);
-
-  useEffect(() => {
-    if (!fetchDataCalledRef.current) {
-      const fetchData = async () => {
-        setLoading(true);
-
-        try {
-          const objectUrl = await getPaperlessDocument(props.id);
-          if (objectUrl) {
-            setPdfUrl(objectUrl);
-          } else {
-            setPdfUrl(null);
-          }
-        } catch (error) {
-          console.error("An error occurred:", error);
-          setPdfUrl(null);
-        } finally {
-          setLoading(false);
-        }
-      };
-
-      fetchData().catch((error) => {
-        console.error("An error occurred:", error);
-      });
-
-      fetchDataCalledRef.current = true; // Mark as fetched
-    }
-  }, [props.id]); // Include props.id in the dependency array if refetch is needed on id change
-
   const { data: userData, isLoading: isUserDataLoading } = useQuery({
     queryKey: ["userData"],
     queryFn: fetchUserData,
   });
 
-  if (loading ?? isUserDataLoading) {
+  const { data: pdfUrl, isLoading: isPdfUrlLoading } = useQuery({
+    queryKey: ["pdfUrl", props.id, userData], // Include id and paperlessURL in the query key
+    queryFn: () => getPaperlessDocument(props.id, userData!),
+    enabled: !!userData,
+  });
+
+  if (isPdfUrlLoading ?? isUserDataLoading) {
     return <SkeletonLoader />;
   }
 
@@ -224,6 +194,7 @@ function DocumentViewer(props: { id: number }) {
               Download
               <Download />
             </a>
+            <div id="dialog-container" />
             <OpenExternalLink
               className={buttonVariants({ variant: "default" })}
               href={`${userData.paperlessURL}/documents/${props.id}/details/`}
@@ -256,9 +227,10 @@ function DocumentViewer(props: { id: number }) {
                       } else {
                         toast("Error deleting pdf", {
                           description:
-                            "An error occurred while deleting the recording.",
+                            "An error occurred while deleting the pdf.",
                         });
                       }
+                      router.back();
                     }}
                   >
                     Continue