deploy

client/src/pages/admin/ui/AdminPage.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react'
+import { useRef, useState } from 'react'
 import Alert from '@mui/material/Alert'
 import Box from '@mui/material/Box'
 import Button from '@mui/material/Button'
@@ -29,9 +29,9 @@ import {
   fetchAdminProducts,
   fetchCategories,
   updateProduct,
+  uploadAdminProductImages,
 } from '@/entities/product/api/product-api'
 import type { Product } from '@/entities/product/model/types'
-import { apiClient } from '@/shared/api/client'
 import { formatPriceRub } from '@/shared/lib/format-price'
 import { getErrorMessage } from '@/shared/lib/get-error-message'
 import { invalidateQueryKeys } from '@/shared/lib/invalidate-query-keys'
@@ -228,23 +228,22 @@ export function AdminPage() {
     else createMut.mutate()
   }
 
-  const mutationError = createMut.error ?? updateMut.error ?? deleteMut.error ?? createCategoryMut.error
+  const productImagesInputRef = useRef<HTMLInputElement>(null)
 
   const uploadImagesMut = useMutation({
-    mutationFn: async (files: FileList) => {
-      const fd = new FormData()
-      Array.from(files).forEach((f) => fd.append('files', f))
-      const { data } = await apiClient.post<{ urls: string[] }>('admin/uploads', fd, {
-        headers: { 'Content-Type': 'multipart/form-data' },
-      })
-      return data.urls
-    },
+    mutationFn: (picked: File[]) => uploadAdminProductImages(picked),
     onSuccess: (urls) => {
       const current = productForm.getValues('imageUrls')
       productForm.setValue('imageUrls', [...current, ...urls], { shouldDirty: true })
+      if (productImagesInputRef.current) {
+        productImagesInputRef.current.value = ''
+      }
     },
   })
 
+  const mutationError =
+    createMut.error ?? updateMut.error ?? deleteMut.error ?? createCategoryMut.error ?? uploadImagesMut.error
+
   const removeImage = (url: string) => {
     const current = productForm.getValues('imageUrls')
     productForm.setValue(
@@ -386,6 +385,7 @@ export function AdminPage() {
                 <Button component="label" variant="outlined" disabled={uploadImagesMut.isPending}>
                   Выбрать файлы
                   <input
+                    ref={productImagesInputRef}
                     hidden
                     type="file"
                     accept="image/png,image/jpeg,image/webp"
@@ -393,8 +393,7 @@ export function AdminPage() {
                     onChange={(e) => {
                       const files = e.target.files
                       if (!files || files.length === 0) return
-                      uploadImagesMut.mutate(files)
-                      e.currentTarget.value = ''
+                      uploadImagesMut.mutate(Array.from(files))
                     }}
                   />
                 </Button>