{namespace neos=Neos\Neos\ViewHelpers}
{namespace events=Newland\Toubiz\Events\Neos\ViewHelpers}
{namespace vh=Newland\NeosViewHelpers\ViewHelpers}
{namespace common=Newland\Toubiz\Common\Neos\ViewHelpers}

<f:comment>
    <!--
        Event dates list item partial.

        This renders an event date.
    -->
</f:comment>

<li
    class="tb-event-list-item block mb-2 border border-grey-light"
    itemscope
    itemtype="http://schema.org/Event">

    <events:link.eventDate
        date="{eventDate}"
        currentNode="{targetNode}"
        class="tb-event-list-item__link no-underline text-gray-800 hover:text-gray-800 focus:text-gray-800 block sm:flex p-4 hover:bg-gray-100 focus:bg-gray-100">

        <common:slot.render slot="aboveListItem" context="{ eventDate: eventDate }" />

        <div class="tb-event-list-item__datetime-wrapper flex-none mr-6">
            <p
                class="tb-event-list-item__date inline sm:block"
                itemprop="startDate"
                content="{eventDate.beginsAt -> f:format.date(format: 'Y-m-d')}">

                <f:format.date
                    date="{eventDate.beginsAt}"
                    cldrFormat="E"
                    forceLocale="{targetNode.context.dimensions.language.0}" />

                <strong>
                    <f:format.date
                        date="{eventDate.beginsAt}"
                        format="d.m." />

                </strong>
            </p>
        </div>


        <div class="tb-event-list-item__title-wrapper flex-1">
            <common:slot.render slot="aboveTitle" context="{ eventDate: eventDate }" />
            <common:slot.render slot="aboveListItemTitle" context="{ eventDate: eventDate }" />
            <h2 class="tb-event-list-item__title mt-2 sm:mt-0 text-gray-900" itemprop="name">
                {eventDate.event.title}
            </h2>

            <f:if condition="{eventDate.event.location}">
                <f:then>
                    <p class="tb-event-list-item__subtitle mt-2" itemprop="location" itemscope itemtype="http://schema.org/Place">

                        <vh:render partial="EventDates/Time" arguments="{eventDate: eventDate, prefix: '', suffix: '|'}"/>
                        <f:if condition="{eventDate.event.location.name}">
                            <strong itemprop="name" >
                                {eventDate.event.location.name}
                            </strong>
                            |
                        </f:if>
                        <span itemprop="address" itemtype="http://schema.org/PostalAddress"
                              content="{eventDate.event.location.fullAddress}">

                            {eventDate.event.location.city}
                        </span>
                    </p>
                </f:then>
                <f:else>
                    <vh:render partial="EventDates/Time" arguments="{eventDate: eventDate, prefix: '', suffix: ''}"/>
                </f:else>
            </f:if>
            <common:slot.render slot="belowListItemTitle" context="{ eventDate: eventDate }" />
            <common:slot.render slot="belowTitle" context="{ eventDate: eventDate }" />
        </div>


        <div class="tb-event-list-item__tags flex-none mt-4 sm:mt-0 ml-0 sm:ml-2">
            <f:for each="{eventDate.event.categories}" as="category">
                <span class="tb-badge tb-event-list-item__tag">{category.title}</span>
            </f:for>
        </div>
        <common:slot.render slot="belowListItem" context="{ eventDate: eventDate }" />
    </events:link.eventDate>
</li>