{namespace neos=Neos\Neos\ViewHelpers}
{namespace toubiz=Newland\Toubiz\Events\Neos\ViewHelpers}

<li class="tb-event-list-item">
    <div class="tb-event-list-item__time-wrapper">
        <p class="tb-event-list-item__date">
            <f:format.date date="{toubiz:context.eventDate(event: event, currentDate: currentDate)}"
                           cldrFormat="E"
                           forceLocale="{targetNode.context.dimensions.language.0}"
            />

            <strong>
                <f:format.date date="{toubiz:context.eventDate(event: event, currentDate: currentDate)}"
                               format="d.m."
                />
            </strong>
        </p>
        <f:if condition="{event.beginsAtSpecificTime}">
            <span class="tb-event-list-item__time">
                {event.beginsAt -> f:format.date(format: 'H:i')}
                {f:translate(id: 'views._shared.word.clock', package: 'Newland.Toubiz.Events.Neos')}
            </span>
        </f:if>
    </div>
    <div class="tb-event-list-item__content">
        <header class="tb-event-list-item__header"
                aria-haspopup="true"
                aria-expanded="false"
                data-target-enhancement
                data-target-enhancement-target="#tb-event-list-item-{index}"
                data-target-enhancement-exclusive-group="event-list-group"
                data-aria-target-enhancement>
            <div class="tb-event-list-item__title-wrapper">
                <h2 class="tb-event-list-item__title">
                    {event.title}
                </h2>
                <p class="tb-event-list-item__subtitle">
                    <strong>{event.location.name}</strong> | {event.location.city}
                </p>
            </div>
            <div class="tb-event-list-item__tags">
                <f:for each="{event.categories}" as="category">
                    <span class="c-tag">{category.title}</span>
                </f:for>
            </div>
        </header>
        <div class="tb-event-list-item__body" id="tb-event-list-item-{index}">
            <div class="tb-event-list-item__details">
                <div class="tb-event-list-item__description">
                    <p>
                        {event.description -> toubiz:format.crop()}
                    </p>
                    <p>
                        <f:render partial="Events/Address" arguments="{address: event.location}" />
                    </p>
                    <p>
                        <f:render partial="Events/UpcomingEventDates" arguments="{event: event, node: targetNode}" />
                    </p>
                </div>
                <div class="tb-event-list-item__actions">
                    <neos:link.node node="{targetNode}"
                                    arguments="{
                                        --newland_toubiz_events_neos-full: {
                                            '@package': 'newland.toubiz.events.neos',
                                            '@controller': 'events',
                                            '@action': 'show',
                                            event: event
                                        }
                                    }"
                                    class="c-button">
                        {f:translate(id: 'views.events._listItem.detailLinkLabel', package: 'Newland.Toubiz.Events.Neos')}
                    </neos:link.node>
                </div>
            </div>
            <f:if condition="{event.media.0.sourceUri}">
                <div class="tb-event-list-item__cover">
                    <img src="{event.media.0.sourceUri}"
                         title="{event.media.0.title}"
                         alt="{event.media.0.title}"
                    />
                </div>
            </f:if>
        </div>
    </div>
</li>