{{ define "title" }}{{ .RepoInfo.FullName }} at {{ .Ref }}{{ end }}


{{ define "extrameta" }}
    {{ template "repo/fragments/meta" . }}

    {{ template "repo/fragments/og" (dict "RepoInfo" .RepoInfo) }}
    
    <!-- Structured Data for Repository -->
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "SoftwareSourceCode",
      "name": "{{ .RepoInfo.Name }}",
      "description": "{{ .RepoInfo.Description }}",
      "codeRepository": "https://tangled.org/{{ .RepoInfo.FullName }}",
      "programmingLanguage": {{ if .Languages }}{{ range $idx, $lang := .Languages }}{{ if eq $idx 0 }}"{{ $lang.Name }}"{{ end }}{{ end }}{{ else }}"Unknown"{{ end }},
      "url": "https://tangled.org/{{ .RepoInfo.FullName }}",
      "author": {
        "@type": "Person",
        "name": "{{ .RepoInfo.OwnerWithAt }}",
        "url": "https://tangled.org/{{ .RepoInfo.OwnerWithAt }}"
      }{{ if .RepoInfo.Source }},
      "isBasedOn": {
        "@type": "SoftwareSourceCode",
        "name": "{{ .RepoInfo.Source.Name }}",
        "url": "https://tangled.org/{{ didOrHandle .RepoInfo.Source.Did .RepoInfo.SourceHandle }}/{{ .RepoInfo.Source.Name }}"
      }{{ end }}
    }
    </script>
    
    <!-- Breadcrumb Navigation -->
    {{ template "fragments/breadcrumb" (list
        (list "Home" "https://tangled.org")
        (list .RepoInfo.OwnerWithAt (printf "https://tangled.org/%s" .RepoInfo.OwnerWithAt))
        (list .RepoInfo.Name (printf "https://tangled.org/%s" .RepoInfo.FullName))
    ) }}
{{ end }}

{{ define "canonical" }}https://tangled.org/{{ .RepoInfo.FullName }}{{ end }}

{{ define "rss" }}
    <link rel="alternate" type="application/atom+xml" title="{{ .RepoInfo.FullName }} Activity Feed" href="https://tangled.org/{{ .RepoInfo.FullName }}/feed.atom" />
{{ end }}

{{ define "repoContent" }}
    <main>
        {{ if .Languages }}
            {{ block "repoLanguages" . }}{{ end }}
        {{ end }}
        <div class="flex items-center justify-between pb-5">
          {{ block "branchSelector" . }}{{ end }}
          <div class="flex md:hidden items-center gap-2">
            <a href="/{{ .RepoInfo.FullName }}/commits/{{ .Ref | urlquery }}" class="inline-flex items-center text-sm gap-1 font-bold">
              {{ i "git-commit-horizontal" "w-4" "h-4" }} {{ .TotalCommits }}
            </a>
            <a href="/{{ .RepoInfo.FullName }}/branches" class="inline-flex items-center text-sm gap-1 font-bold">
              {{ i "git-branch" "w-4" "h-4" }} {{ len .Branches }}
            </a>
            <a href="/{{ .RepoInfo.FullName }}/tags" class="inline-flex items-center text-sm gap-1 font-bold">
              {{ i "tags" "w-4" "h-4" }} {{ len .Tags }}
            </a>
            {{ template "repo/fragments/cloneDropdown" . }}
          </div>
        </div>
        <div class="grid grid-cols-1 md:grid-cols-2 gap-2">
            {{ block "fileTree" . }}{{ end }}
            {{ block "rightInfo" . }}{{ end }}
        </div>
    </main>
{{ end }}

{{ define "repoLanguages" }}
    <details class="group -my-4 -m-6 mb-4">
      <summary class="flex gap-[1px] h-4 scale-y-50 hover:scale-y-100 origin-top group-open:scale-y-100 transition-all hover:cursor-pointer overflow-hidden rounded-t">
        {{ range $value := .Languages }}
        <div
          title='{{ or $value.Name "Other" }} {{ printf "%.1f" $value.Percentage }}%'
          style="background-color: {{ $value.Color }}; width: {{ $value.Percentage }}%"
        ></div>
        {{ end }}
      </summary>
      <div class="px-4 py-2 border-b border-gray-200 dark:border-gray-600 flex items-center gap-4 flex-wrap">
        {{ range $value := .Languages }}
        <div
          class="flex items-center gap-2 text-xs align-items-center justify-center"
        >
          {{ template "repo/fragments/colorBall" (dict "color" (langColor $value.Name)) }}
          <div>{{ or $value.Name "Other" }}
            <span class="text-gray-500 dark:text-gray-400">
              {{ if lt $value.Percentage 0.05 }}
                0.1%
              {{ else }}
                {{ printf "%.1f" $value.Percentage }}%
              {{ end }}
            </span></div>
        </div>
        {{ end }}
      </div>
    </details>
{{ end }}

{{ define "branchSelector" }}
  <div class="flex gap-2 items-center justify-between w-full">
    <div class="flex gap-2 items-center">
      <select
          onchange="window.location.href = '/{{ .RepoInfo.FullName }}/tree/' + encodeURIComponent(this.value)"
          class="p-1 border max-w-32 border-gray-200 bg-white dark:bg-gray-800 dark:text-white dark:border-gray-700"
      >
          <optgroup label="branches ({{len .Branches}})" class="bold text-sm">
              {{ range .Branches }}
                  <option
                      value="{{ .Reference.Name }}"
                      class="py-1"
                      {{ if eq .Reference.Name $.Ref }}
                          selected
                      {{ end }}
                  >
                      {{ .Reference.Name }}
                  </option>
              {{ end }}
          </optgroup>
          <optgroup label="tags ({{len .Tags}})" class="bold text-sm">
              {{ range .Tags }}
                  <option
                      value="{{ .Reference.Name }}"
                      class="py-1"
                      {{ if eq .Reference.Name $.Ref }}
                          selected
                      {{ end }}
                  >
                      {{ .Reference.Name }}
                  </option>
              {{ else }}
                  <option class="py-1" disabled>no tags found</option>
              {{ end }}
          </optgroup>
      </select>
      <div class="flex items-center gap-2">
          <a
              href="/{{ .RepoInfo.FullName }}/compare?base={{ $.Ref | urlquery }}"
              class="btn flex items-center gap-2 no-underline hover:no-underline"
              title="Compare branches or tags"
          >
              {{ i "git-compare" "w-4 h-4" }}
          </a>
      </div>
    </div>

    <!-- Clone dropdown in top right -->
    <div class="hidden md:flex items-center ">
        {{ template "repo/fragments/cloneDropdown" . }}
    </div>
  </div>
{{ end }}

{{ define "fileTree" }}
  <div id="file-tree" class="col-span-1 pr-2 md:border-r md:border-gray-200 dark:md:border-gray-700" >
    {{ $linkstyle := "no-underline hover:underline dark:text-white" }}

    {{ range .Files }}
      <div class="grid grid-cols-3 gap-4 items-center py-1">
        <div class="col-span-2">
          {{ $link := printf "/%s/%s/%s/%s" $.RepoInfo.FullName "tree" (urlquery $.Ref) .Name }}
          {{ $icon := "folder" }}
          {{ $iconStyle := "size-4 fill-current" }}

          {{ if .IsSubmodule }}
            {{ $link = printf "/%s/%s/%s/%s" $.RepoInfo.FullName "blob" (urlquery $.Ref) .Name }}
            {{ $icon = "folder-input" }}
            {{ $iconStyle = "size-4" }}
          {{ end }}

          {{ if .IsFile }}
            {{ $link = printf "/%s/%s/%s/%s" $.RepoInfo.FullName "blob" (urlquery $.Ref) .Name }}
            {{ $icon = "file" }}
            {{ $iconStyle = "size-4" }}
          {{ end }}

          <a href="{{ $link }}" class="{{ $linkstyle }}">
            <div class="flex items-center gap-2">
              {{ i $icon $iconStyle "flex-shrink-0" }}
              <span class="truncate">{{ .Name }}</span>
            </div>
          </a>
        </div>

        <div class="text-sm col-span-1 text-right">
          {{ with .LastCommit }}
            <a href="/{{ $.RepoInfo.FullName }}/commit/{{ .Hash }}" class="text-gray-500 dark:text-gray-400">{{ template "repo/fragments/time" .When }}</a>
          {{ end }}
        </div>
      </div>
    {{ end }}
  </div>
{{ end }}

{{ define "rightInfo" }}
    <div id="right-info" class="hidden md:block col-span-1">
      {{ block "commitLog" . }} {{ end }}
      {{ block "branchList" . }} {{ end }}
      {{ block "tagList" . }} {{ end }}
    </div>
{{ end }}

{{ define "commitLog" }}
<div id="commit-log" class="md:col-span-1 px-2 pb-4">
  <div class="flex justify-between items-center">
    <a href="/{{ .RepoInfo.FullName }}/commits/{{ .Ref | urlquery }}" class="flex items-center gap-2 pb-2 cursor-pointer font-bold hover:text-gray-600 dark:hover:text-gray-300 hover:no-underline">
      {{ i "logs" "w-4 h-4" }} commits
      <span class="bg-gray-100 dark:bg-gray-700 font-normal rounded py-1/2 px-1 text-sm">{{ .TotalCommits }}</span>
    </a>
  </div>
  <div class="flex flex-col gap-6">
    {{ range .CommitsTrunc }}
    <div>
      <div id="commit-message">
        {{ $messageParts := splitN .Message "\n\n" 2 }}
        <div class="text-base cursor-pointer">
          <div>
            <div>
              <a
                href="/{{ $.RepoInfo.FullName }}/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 }}
            </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>
        </div>
      </div>

      <!-- commit info bar -->
      <div class="text-xs mt-2 text-gray-500 dark:text-gray-400 flex items-center flex-wrap">
          {{ $verified := $.VerifiedCommits.IsVerified .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/{{ .Hash.String }}"
                 class="no-underline hover:underline {{ $hashStyle }} px-2 py-1 rounded flex items-center gap-2">
                 {{ slice .Hash.String 0 8 }}
                 {{ if $verified }}
                 {{ i "shield-check" "w-3 h-3" }}
                 {{ end }}
              </a>
          </span>
        <span
          class="mx-1 before:content-['·'] before:select-none"
          ></span>
        <span>
          {{ $did := index $.EmailToDid .Author.Email }}
          <a href="{{ if $did }}/{{ resolve $did }}{{ else }}mailto:{{ .Author.Email }}{{ end }}"
            class="text-gray-500 dark:text-gray-400 no-underline hover:underline"
            >{{ if $did }}{{ template "user/fragments/picHandleLink" $did }}{{ else }}{{ .Author.Name }}{{ end }}</a>
        </span>
        <div class="inline-block px-1 select-none after:content-['·']"></div>
        {{ template "repo/fragments/time" .Committer.When }}

        <!-- tags/branches -->
        {{ $tagsForCommit := index $.TagMap .Hash.String }}
        {{ if gt (len $tagsForCommit) 0 }}
          <div class="inline-block px-1 select-none after:content-['·']"></div>
        {{ end }}
        {{ range $tagsForCommit }}
          <span class="text-xs rounded bg-gray-100 dark:bg-gray-700 text-black dark:text-white font-mono px-2 mx-[2px] inline-flex items-center">
            {{ . }}
          </span>
        {{ end }}

        <!-- ci status -->
        {{ $pipeline := index $.Pipelines .Hash.String }}
        {{ if and $pipeline (gt (len $pipeline.Statuses) 0) }}
          <div class="inline-block px-1 select-none after:content-['·']"></div>
          {{ template "repo/pipelines/fragments/pipelineSymbolLong" (dict "RepoInfo" $.RepoInfo "Pipeline" $pipeline) }}
        {{ end }}
      </div>
    </div>
    {{ end }}
  </div>
</div>
{{ end }}

{{ define "branchList" }}
  {{ if gt (len .BranchesTrunc) 0 }}
    <div id="branches" class="md:col-span-1 px-2 py-4 border-t border-gray-200 dark:border-gray-700">
      <a href="/{{ .RepoInfo.FullName }}/branches" class="flex items-center gap-2 pb-2 cursor-pointer font-bold hover:text-gray-600 dark:hover:text-gray-300 hover:no-underline">
        {{ i "git-branch" "w-4 h-4" }} branches
        <span class="bg-gray-100 dark:bg-gray-700 font-normal rounded py-1/2 px-1 text-sm">{{ len .Branches }}</span>
      </a>
      <div class="flex flex-col gap-1">
        {{ range .BranchesTrunc }}
        <div class="text-base flex items-center justify-between overflow-hidden">
          <div class="flex items-center gap-2 min-w-0 flex-1">
            <a href="/{{ $.RepoInfo.FullName }}/tree/{{ .Reference.Name | urlquery }}"
              class="inline-block truncate no-underline hover:underline dark:text-white">
              {{ .Reference.Name }}
            </a>
            {{ if .Commit }}
            <span class="px-1 text-gray-500 dark:text-gray-400 select-none after:content-['·'] shrink-0"></span>
            <span class="whitespace-nowrap text-xs text-gray-500 dark:text-gray-400 shrink-0">{{ template "repo/fragments/time" .Commit.Committer.When }}</span>
            {{ end }}
            {{ if .IsDefault }}
            <span class="px-1 text-gray-500 dark:text-gray-400 select-none after:content-['·'] shrink-0"></span>
            <span class="bg-gray-200 dark:bg-gray-700 rounded py-1/2 px-1 text-xs font-mono shrink-0">default</span>
            {{ end }}
          </div>
          {{ if ne $.Ref .Reference.Name }}
            <a href="/{{ $.RepoInfo.FullName }}/compare/{{ $.Ref | urlquery }}...{{ .Reference.Name | urlquery }}"
              class="text-xs flex gap-2 items-center shrink-0 ml-2"
              title="Compare branches or tags">
              {{ i "git-compare" "w-3 h-3" }} compare
            </a>
          {{ end }}
        </div>
        {{ end }}
      </div>
    </div>
  {{ end }}
{{ end }}

{{ define "tagList" }}
  {{ if gt (len .TagsTrunc) 0 }}
    <div id="tags" class="md:col-span-1 px-2 py-4 border-t border-gray-200 dark:border-gray-700">
      <div class="flex justify-between items-center">
        <a href="/{{ .RepoInfo.FullName }}/tags" class="flex items-center gap-2 pb-2 cursor-pointer font-bold hover:text-gray-600 dark:hover:text-gray-300 hover:no-underline">
          {{ i "tags" "w-4 h-4" }} tags
          <span class="bg-gray-100 dark:bg-gray-700 font-normal rounded py-1/2 px-1 text-sm">{{ len .Tags }}</span>
        </a>
      </div>
      <div class="flex flex-col gap-1">
        {{ range $idx, $tag := .TagsTrunc }}
        {{ with $tag }}
        <div>
          <div class="text-base flex items-center gap-2">
            <a href="/{{ $.RepoInfo.FullName }}/tree/{{ .Reference.Name | urlquery }}"
              class="inline no-underline hover:underline dark:text-white">
              {{ .Reference.Name }}
            </a>
          </div>
          <div>
            {{ with .Tag }}
              <span class="text-xs text-gray-500 dark:text-gray-400">{{ template "repo/fragments/time" .Tagger.When }}</span>
            {{ end }}
            {{ if eq $idx 0 }}
              {{ with .Tag }}<span class="px-1 text-gray-500 dark:text-gray-400 select-none after:content-['·']"></span>{{ end }}
              <span class="bg-gray-200 dark:bg-gray-700 rounded py-1/2 px-1 text-xs font-mono">latest</span>
            {{ end }}
          </div>
        </div>
        {{ end }}
        {{ end }}
      </div>
    </div>
  {{ end }}
{{ end }}

{{ define "repoAfter" }}
    {{- if or .HTMLReadme .Readme -}}
       {{ template "repo/fragments/readme" . }}
    {{- end -}}
{{ end }}