Swagger UI doesn’t show Choose a File button

So i am trying to create a nodejs application with an endpoint that uploads file , but seems anything I research on, and using chatGPT , it won’t show any CHOOSE A FILE BUTTON but rather just a input textbox.

Code sample below that i have tried, but it shows no button in swagger.
http://localhost:3000/api-docs/

const express = require('express');
const multer = require('multer');
const swaggerJsdoc = require('swagger-jsdoc');
const swaggerUi = require('swagger-ui-express');

const app = express();
const port = process.env.PORT || 3000;

// Set up Multer for handling file uploads
const storage = multer.memoryStorage();
const upload = multer({ storage: storage });

// Swagger configuration
const swaggerOptions = {
  definition: {
    openapi: '3.0.0',
    info: {
      title: 'File Upload API',
      version: '1.0.0',
    },
  },
  apis: ['./server.js'], // Specify the file where your routes are defined
};

const swaggerSpec = swaggerJsdoc(swaggerOptions);

app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerSpec));

/**
 * @swagger
 * /upload:
 *   post:
 *     summary: Upload a file
 *     consumes:
 *       - multipart/form-data
 *     parameters:
 *       - in: formData
 *         name: file
 *         type: file
 *         required: true
 *         description: The file to upload
 *     responses:
 *       200:
 *         description: File uploaded successfully
 */
app.post('/upload', upload.single('file'), (req, res) => {
  const file = req.file;
  if (!file) {
    return res.status(400).json({ message: 'No file uploaded' });
  }

  // Process the file (you can save it, manipulate it, etc.)
  // For now, we'll just return some information about the uploaded file
  res.json({
    message: 'File uploaded successfully',
    originalname: file.originalname,
    mimetype: file.mimetype,
    size: file.size,
  });
});

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