FlightCard.tsx

import { Link } from 'react-router-dom';
import { IFlight } from '../../../services/Dashboard/CustomerDashboard';
import { airportCode } from '../../../helpers/Airports';
import './FlightCard.scss';

interface IFlightCard {
  flight: IFlight;
}

function FlightCard({ flight }: IFlightCard) {
  return (
    <>
      <div className='flight-card'>
        <span>{flight.id}</span>
        <span className='flight-path'>{airportCode(flight.origin)} - {airportCode(flight.destination)}</span>
        <span>{flight.origin} - {flight.destination}</span>
        <Link to={'/flights/' + flight.id}>View Flight</Link>
      </div>
    </>
  );
}

export default FlightCard;