zaremate/file-hosting
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: wrap FilePreviewContainerContent in Suspense for improved loading state handling

Browse Source
This commit is contained in:
ZareMate 2025-04-16 19:05:49 +02:00
parent e1097ba1be
commit 8bc35d979d
Signed by: zaremate
GPG Key ID: 369A0E45E03A81C3
1 changed files with 12 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/app/share/page.tsx
View File

@ -1,6 +1,6 @@
"use client";
import { useEffect, useState, useRef } from "react";
import { useEffect, useState, useRef, Suspense } from "react";
import { useSearchParams, useRouter } from "next/navigation";
import toast, { Toaster } from "react-hot-toast";
import { FilePreview } from "~/app/_components/FilePreview";
@ -20,7 +20,7 @@ interface FileDetails {
description: string;
}
export default function FilePreviewContainer() {
function FilePreviewContainerContent() {
const searchParams = useSearchParams();
const router = useRouter();
const fileId = searchParams.get("id");
@ -34,7 +34,7 @@ export default function FilePreviewContainer() {
setDescription,
fileId || undefined
);
const getFileType = (extension: string): string => {
const fileTypes: Record<string, string> = {
".mp4": "video/mp4",
@ -49,7 +49,7 @@ export default function FilePreviewContainer() {
".wav": "audio/wav",
};
return fileTypes[extension] || "unknown";
}
};
useEffect(() => {
if (!fileId) {
@ -139,7 +139,6 @@ export default function FilePreviewContainer() {
</h1>
<div className="mt-6">
{fileDetails.type !== "unknown" && (
<FilePreview fileId={fileDetails.id} fileType={getFileType(fileDetails.type)} />
)}
</div>
@ -252,3 +251,11 @@ export default function FilePreviewContainer() {
);
}
export default function FilePreviewContainer() {
return (
<Suspense fallback={<div>Loading...</div>}>
<FilePreviewContainerContent />
</Suspense>
);
}