Uploading video files and subtitle files to MongoDB

// backend/server.ts
import express, { Application, Request, Response } from 'express';
import mongoose from 'mongoose';
import cors from 'cors';
import dotenv from 'dotenv';
const multer  = require('multer')
const upload = multer({ dest: 'uploads/' })
const { mongoDBURL } = require('./config');

dotenv.config();

const app: Application = express();

// Middleware
app.use(cors());
app.use(express.json());

// Database connection
const MONGODB_URI = mongoDBURL;

mongoose.connect(MONGODB_URI)
.then(() => console.log("MongoDB connection established"))
.catch(error => console.error("MongoDB connection failed:", error.message));

// Routes
app.get('/', (req: Request, res: Response) => {
  res.send('Hello from Express + TypeScript Server');
});

// Start server
const PORT: number | string = process.env.PORT || 5001;
app.listen(PORT, () => {
  console.log(`Server is running on port: ${PORT}`);
});

app.post('/upload', upload.fields([{ name: 'video', maxCount: 1 }, { name: 'subtitle', maxCount: 1 }]), (req: Request, res: Response) => {
  const files = (req as any).files; // Use type assertion here
  if (files) {
    res.send({ message: 'Files uploaded successfully.', files: files });
  } else {
    res.status(400).send({ message: 'File upload failed.' });
  }
});

I am attempting to upload 1 video file and 1 subtitle file at the same time to my mongo database. I am very new to this so I am sorry if my code is gross. When I try and upload the files I get a console message saying it was successful and shows me some of the data.

const UploadComic: React.FC = () => {
  // State to store the uploaded files
  const [videoFile, setVideoFile] = useState<File | null>(null);
  const [subtitleFile, setSubtitleFile] = useState<File | null>(null);

  // Handlers for file selection
  const handleVideoFileSelect = (file: File | null) => {
    setVideoFile(file);
  };

  const handleSubtitleFileSelect = (file: File | null) => {
    setSubtitleFile(file);
  };

  // Inside your component
  const handleAddToLibrary = () => {
    if (!videoFile || !subtitleFile) {
      alert('Missing files');
      return;
    }
  
    const formData = new FormData();
    formData.append('video', videoFile); // Assuming 'video' is the field name expected by the server
    formData.append('subtitle', subtitleFile); // Assuming 'subtitle' is the field name expected by the server
  
    axios.post('http://localhost:5001/upload', formData, {
      headers: {
        'Content-Type': 'multipart/form-data',
      },
    })
    .then((response) => {
      console.log('Files uploaded successfully1', response.data);
      // Handle success
    })
    .catch((error) => {
      console.error('Error uploading files', error);
      // Handle error
    });
  };

Im not sure what im doing wrong but it will not upload to mongodb, It did one time but I could not replicate what happened. If you have any suggestions or even if my code is bad that would be helpfup too, it is important to note i have asked chatgpt for help so any random code could be caused by that.

I have tried a couple different ways but I was expecting it to upload or to throw an error but neither happened.