Add create collection nfts limit

gear-foundation · Feb 28, 2024 · 904dd14 · 904dd14
1 parent 0ea42ab
commit 904dd14
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 10 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
@@ -13,7 +13,7 @@ import {
   DEFAULT_NFTS_VALUES,
   DEFAULT_PARAMETERS_VALUES,
   DEFAULT_SUMMARY_VALUES,
-  MAX_SIZE_MB,
+  MAX,
   STEPS,
 } from '../../consts';
 import { CreateCollectionReply, NFT, NFTsValues, ParametersValues, SummaryValues } from '../../types';
@@ -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));
     const chunkPromises = chunks.map((chunk) => uploadToIpfs(chunk));
     const cidChunks = await Promise.all(chunkPromises);
     const cids = cidChunks.flat();

diff --git a/frontend/src/features/create-simple-collection/components/nft-form/nft-form.tsx b/frontend/src/features/create-simple-collection/components/nft-form/nft-form.tsx
@@ -8,7 +8,7 @@ import { z } from 'zod';
 import { Balance, Container } from '@/components';
 import { useMarketplace } from '@/context';
 
-import { IMAGE_TYPES, MAX_SIZE_MB } from '../../consts';
+import { IMAGE_TYPES, MAX } from '../../consts';
 import { NFTsValues } from '../../types';
 import { getBytes, getFileUrl } from '../../utils';
 import { NFT } from '../nft';
@@ -45,10 +45,13 @@ function NFTForm({ defaultValues, isLoading, onSubmit, onBack }: Props) {
   const handleInputChange = ({ target }: ChangeEvent<HTMLInputElement>) => {
     const files = [...(target.files || [])];
 
+    const potentialNftsCount = nftsCount + files.length;
+    if (potentialNftsCount > MAX.NFTS_COUNT) return alert.error(`Maximum number of NFTs is ${MAX.NFTS_COUNT}`);
+
     files.forEach((file) => {
       const { type, size, name } = file;
 
-      const isValid = size <= getBytes(MAX_SIZE_MB.IMAGE) && IMAGE_TYPES.includes(type);
+      const isValid = size <= getBytes(MAX.SIZE_MB.IMAGE) && IMAGE_TYPES.includes(type);
       if (!isValid) return alert.error(`${name} - max size is exceeded or wrong format`);
 
       const limit = '';

diff --git a/frontend/src/features/create-simple-collection/consts.ts b/frontend/src/features/create-simple-collection/consts.ts
@@ -38,9 +38,13 @@ const DEFAULT_NFTS_VALUES: NFTsValues = {
 const IMAGE_TYPES = ['image/svg+xml', 'image/png', 'image/jpeg'];
 const IMAGE_TYPES_ACCEPT = IMAGE_TYPES.join(', ');
 
-const MAX_SIZE_MB = {
-  IMAGE: 5,
-  NFTS_CHUNK: 50,
+const MAX = {
+  NFTS_COUNT: 10000,
+
+  SIZE_MB: {
+    IMAGE: 5,
+    NFTS_CHUNK: 50,
+  },
 };
 
 export {
@@ -51,5 +55,5 @@ export {
   DEFAULT_NFTS_VALUES,
   IMAGE_TYPES,
   IMAGE_TYPES_ACCEPT,
-  MAX_SIZE_MB,
+  MAX,
 };
diff --git a/frontend/src/features/create-simple-collection/hooks.ts b/frontend/src/features/create-simple-collection/hooks.ts
@@ -1,7 +1,7 @@
 import { useAlert } from '@gear-js/react-hooks';
 import { useRef, useState, ChangeEvent } from 'react';
 
-import { MAX_SIZE_MB } from './consts';
+import { MAX } from './consts';
 import { getBytes } from './utils';
 
 function useImageInput(defaultValue: File | undefined, types: string[]) {
@@ -24,7 +24,7 @@ function useImageInput(defaultValue: File | undefined, types: string[]) {
     const [file] = files;
     const { size, type } = file;
 
-    if (size > getBytes(MAX_SIZE_MB.IMAGE)) {
+    if (size > getBytes(MAX.SIZE_MB.IMAGE)) {
       target.value = '';
       return alert.error('Max file size is exceeded');
     }