IIIF needs to be client only

EmoryDHLab · Aug 1, 2024 · 93ba5ec · 93ba5ec
1 parent 63f77c4
commit 93ba5ec
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/app/components/figures/FigureModal.tsx b/app/components/figures/FigureModal.tsx
@@ -18,6 +18,7 @@ import ChevronUp from "../icons/ChevronUp";
 import IIIFViewer from "./IIIFViewer.client";
 import type { TFigure } from "~/types/figureType";
 import type { ReactNode } from "react";
+import { ClientOnly } from "remix-utils/client-only";
 
 interface Props {
   figure: TFigure;
@@ -113,7 +114,9 @@ export default function FigureModal({
                     </Button>
                   </DialogTitle>
                   <div className="flex flex-col justify-between">
-                    <IIIFViewer figure={figure} />
+                    <ClientOnly>
+                      {() => <IIIFViewer figure={figure} />}
+                    </ClientOnly>
                     <Caption figure={figure} className="md:mb-2" />
                     <div className="mx-auto w-full rounded-2xl bg-white p-2">
                       <Disclosure>