Problems uploading images in a form and saving this array of images in MongoDB

i have a create productForm component in react and when i upload images, it didn´t save the image and the data on the DB, only error message,

Server.js

// Instanciando dependências
const express = require('express');
const mongoose = require('mongoose');
const bodyParser = require('body-parser');
const cors = require('cors');
const productRoutes = require('./routes/productRoutes'); 
const adminRoutes = require('./routes/AdminRoutes');

// Iniciando servidor express
const app = express();
const PORT = process.env.PORT || 3000;

// Configurando middlewares
app.use(bodyParser.json());
app.use(cors());

// Servir arquivos estáticos (imagens)
app.use('/uploads', express.static('uploads'));

// Usar as rotas
app.use('/api', productRoutes);
app.use('/api', adminRoutes);

// Conexão com MongoDB
mongoose.connect('mongodb://localhost:27017/impermaq', {
    useNewUrlParser: true,
    useUnifiedTopology: true,
});

// Verificação na conexão do MongoDB
const db = mongoose.connection;
db.on('error', console.error.bind(console, 'connection error:'));
db.once('open', () => {
    console.log('Connected to MongoDB');
});

// Inicializar servidor
app.listen(PORT, () => {
    console.log(`Server is running on port ${PORT}`);
});

ProductRoutes.js

const express = require('express');
const multer = require('multer');
const router = express.Router();
const Product = require('../models/Product');

// Configuração do multer para armazenamento de arquivos
const storage = multer.diskStorage({
    destination: function (req, file, cb) {
        // Caminho para o diretório uploads
        cb(null, path.join(__dirname, '/uploads'));
    },
    filename: function (req, file, cb) {
        cb(null, Date.now() + '-' + file.originalname);
    }
});

const upload = multer({ storage: storage });

// CREATE - Criar um novo produto
router.post('/products', upload.array('images', 5), async (req, res) => {
    try {
        const productData = req.body;
        if (req.files) {
            productData.images = req.files.map(file => `/uploads/${file.filename}`); // Salvar caminhos das imagens
        }
        const product = new Product(productData);
        await product.save();
        res.status(201).send(product);
    } catch (error) {
        console.error(error); // Log de erro para debug
        res.status(500).send({ error: 'Failed to create product', details: error.message });
    }
});


// READ - Obter todos os produtos
router.get('/products', async (req, res) => {
    try {
        const products = await Product.find({});
        res.status(200).send(products);
    } catch (error) {
        res.status(500).send(error);
    }
});

// READ - Obter um produto pelo ID
router.get('/products/:id', async (req, res) => {
    try {
        const product = await Product.findById(req.params.id);
        if (!product) {
            return res.status(404).send();
        }
        res.status(200).send(product);
    } catch (error) {
        res.status(500).send(error);
    }
});

// UPDATE - Atualizar um produto pelo ID
router.put('/products/:id', upload.single('image'), async (req, res) => {
    try {
        const productData = req.body;
        if (req.file) {
            productData.image_main = req.file.path; // Atualize o caminho da imagem principal
        }
        const updatedProduct = await Product.findByIdAndUpdate(req.params.id, productData, { new: true });
        if (!updatedProduct) {
            return res.status(404).send({ message: 'Product not found' });
        }
        res.status(200).send(updatedProduct);
    } catch (error) {
        res.status(500).send({ message: 'Failed to update product', error });
    }
});

// DELETE - Deletar um produto pelo ID
router.delete('/products/:id', async (req, res) => {
    try {
        const product = await Product.findByIdAndDelete(req.params.id);

        if (!product) {
            return res.status(404).send();
        }

        res.status(200).send(product);
    } catch (error) {
        res.status(500).send(error);
    }
});

module.exports = router;

ProductForm.jsx

import { Form, Input, Radio, Upload, Button, message } from 'antd';
import { PlusOutlined } from '@ant-design/icons';

const { TextArea } = Input;

const CreateProductForm = () => {
  const [form] = Form.useForm();

  const normFile = (e) => {
    if (Array.isArray(e)) {
      return e;
    }
    return e?.fileList;
  };

  const handleSubmit = async (values) => {
    try {
      const formData = new FormData();
      formData.append('name', values.nome);
      formData.append('description', values.descricao);
      formData.append('specifications', values.detalhes);
      formData.append('accessories', values.acessorios);
      formData.append('condition', values.condicao);

      if (values.imagens) {
        values.imagens.forEach((file) => {
          formData.append('images', file.originFileObj);
        });
      }

      const response = await fetch('http://localhost:3000/api/products', {
        method: 'POST',
        body: formData,
      });

      if (!response.ok) {
        const errorData = await response.json();
        throw new Error(errorData.details || 'Failed to create product');
      }

      message.success('Produto criado com sucesso!');
      form.resetFields();
    } catch (error) {
      message.error(error.message);
    }
  };

  return (
    <Form
      form={form}
      layout="horizontal"
      style={{ maxWidth: 600 }}
      initialValues={{
        condicao: 'Novo',
      }}
      onFinish={handleSubmit}
    >
      <Form.Item
        label="Nome"
        name="nome"
        rules={[{ required: true, message: 'Por favor, insira o nome do produto!' }]}
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="Imagens"
        name="imagens"
        valuePropName="fileList"
        getValueFromEvent={normFile}
      >
        <Upload listType="picture-card" beforeUpload={() => false} multiple>
          <button
            style={{
              border: 0,
              background: 'none',
            }}
            type="button"
          >
            <PlusOutlined />
            <div
              style={{
                marginTop: 8,
              }}
            >
              Adicionar Imagens
            </div>
          </button>
        </Upload>
      </Form.Item>

      <Form.Item label="Descrição" name="descricao">
        <TextArea rows={4} />
      </Form.Item>

      <Form.Item label="Detalhes" name="detalhes">
        <TextArea rows={4} />
      </Form.Item>

      <Form.Item label="Acessórios" name="acessorios">
        <TextArea rows={4} />
      </Form.Item>

      <Form.Item label="Condição" name="condicao">
        <Radio.Group>
          <Radio value="Novo">Novo</Radio>
          <Radio value="Usado">Usado</Radio>
        </Radio.Group>
      </Form.Item>

      <Form.Item>
        <Button type="primary" htmlType="submit">
          Criar Produto
        </Button>
      </Form.Item>
    </Form>
  );
};

export default CreateProductForm;

i created a folder called uploads to save the images but when i test it on postman, he returns this error postman log error but the way is correct, because my project is splitted in 3 folders: server, client and uploads