{{- $entries := index . 0 -}}
{{- $contents := index . 1 -}}
{{- $entryTypes := index . 2 -}}
{{- $contentTypes := index . 3 -}}
{{- $contentEntries := index . 4 -}}
{{- $entryControls := index . 5 -}}
{{- $csrfToken := index . 6 -}}

<tab-list
	data-default-index="{{ if gt (len $entries) 0 }}0{{ else if $contents }}{{ if gt (len $contents) 0 }}1{{ end }}{{ end }}"
	data-disabled-indices="{{ if and (eq (len $entries) 0) (or (not $contents) (eq (len $contents) 0)) }}0,1{{ else if eq (len $entries) 0 }}0{{ else if or (not $contents) (eq (len $contents) 0) }}1{{ end }}">
	<div class="flex items-center gap-3 text-sm font-bold text-gray-700">
		<div class="tab-list-head flex items-center gap-2">
			<i class="ri-book-2-line"></i>
			<span>Verknüpfte Bände</span>
			<span class="text-xs bg-stone-200 text-gray-800 px-2 py-0.5 rounded-sm">{{ len $entries }}</span>
		</div>
		{{- if $contents -}}
		<div class="tab-list-head flex items-center gap-2">
			<i class="ri-article-line"></i>
			<span>Verknüpfte Beiträge</span>
			<span class="text-xs bg-stone-200 text-gray-800 px-2 py-0.5 rounded-sm">{{ len $contents }}</span>
		</div>
		{{- end -}}
	</div>
	<hr class="border-slate-400 mt-2 mb-3" />
	<div class="tab-list-panel text-sm text-gray-800 max-h-96 overflow-auto pr-1 pl-0 ml-0">
		{{- if $entries -}}
			<ul class="flex flex-col pl-0 pr-0 m-0 ml-0 list-none">
				{{- range $entry := $entries -}}
					{{- $types := "" -}}
					{{- if $entryTypes -}}
						{{- $types = index $entryTypes $entry.Id -}}
					{{- end -}}
					<li class="flex items-baseline justify-between gap-3 ml-0 p-1 odd:bg-stone-100">
						<div class="flex flex-col gap-1">
							<a href="/almanach/{{ $entry.MusenalmID }}" class="font-bold no-underline hover:text-slate-900">
								{{- $entry.PreferredTitle -}}
							</a>
							{{- if $types -}}
								<div class="text-xs text-gray-800">
									{{- range $i, $t := $types -}}
										{{- if $i }}, {{ end -}}{{ $t -}}
									{{- end -}}
								</div>
							{{- end -}}
						</div>
						<span class="flex items-center gap-2 text-xs text-gray-600 whitespace-nowrap">
							<span class="text-slate-700 font-semibold">Alm {{ $entry.MusenalmID }}</span>
							{{- if and $entryControls $csrfToken -}}
								<tool-tip position="top" class="inline">
									<a
										href="/almanach/{{ $entry.MusenalmID }}/edit"
										class="no-underline inline-flex items-center text-slate-600 hover:text-slate-900"
										aria-label="Bearbeiten">
										<i class="ri-edit-line"></i>
									</a>
									<div class="data-tip">Bearbeiten</div>
								</tool-tip>
								<tool-tip position="top" class="inline">
									<a
										href="/almanach/{{ $entry.MusenalmID }}/contents/edit"
										class="no-underline inline-flex items-center text-slate-600 hover:text-slate-900"
										aria-label="Beiträge bearbeiten">
										<i class="ri-file-list-3-line"></i>
									</a>
									<div class="data-tip">Beiträge bearbeiten</div>
								</tool-tip>
								<tool-tip position="top" class="inline">
									<button
										type="button"
										data-role="baende-delete"
										data-entry-id="{{ $entry.MusenalmID }}"
										data-entry-title="{{- if $entry.PreferredTitle -}}{{ $entry.PreferredTitle }}{{- else if ne $entry.Year 0 -}}{{ $entry.Year }}{{- else -}}[o.J.]{{- end -}}"
										data-delete-endpoint="/almanach/{{ $entry.MusenalmID }}/edit/delete"
										class="inline-flex items-center text-red-700 hover:text-red-900"
										aria-label="Löschen">
										<i class="ri-delete-bin-line"></i>
									</button>
									<div class="data-tip">Löschen</div>
								</tool-tip>
							{{- end -}}
						</span>
					</li>
				{{- end -}}
			</ul>
		{{- else -}}
			<div class="italic text-gray-500">Keine Bände verknüpft.</div>
		{{- end -}}
	</div>
	{{- if $contents -}}
	<div class="tab-list-panel text-sm text-gray-800 max-h-96 overflow-auto pr-1 pl-0 ml-0 self-stretch">
		{{- if $contents -}}
			<ul class="flex flex-col pl-0 pr-0 m-0 ml-0 list-none">
				{{- range $content := $contents -}}
					{{- $entry := "" -}}
					{{- if $contentEntries -}}
						{{- $entry = index $contentEntries $content.Entry -}}
					{{- end -}}
					{{- $types := "" -}}
					{{- if $contentTypes -}}
						{{- $types = index $contentTypes $content.Id -}}
					{{- end -}}
					<li class="flex flex-col gap-1 ml-0 p-1 odd:bg-stone-100 px-1">
						<div class="flex items-baseline justify-between gap-3">
							<a href="/beitrag/{{ $content.MusenalmID }}" class="no-underline hover:text-slate-900 font-semibold">
								{{- if $content.PreferredTitle -}}{{ $content.PreferredTitle }}{{- else -}}Inhalt #{{ $content.MusenalmID }}{{- end -}}
							</a>
							{{- if and $entryControls $csrfToken $entry -}}
								<span class="flex items-center gap-2 text-xs text-gray-500 whitespace-nowrap">
									<tool-tip position="top" class="inline">
										<a
											href="/almanach/{{ $entry.MusenalmID }}/contents/{{ $content.MusenalmID }}/edit/"
											class="no-underline inline-flex items-center text-slate-600 hover:text-slate-900"
											aria-label="Beitrag bearbeiten">
											<i class="ri-edit-line"></i>
										</a>
										<div class="data-tip">Bearbeiten</div>
									</tool-tip>
									<tool-tip position="top" class="inline">
										<button
											type="button"
											data-role="content-delete"
											data-entry-id="{{ $entry.MusenalmID }}"
											data-content-id="{{ $content.MusenalmID }}"
											data-content-title="{{- if $content.PreferredTitle -}}{{ $content.PreferredTitle }}{{- else -}}Inhalt #{{ $content.MusenalmID }}{{- end -}}"
											data-delete-endpoint="/almanach/{{ $entry.MusenalmID }}/contents/delete"
											class="inline-flex items-center text-red-700 hover:text-red-900"
											aria-label="Beitrag löschen">
											<i class="ri-delete-bin-line"></i>
										</button>
										<div class="data-tip">Löschen</div>
									</tool-tip>
								</span>
							{{- end -}}
						</div>
						<div class="text-xs text-gray-800 ">
							{{- if $types -}}
							<span>
							{{- range $i, $t := $types -}}
							{{- if $i }}, {{ end -}}{{ $t -}}
							{{- end -}}
							</span>
							{{- end -}}
							{{- if $entry -}}, in:
								<span><a href="/almanach/{{ $entry.MusenalmID }}" class="no-underline hover:text-slate-900">{{ $entry.PreferredTitle }}</a></span>
							{{- end -}}
							{{- if $content.MusenalmPagination -}}
								<span>Seite: {{ $content.MusenalmPagination }}</span>
							{{- end -}}
						</div>
					</li>
				{{- end -}}
			</ul>
		{{- else -}}
			<div class="italic text-gray-500">Keine Beiträge verknüpft.</div>
		{{- end -}}
	</div>
	{{- end -}}
</tab-list>