From 972d352f5e0ab33f6462621426aee8ae50a34ff2 Mon Sep 17 00:00:00 2001
From: Danh <nguyenhoaidanh2096@gmail.com>
Date: Tue, 5 Sep 2023 10:52:37 +0700
Subject: [PATCH] limit image extension

---
 src/components/FileInput.tsx | 4 +++-
 src/hooks/social.ts          | 4 ++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/FileInput.tsx b/src/components/FileInput.tsx
index de4bbf5afe..feb735489d 100644
--- a/src/components/FileInput.tsx
+++ b/src/components/FileInput.tsx
@@ -1,5 +1,7 @@
 import { ChangeEvent, ReactNode, useRef } from 'react'
 
+import { IMAGE_ALLOW_EXTENSIONS } from 'hooks/social'
+
 export default function FileInput({
   onChange,
   children,
@@ -41,7 +43,7 @@ export default function FileInput({
         type="file"
         onChange={handleFileChange}
         style={{ visibility: 'hidden', height: 0, width: 0 }}
-        accept={image ? 'image/*' : undefined}
+        accept={image ? IMAGE_ALLOW_EXTENSIONS.map(ext => `image/${ext}`).join(', ') : undefined}
       />
     </>
   )
diff --git a/src/hooks/social.ts b/src/hooks/social.ts
index d2f641be85..774f717af6 100644
--- a/src/hooks/social.ts
+++ b/src/hooks/social.ts
@@ -5,7 +5,7 @@ import { v4 as uuid } from 'uuid'
 
 import { BUCKET_NAME } from 'constants/env'
 
-const ALLOW_EXTENSIONS = ['jpg', 'jpeg', 'png', 'svg', 'webp', 'gif']
+export const IMAGE_ALLOW_EXTENSIONS = ['jpg', 'jpeg', 'png', 'gif']
 
 export const useUploadImageToCloud = () => {
   const [uploadImage] = useUploadImageMutation()
@@ -14,7 +14,7 @@ export const useUploadImageToCloud = () => {
     async (file: Blob | File) => {
       try {
         const ext = (file as File).name.split('.').pop() ?? ''
-        if (!ALLOW_EXTENSIONS.includes(ext)) throw new Error('File is not support')
+        if (!IMAGE_ALLOW_EXTENSIONS.includes(ext)) throw new Error('File is not support')
 
         const fileName = `${uuid() + Date.now()}.${ext}`
         const res = await uploadImage({