{{ define "title" }}Commits &middot; {{ .RepoInfo.FullName }} &middot; Tangled{{ end }}

{{ define "extrameta" }}
    {{ $title := printf "Commits &middot; %s" .RepoInfo.FullName }}
    {{ $url := printf "https://tangled.org/%s/commits" .RepoInfo.FullName }}

    {{ template "repo/fragments/og" (dict "RepoInfo" .RepoInfo "Title" $title "Url" $url) }}
{{ end }}

{{ define "repoContent" }}
<section id="commit-table" class="overflow-x-auto">
    <h2 class="font-bold text-sm mb-4 dark:text-white">
       Commits
    </h2>

    <!-- desktop view (hidden on small screens) -->
    <div class="hidden md:flex md:flex-col divide-y divide-gray-200 dark:divide-gray-700">
      {{ $grid := "grid grid-cols-14 gap-4" }}
      <div class="{{ $grid }}">
        <div class="py-2 text-sm text-left text-gray-700 dark:text-gray-300 font-bold col-span-3">Author</div>
        <div class="py-2 text-sm text-left text-gray-700 dark:text-gray-300 font-bold col-span-3">Commit</div>
        <div class="py-2 text-sm text-left text-gray-700 dark:text-gray-300 font-bold col-span-6">Message</div>
        <div class="py-2 text-sm text-left text-gray-700 dark:text-gray-300 font-bold col-span-2 justify-self-end">Date</div>
      </div>
      {{ range $index, $commit := .Commits }}
        {{ $messageParts := splitN $commit.Message "\n\n" 2 }}
        <div class="{{ $grid }} py-3">
          <div class="align-top col-span-3">
            {{ template "attribution" (list $commit $.EmailToDid) }}
          </div>
          <div class="align-top font-mono flex items-start col-span-3">
              {{ $verified := $.VerifiedCommits.IsVerified $commit.Hash.String }}
              {{ $hashStyle := "text-gray-700 dark:text-gray-300 bg-gray-100 dark:bg-gray-900" }}
              {{ if $verified }}
                  {{ $hashStyle = "bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200 px-2 rounded" }}
              {{ end }}
              <a href="/{{ $.RepoInfo.FullName }}/commit/{{ $commit.Hash.String }}"
                 {{ if $commit.ChangeId }}title="jj change id: {{ $commit.ChangeId }}"{{ end }}
                 class="no-underline hover:underline {{ $hashStyle }} px-2 py-1/2 rounded flex items-center gap-2">
                  {{ slice $commit.Hash.String 0 8 }}
                  {{ if $verified }}
                  {{ i "shield-check" "w-4 h-4" }}
                  {{ end }}
              </a>
              <div class="{{ if not $verified }} ml-6 {{ end }}inline-flex">
                  <button class="p-1 mx-1 hover:bg-gray-100 dark:hover:bg-gray-700 rounded"
                      title="Copy SHA"
                      onclick="navigator.clipboard.writeText('{{ $commit.Hash.String }}'); this.innerHTML=`{{ i "copy-check" "w-4 h-4" }}`; setTimeout(() => this.innerHTML=`{{ i "copy" "w-4 h-4" }}`, 1500)">
                          {{ i "copy" "w-4 h-4" }}
                  </button>
                  <a href="/{{ $.RepoInfo.FullName }}/tree/{{ $commit.Hash.String }}" class="p-1 mx-1 hover:bg-gray-100 dark:hover:bg-gray-700 rounded" title="Browse repository at this commit">
                      {{ i "folder-code" "w-4 h-4" }}
                  </a>
              </div>

          </div>
          <div class="align-top col-span-6">
            <div>
                <a href="/{{ $.RepoInfo.FullName }}/commit/{{ $commit.Hash.String }}" class="dark:text-white no-underline hover:underline">{{ index $messageParts 0 }}</a>

                {{ if gt (len $messageParts) 1 }}
                <button class="py-1/2 px-1 bg-gray-200 hover:bg-gray-400 dark:bg-gray-700 dark:hover:bg-gray-600 rounded" hx-on:click="this.parentElement.nextElementSibling.classList.toggle('hidden')">{{ i "ellipsis" "w-3 h-3" }}</button>
                {{ end }}

                {{ if index $.TagMap $commit.Hash.String }}
                  {{ range $tag := index $.TagMap $commit.Hash.String }}
                    <span class="ml-2 text-xs rounded bg-gray-100 dark:bg-gray-700 text-black dark:text-white font-mono px-2 inline-flex items-center">
                      {{ $tag }}
                    </span>
                  {{ end }}
                {{ end }}

                <!-- ci status -->
                <span class="text-xs">
                  <span id="pipeline-status-{{ $commit.Hash.String }}"></span>
                </span>
            </div>

            {{ if gt (len $messageParts) 1 }}
              <p class="hidden mt-1 text-sm text-gray-600 dark:text-gray-400">{{ nl2br (index $messageParts 1) }}</p>
            {{ end }}
          </div>
          <div class="align-top justify-self-end text-gray-500 dark:text-gray-400 col-span-2">{{ template "repo/fragments/shortTimeAgo" $commit.Committer.When }}</div>
        </div>
      {{ end }}
    </div>

    <!-- mobile view (visible only on small screens) -->
    <div class="md:hidden">
        {{ range $index, $commit := .Commits }}
            <div class="relative p-2 mb-2 {{ if ne $index (sub (len $.Commits) 1) }}border-b border-gray-200 dark:border-gray-700{{ end }}">
                <div id="commit-message">
                    {{ $messageParts := splitN $commit.Message "\n\n" 2 }}
                    <div class="text-base cursor-pointer">
                        <div class="flex items-center justify-between">
                            <div class="flex-1">
                                <div>
                                    <a href="/{{ $.RepoInfo.FullName }}/commit/{{ $commit.Hash.String }}"
                                       class="inline no-underline hover:underline dark:text-white">
                                       {{ index $messageParts 0 }}
                                    </a>
                                    {{ if gt (len $messageParts) 1 }}
                                        <button
                                            class="py-1/2 px-1 bg-gray-200 hover:bg-gray-400 rounded dark:bg-gray-700 dark:hover:bg-gray-600"
                                            hx-on:click="this.parentElement.nextElementSibling.classList.toggle('hidden')">
                                            {{ i "ellipsis" "w-3 h-3" }}
                                        </button>
                                    {{ end }}

                                    {{ if index $.TagMap $commit.Hash.String }}
                                        {{ range $tag := index $.TagMap $commit.Hash.String }}
                                            <span class="ml-2 text-xs rounded bg-gray-100 dark:bg-gray-700 text-black dark:text-white font-mono px-2 inline-flex items-center">
                                            {{ $tag }}
                                            </span>
                                        {{ end }}
                                    {{ end }}
                                </div>

                                {{ if gt (len $messageParts) 1 }}
                                    <p class="hidden mt-1 text-sm cursor-text pb-2 dark:text-gray-300">
                                        {{ nl2br (index $messageParts 1) }}
                                    </p>
                                {{ end }}
                            </div>
                            <a href="/{{ $.RepoInfo.FullName }}/tree/{{ $commit.Hash.String }}"
                               class="p-1 mr-1 hover:bg-gray-100 dark:hover:bg-gray-700 rounded"
                               title="Browse repository at this commit">
                                {{ i "folder-code" "w-4 h-4" }}
                            </a>
                        </div>
                    </div>
                </div>

                <div class="text-xs mt-2 text-gray-500 dark:text-gray-400 flex items-center [&>:not(:empty)~:not(:empty)]:before:content-['·'] [&>:not(:empty)~:not(:empty)]:before:mx-1 [&>:not(:empty)~:not(:empty)]:before:select-none">
                    {{ $verified := $.VerifiedCommits.IsVerified $commit.Hash.String }}
                    {{ $hashStyle := "text-gray-700 dark:text-gray-300 bg-gray-100 dark:bg-gray-900" }}
                    {{ if $verified }}
                        {{ $hashStyle = "bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200 px-2 rounded" }}
                    {{ end }}
                    <span class="font-mono">
                        <a href="/{{ $.RepoInfo.FullName }}/commit/{{ $commit.Hash.String }}"
                           {{ if $commit.ChangeId }}title="jj change id: {{ $commit.ChangeId }}"{{ end }}
                           class="no-underline hover:underline {{ $hashStyle }} px-2 py-1 rounded flex items-center gap-2">
                           {{ slice $commit.Hash.String 0 8 }}
                           {{ if $verified }}
                           {{ i "shield-check" "w-3 h-3" }}
                           {{ end }}
                        </a>
                    </span>
                    {{ template "attribution" (list $commit $.EmailToDid) }}
                    <span>{{ template "repo/fragments/shortTime" $commit.Committer.When }}</span>

                    <!-- ci status -->
                    <span id="pipeline-status-{{ $commit.Hash.String }}"></span>
                </div>
            </div>
        {{ end }}
    </div>

    {{ if and .Commits .RepoInfo.Spindle }}
    <div
      class="hidden"
      hx-get="/{{ .RepoInfo.FullName }}/commit-statuses?{{ range .Commits }}sha={{ .Hash.String }}&{{ end }}"
      hx-trigger="load"
      hx-swap="none"
    ></div>
    {{ end }}
</section>

{{ end }}

{{ define "attribution" }}
  {{ $commit := index . 0 }}
  {{ $map := index . 1 }}
  <span class="flex items-center gap-1">
    {{ $author := index $map $commit.Author.Email }}
    {{ $coauthors := $commit.CoAuthors }}
    {{ $all := list }}

    {{ if $author }}
        {{ $all = append $all $author }}
    {{ end }}
    {{ range $coauthors }}
      {{ $co := index $map .Email }}
      {{ if $co }}
        {{ $all = append $all $co }}
      {{ end }}
    {{ end }}

    {{ if $author }}
      {{ template "fragments/tinyAvatarList" (dict "all" $all "classes" "size-6") }}
    {{ else }}
      {{ placeholderAvatar "tiny" }}
    {{ end }}
    <a href="{{ if $author }}/{{ $author }}{{ else }}mailto:{{ $commit.Author.Email }}{{ end }}"
       class="no-underline hover:underline">
       {{ if $author }}{{ resolve $author }}{{ else }}{{ $commit.Author.Name }}{{ end }}
       {{ if $coauthors }} +{{ length $coauthors }}{{ end }}
    </a>
  </span>
{{ end }}

{{ define "repoAfter" }}
  {{ $commits_len := len .Commits }}
  <div class="flex justify-end mt-4 gap-2">
      {{ if gt .Page 1 }}<a class="btn flex items-center gap-2 no-underline hover:no-underline dark:text-white dark:hover:bg-gray-700" hx-boost="true" onclick="window.location.href = window.location.pathname + '?page={{ sub .Page 1 }}'">{{ i "chevron-left" "w-4 h-4" }} Previous</a>{{ else }}<div></div>{{ end }}
      {{ if eq $commits_len 60 }}<a class="btn flex items-center gap-2 no-underline hover:no-underline dark:text-white dark:hover:bg-gray-700" hx-boost="true" onclick="window.location.href = window.location.pathname + '?page={{ add .Page 1 }}'">Next {{ i "chevron-right" "w-4 h-4" }}</a>{{ end }}
  </div>
{{ end }}
