<!--
 SPDX-FileCopyrightText: 2023 jordi fita mas <jordi@tandem.blog>
 SPDX-License-Identifier: AGPL-3.0-only
-->
{{ define "title" -}}
    {{( pgettext "Services Page" "title" )}}
{{- end }}

{{ define "content" -}}
    {{- /*gotype: dev.tandem.ws/tandem/camper/pkg/services.servicesIndex*/ -}}
    <h2>{{( pgettext "Carousel" "title" )}}</h2>
    <a href="/admin/services/slides/new">{{( pgettext "Add slide" "action" )}}</a>
    {{ if .Slides -}}
        <table>
            <thead>
            <tr>
                <th scope="col">{{( pgettext "Image" "header" )}}</th>
                <th scope="col">{{( pgettext "Caption" "header" )}}</th>
                <th scope="col">{{( pgettext "Translations" "campsite type" )}}</th>
                <th scope="col">{{( pgettext "Actions" "campsite type" )}}</th>
            </tr>
            </thead>
            <tbody>
            {{ $confirm := ( gettext "Are you sure you wish to delete this slide?" )}}
            {{ range $slide := .Slides -}}
                <tr>
                    <td><a href="/admin/services/slides/{{ .ID }}"><img src="{{ .Media }}" alt=""></a></td>
                    <td><a href="/admin/services/slides/{{ .ID }}">{{ .Caption }}</a></td>
                    <td>
                        {{ range .Translations }}
                            <a
                                    {{ if .Missing }}
                                        class="missing-translation"
                                    {{ end }}
                                    href="/admin/services/slides/{{ $slide.ID }}/{{ .Language }}">{{ .Endonym }}</a>
                        {{ end }}
                    </td>
                    <td>
                        <form data-hx-delete="/admin/services/slides/{{ .ID }}"
                              data-hx-confirm="{{ $confirm }}"
                              data-hx-headers='{ {{ CSRFHeader }} }'>
                            <button type="submit">{{( pgettext "Delete" "action" )}}</button>
                        </form>
                    </td>
                </tr>
            {{- end }}
            </tbody>
        </table>
    {{ else -}}
        <p>{{( gettext "No slides added yet." )}}</p>
    {{- end }}

    <h2>{{( pgettext "Services" "title" )}}</h2>
    <a href="/admin/services/new">{{( pgettext "Add service" "action" )}}</a>
    {{ if .Services -}}
        <table class="services">
            <thead>
            <tr>
                <th scope="col">{{( pgettext "Service" "header" )}}</th>
                <th scope="col">{{( pgettext "Translations" "campsite type" )}}</th>
                <th scope="col">{{( pgettext "Actions" "campsite type" )}}</th>
            </tr>
            </thead>
            <tbody>
            {{ $confirm := ( gettext "Are you sure you wish to delete this service?" )}}
            {{ range .Services -}}
                <tr>
                    <td class="icon_{{ .Icon }}"><a href="{{ .URL }}">{{ .Name }}</a></td>
                    <td>
                        {{ range .Translations }}
                            <a
                                    {{ if .Missing }}class="missing-translation"{{ end }}
                                    href="{{ .URL }}">{{ .Endonym }}</a>
                        {{ end }}
                    </td>
                    <td>
                        <form data-hx-delete="{{ .URL }}"
                              data-hx-confirm="{{ $confirm }}"
                              data-hx-headers='{ {{ CSRFHeader }} }'>
                            <button type="submit">{{( pgettext "Delete" "action" )}}</button>
                        </form>
                    </td>
                </tr>
            {{- end }}
            </tbody>
        </table>
    {{ else -}}
        <p>{{( gettext "No services added yet." )}}</p>
    {{- end }}
{{- end }}