import React from 'react';
import { __ } from '../../../assets/javascripts/library.js';

const { events, labels } = window.solea_data;

function ListEvents() {

    if (0 === events.length) return (
        <p>{__( 'There is currently no event, where you can register for.', 'solea' )}</p>
    );

    return (
        <div>
        {events.map((solea_event, index) => (
                <table class="event_table">
                    <tr>
                        <td colSpan="2"><h3>{ solea_event.event_name }</h3></td>
                    </tr>
                    <tr>
                        <td>{__('Event date', 'solea')}:</td>
                        <td>{solea_event.date_begin} - {solea_event.date_end}</td>
                    </tr>
                    <tr>
                        <td>{__('Registration until', 'solea')}:</td>
                        <td>{solea_event.registration_end }</td>
                    </tr>

                    <tr>
                        <td colSpan="2"><a href={solea_event.event_url}>{__('Register now','solea')}</a></td>
                    </tr>
                </table>
            ))
        }
        </div>
    );
}

export default ListEvents;