20 lines
935 B
TypeScript
20 lines
935 B
TypeScript
import { LineBadge } from '../atoms/LineBadge';
|
|
import { Departure } from '../../types';
|
|
import { useAlwaysOn } from '../../contexts/AlwaysOnContext';
|
|
|
|
export const DepartureItem = ({ departure }: { departure: Departure }) => {
|
|
const alwaysOn = useAlwaysOn();
|
|
const depTime = new Date(departure.scheduled);
|
|
const diffMin = Math.round((depTime.getTime() - Date.now()) / 60000);
|
|
const timeText = diffMin <= 0 ? 'Now' : `${diffMin} min`;
|
|
|
|
return (
|
|
<div className={`flex justify-between items-center py-3 border-b border-zinc-700 text-2xl ${alwaysOn ? 'font-light' : ''}`}>
|
|
<div className="flex items-center gap-4">
|
|
<LineBadge designation={departure.line.designation} mode={departure.line.transport_mode} groupOfLines={departure.line.group_of_lines} />
|
|
<span>{departure.destination}</span>
|
|
</div>
|
|
<span className={alwaysOn ? 'font-normal' : 'font-bold'}>{timeText}</span>
|
|
</div>
|
|
);
|
|
};
|