import React from 'react';
import { TicketType } from 'common/types';

interface SummaryListProps {
  tickets: TicketType[];
}

export const SummaryList: React.FC<SummaryListProps> = ({ tickets }) => {
  return (
    <div>
      <ul
        style={{
          width: 400,
          listStyle: 'none',
          margin: '10px 0',
          padding: 0,
          fontSize: 20,
        }}
      >
        {tickets.map(({ label, price }, index) => (
          <li
            key={`${label}-${index}`}
            style={{
              padding: '8px 4px',
              display: 'flex',
              justifyContent: 'space-between',
            }}
          >
            <span>{label}</span>
            <span>{price} Kč</span>
          </li>
        ))}
      </ul>
    </div>
  );
};
