54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import { Event, TripDataEntry } from '@/types';
|
|
import TrainSection from './TrainSection';
|
|
import BikeSection from './BikeSection';
|
|
import LeaveByBadge from './LeaveByBadge';
|
|
import { calculateCountdown } from '@/lib/countdown-utils';
|
|
|
|
type EventCardProps = {
|
|
event: Event;
|
|
tripData: TripDataEntry;
|
|
className?: string;
|
|
};
|
|
|
|
const EventCard: React.FC<EventCardProps> = ({
|
|
event,
|
|
tripData,
|
|
className = '',
|
|
}) => {
|
|
return (
|
|
<div className={
|
|
`bg-white dark:bg-gray-800 rounded-lg shadow-sm overflow-hidden ${className}`
|
|
}>
|
|
<div className="p-4 border-b border-gray-200 dark:border-gray-700">
|
|
<div className="flex items-start justify-between">
|
|
<div className="flex-1">
|
|
<h3 className="font-semibold text-gray-900 dark:text-white">{event.title}</h3>
|
|
<p className="text-sm text-gray-600 dark:text-gray-300">{event.destination}</p>
|
|
</div>
|
|
<div className="ml-4 flex items-center">
|
|
<LeaveByBadge countdown={calculateCountdown(event.eventTime)} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="p-4">
|
|
<TrainSection
|
|
journeys={tripData.journeys}
|
|
eventTime={event.eventTime}
|
|
destName={event.destination}
|
|
loading={tripData.loading}
|
|
/>
|
|
<BikeSection
|
|
bikeRoute={tripData.bikeRoute}
|
|
bikeLoading={tripData.bikeLoading || false}
|
|
bikeError={tripData.bikeError}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default EventCard;
|