diff --git a/src/components/form/FormFields.jsx b/src/components/form/FormFields.jsx index c9254da80..d79aec7d9 100644 --- a/src/components/form/FormFields.jsx +++ b/src/components/form/FormFields.jsx @@ -4,7 +4,10 @@ import Select from '@atoms/select/Base' import styles from '@style' import { memo } from 'react' import { Upload } from '@components/upload/index' -import { ALLOWED_FILETYPES_LABEL } from '@constants' +import { + ALLOWED_FILETYPES_LABEL, + ALLOWED_COVER_FILETYPES_LABEL, +} from '@constants' import { Controller } from 'react-hook-form' import classNames from 'classnames' @@ -113,6 +116,31 @@ export const FormFields = ({ value, field, error, register, control }) => { )} /> ) + + case 'cover-file': + return ( + ( + + {error && } + + )} + /> + ) + default: return (

diff --git a/src/constants.ts b/src/constants.ts index 76a0cff0e..a948edf25 100644 --- a/src/constants.ts +++ b/src/constants.ts @@ -105,7 +105,7 @@ export const ALLOWED_COVER_MIMETYPES = [ MIMETYPE.MP4, ] -export const ALLOWED_COVER_FILETYPES_LABEL = ['jpeg, png, gif'] +export const ALLOWED_COVER_FILETYPES_LABEL = 'jpeg, png, gif, mp4' export const MAX_EDITIONS = 10000 // Limited by contract export const MIN_ROYALTIES = 10 export const MAX_ROYALTIES = 25 diff --git a/src/context/mintStore.ts b/src/context/mintStore.ts index 7b8805229..5a83f296f 100644 --- a/src/context/mintStore.ts +++ b/src/context/mintStore.ts @@ -9,6 +9,8 @@ import { useModalStore } from './modalStore' import { ALLOWED_FILETYPES_LABEL, ALLOWED_MIMETYPES, + ALLOWED_COVER_FILETYPES_LABEL, + ALLOWED_COVER_MIMETYPES, METADATA_ACCESSIBILITY_HAZARDS_PHOTOSENS, METADATA_CONTENT_RATING_MATURE, MIMETYPE, @@ -128,6 +130,14 @@ export const useMintStore = create()( return } + // check cover mime type + if (cover && !ALLOWED_COVER_MIMETYPES.includes(cover.mimeType)) { + show( + `Cover file format invalid. supported formats include: ${ALLOWED_COVER_FILETYPES_LABEL.toLocaleLowerCase()}` + ) + return + } + // check file size const filesize = parseInt( (artifact.file.size / 1024 / 1024).toFixed(4) diff --git a/src/pages/mint/fields.js b/src/pages/mint/fields.js index 1a09e6972..0a216ac9d 100644 --- a/src/pages/mint/fields.js +++ b/src/pages/mint/fields.js @@ -148,7 +148,7 @@ export const fields = [ label: 'Cover Image', placeHolder: 'Upload Cover image', name: 'cover', - type: 'file', + type: 'cover-file', watch: true, enable_if: 'needsCover', rules: {