Fix large collections upload (#26)

* Add chunk length limit (#25) * Fix create collection loading on zero cooldown
gear-foundation · Mar 4, 2024 · b11996f · b11996f
1 parent 210bcfa
commit b11996f
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 4 deletions.
diff --git a/...e-collection/components/create-simple-collection-modal/create-simple-collection-modal.tsx b/...e-collection/components/create-simple-collection-modal/create-simple-collection-modal.tsx
@@ -52,7 +52,7 @@ function CreateSimpleCollectionModal({ close }: Pick<ModalProps, 'close'>) {
 
   const getNftsPayload = async (nfts: NFT[]) => {
     const images = nfts.map(({ file }) => file);
-    const chunks = getFileChunks(images, getBytes(MAX.SIZE_MB.NFTS_CHUNK));
+    const chunks = getFileChunks(images, getBytes(MAX.SIZE_MB.NFTS_CHUNK), MAX.FILES_PER_CHUNK);
     const urls: string[] = [];
 
     for (const chunk of chunks) {

diff --git a/frontend/src/features/create-simple-collection/consts.ts b/frontend/src/features/create-simple-collection/consts.ts
@@ -40,6 +40,7 @@ const IMAGE_TYPES_ACCEPT = IMAGE_TYPES.join(', ');
 
 const MAX = {
   NFTS_COUNT: 10000,
+  FILES_PER_CHUNK: 50,
 
   SIZE_MB: {
     IMAGE: 5,

diff --git a/frontend/src/features/create-simple-collection/utils.ts b/frontend/src/features/create-simple-collection/utils.ts
@@ -9,15 +9,15 @@ function getBytes(mb: number) {
 
 const getFileUrl = (file: File) => URL.createObjectURL(file);
 
-const getFileChunks = (files: File[], chunkSizeBytes: number) => {
+const getFileChunks = (files: File[], chunkSizeBytes: number, maxFilesPerChunk: number) => {
   const chunks: File[][] = [];
   let chunk: File[] = [];
   let chunkSize = 0;
 
   files.forEach((file) => {
     const potentialChunkSize = chunkSize + file.size;
 
-    if (potentialChunkSize > chunkSizeBytes) {
+    if (chunk.length === maxFilesPerChunk || potentialChunkSize > chunkSizeBytes) {
       chunks.push(chunk);
       chunk = [];
       chunkSize = 0;

diff --git a/frontend/src/pages/create-collection/hooks.ts b/frontend/src/pages/create-collection/hooks.ts
@@ -28,8 +28,8 @@ function useLastCollection() {
 function useCreateCountdown() {
   const { marketplace } = useMarketplace();
   const { config, admins } = marketplace || {};
+  const isConfigReady = Boolean(config);
   const msBetweenCollections = Number(config?.timeBetweenCreateCollections || '0');
-  const isConfigReady = Boolean(msBetweenCollections);
 
   const { account } = useAccount();
   const isAdmin = admins?.includes(account?.decodedAddress || '');