Add chunked upload for large files

Frontend/src/Api.js

@@ -175,6 +175,63 @@ export async function UploadFiles(RootName, RelativePath, Files) {
   return ParseJsonOrThrow(Response);
 }
 
+const UploadChunkSizeBytes = 20 * 1024 * 1024;
+export const ChunkedUploadThresholdBytes = 40 * 1024 * 1024;
+
+export function IsLargeUpload(File) {
+  return File.size > ChunkedUploadThresholdBytes;
+}
+
+function GenerateUploadId() {
+  if (window.crypto && window.crypto.randomUUID) {
+    return window.crypto.randomUUID();
+  }
+  return `${Date.now()}-${Math.random().toString(16).slice(2)}`;
+}
+
+async function UploadFileChunk(RootName, RelativePath, UploadId, ChunkIndex, TotalChunks, FileName, ChunkBlob) {
+  const Form = new FormData();
+  Form.append("Chunk", ChunkBlob, "chunk");
+  const Params = new URLSearchParams({
+    Root: RootName,
+    Path: RelativePath,
+    UploadId,
+    ChunkIndex: String(ChunkIndex),
+    TotalChunks: String(TotalChunks),
+    FileName,
+  });
+  const Response = await fetch(`${ApiBase}/upload/chunk?${Params}`, {
+    method: "POST",
+    credentials: "same-origin",
+    body: Form,
+  });
+  return ParseJsonOrThrow(Response);
+}
+
+function CompleteChunkedUpload(RootName, RelativePath, UploadId, TotalChunks, FileName) {
+  const Params = new URLSearchParams({
+    Root: RootName,
+    Path: RelativePath,
+    UploadId,
+    TotalChunks: String(TotalChunks),
+    FileName,
+  });
+  return FetchJson(`/upload/complete?${Params}`, { method: "POST" });
+}
+
+export async function UploadFileChunked(RootName, RelativePath, File) {
+  const UploadId = GenerateUploadId();
+  const TotalChunks = Math.max(1, Math.ceil(File.size / UploadChunkSizeBytes));
+
+  for (let ChunkIndex = 0; ChunkIndex < TotalChunks; ChunkIndex++) {
+    const Start = ChunkIndex * UploadChunkSizeBytes;
+    const ChunkBlob = File.slice(Start, Start + UploadChunkSizeBytes);
+    await UploadFileChunk(RootName, RelativePath, UploadId, ChunkIndex, TotalChunks, File.name, ChunkBlob);
+  }
+
+  return CompleteChunkedUpload(RootName, RelativePath, UploadId, TotalChunks, File.name);
+}
+
 export function SaveFile(RootName, RelativePath, Content) {
   const Params = new URLSearchParams({ Root: RootName, Path: RelativePath });
   return FetchJson(`/file?${Params}`, { method: "PUT", body: Content });