{{ define "title" -}}
    {{( pgettext "Products" "title" )}}
{{- end }}

{{ define "breadcrumbs" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.productsIndexPage*/ -}}
    <nav data-hx-boost="true" data-hx-target="main">
        <p>
            <a href="{{ companyURI "/" }}">{{( pgettext "Home" "title" )}}</a> /
            <a>{{( pgettext "Products" "title" )}}</a>
        </p>
        <p>
            <a class="primary button"
               href="{{ companyURI "/products/new" }}">{{( pgettext "New product" "action" )}}</a>
        </p>
    </nav>
{{- end }}

{{ define "content" }}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.productsIndexPage*/ -}}
    <div aria-label="{{( pgettext "Filters" "title" )}}">
        <form method="GET" action="{{ companyURI "/products"}}"
              data-hx-target="main"
              data-hx-boost="true"
              data-hx-trigger="change,search,submit"
        >
            {{ with .Filters }}
                {{ template "input-field" .Name }}
                {{ template "tags-field" .Tags | addTagsAttr (print `data-conditions="` .TagsCondition.Name  `-field"`) }}
                {{ template "toggle-field" .TagsCondition }}
            {{ end }}
            <button type="submit">{{( pgettext "Filter" "action" )}}</button>
        </form>
    </div>
    <table>
        <thead>
        <tr>
            <th>{{( pgettext "All" "product" )}}</th>
            <th>{{( pgettext "Name" "title" )}}</th>
            <th>{{( pgettext "Tags" "title" )}}</th>
            <th>{{( pgettext "Price" "title" )}}</th>
        </tr>
        </thead>
        <tbody>
        {{ with .Products }}
            {{- range $product := . }}
                <tr>
                    <td></td>
                    <td><a href="{{ companyURI "/products/"}}{{ .Slug }}" data-hx-target="main" data-hx-boost="true">{{ .Name }}</a></td>
                    <td>
                        {{- range $index, $tag := .Tags }}
                            {{- if gt $index 0 }}, {{ end -}}
                            <a href="?tags={{ . }}" data-hx-target="main" data-hx-boost="true">{{ . }}</a>
                        {{- end }}
                    </td>
                    <td class="numeric">{{ .Price | formatPrice }}</td>
                </tr>
            {{- end }}
        {{ else }}
            <tr>
                <td colspan="4">{{( gettext "No products added yet." )}}</td>
            </tr>
        {{ end }}
        </tbody>
    </table>
{{- end }}
