Store country names in ISO 3166 format in mongoDB - reactjs

Question

In my flight booking application the admin enters destination names while adding new flights. The admin can write the full country/City names (i.e. Sydney, New York etc.) But I want to save them as 3 letter abbreviation such as (SYD, NYC etc.) in the database when admin clicks the submit button. I tried using the i18n-iso-countries package but I'm not quite sure of implementing this. Is there any simple approach to this?
This is my form component:
import React, { useState } from "react";
import {
TextField,
FormControl,
InputLabel,
MenuItem,
Select,
RadioGroup,
FormControlLabel,
Radio,
Button,
} from "#mui/material";
import Autocomplete from "#mui/material/Autocomplete";
import DatePicker from "#mui/lab/DatePicker";
import AdapterDateFns from "#mui/lab/AdapterDateFns";
import LocalizationProvider from "#mui/lab/LocalizationProvider";
import SendIcon from "#mui/icons-material/Send";
import "./Form.css";
const destinations = [
{ title: "Sydney" },
{ title: "Paris" },
{ title: "Thailand" },
{ title: "France" },
{ title: "Dhaka" },
{ title: "Bangkok" },
{ title: "Indonesia" },
];
export default function Form() {
const dt = new Date().toLocaleDateString();
console.log(dt);
const [formData, setFormData] = useState({
from: "",
to: "",
depart: dt,
return: dt,
noOfPassenger: 1,
tripType: "Round Trip",
});
const defaultProps = {
options: destinations,
getOptionLabel: (option) => option.title,
};
const handleSubmit = () => {
if (formData.tripType === "One Way")
setFormData({ ...formData, return: "None" });
console.log(formData);
};
return (
<div className="form_parent">
<div className="inner_form">
<div className="from">
<Autocomplete
{...defaultProps}
onChange={(event, value) =>
setFormData({ ...formData, from: value.title })
}
renderInput={(params) => (
<TextField {...params} label="From" variant="outlined" required />
)}
/>
</div>
<div className="to">
<Autocomplete
{...defaultProps}
onChange={(event, value) =>
setFormData({ ...formData, to: value.title })
}
renderInput={(params) => (
<TextField {...params} label="To" variant="outlined" required />
)}
/>
</div>
<div className="dates">
<LocalizationProvider dateAdapter={AdapterDateFns}>
<DatePicker
label="Departure Date"
value={formData.depart}
disablePast
onChange={(e) =>
setFormData({
...formData,
depart: e.toLocaleDateString(),
})
}
renderInput={(params) => <TextField {...params} required />}
/>
</LocalizationProvider>
</div>
<div className="dates">
<LocalizationProvider dateAdapter={AdapterDateFns}>
<DatePicker
label="Return Date"
value={formData.return}
disablePast
disabled={formData.tripType === "One Way" ? true : false}
onChange={(e) =>
setFormData({
...formData,
return: e.toLocaleDateString(),
})
}
renderInput={(params) => <TextField {...params} />}
/>
</LocalizationProvider>
</div>
<div className="dates">
<FormControl className="passenger">
<InputLabel id="passengerNo">No. of Passenger</InputLabel>
<Select
variant="outlined"
labelId="passengerNo"
value={formData.noOfPassenger}
required
label="No. of Passenger"
onChange={(e) =>
setFormData({ ...formData, noOfPassenger: e.target.value })
}
>
<MenuItem value={1}>1</MenuItem>
<MenuItem value={2}>2</MenuItem>
<MenuItem value={3}>3</MenuItem>
<MenuItem value={4}>4</MenuItem>
</Select>
</FormControl>
</div>
<div className="radio_buttons">
<FormControl component="fieldset">
<RadioGroup
row
aria-label="trip"
name="row-radio-buttons-group"
value={formData.tripType}
onChange={(e) =>
setFormData({ ...formData, tripType: e.target.value })
}
>
<FormControlLabel
value="One Way"
control={<Radio />}
label="One Way"
/>
<FormControlLabel
value="Round Trip"
control={<Radio />}
label="Round Trip"
/>
</RadioGroup>
</FormControl>
</div>
<div className="submit">
<Button
className="submit_btn"
variant="contained"
color="error"
onClick={handleSubmit}
endIcon={<SendIcon />}
>
Submit
</Button>
</div>
</div>
</div>
);
}
Model
import mongoose from "mongoose";
const flightSchema = mongoose.Schema({
from: String,
to: String,
price: String,
flightType: String,
airline: String,
date: {
type: Date,
default: new Date().toLocaleDateString(),
},
});
const FlightData = mongoose.model("FlightData", flightSchema);
export default FlightData;