Wrap Image component in Suspense

sdss · Oct 10, 2024 · e9a0030 · e9a0030
1 parent 919ee8d
commit e9a0030
Showing 1 changed file with 6 additions and 2 deletions.
diff --git a/app/file/page.tsx b/app/file/page.tsx
@@ -7,7 +7,7 @@
 
 'use client';
 
-import React from 'react';
+import React, { Suspense } from 'react';
 import { useSearchParams } from 'next/navigation';
 import { Image } from '@mantine/core';
 import getSystemFile from '@/src/actions/get-system-image';
@@ -50,7 +50,11 @@ export default function FilePath() {
   const path = params.get('path');
 
   if (type === 'image') {
-    return <ImageFile path={path} />;
+    return (
+      <Suspense fallback={<div>Loading...</div>}>
+        <ImageFile path={path} />;
+      </Suspense>
+    );
   }
 
   return null;