{{ define "title" }}{{ resolve .Card.UserDid }}{{ end }}

{{ define "profileContent" }}
  <div id="all-repos" class="md:col-span-4 order-2 md:order-2">
    <div class="grid grid-cols-1 gap-4">
      {{ block "ownRepos" . }}{{ end }}
      {{ block "collaboratingRepos" . }}{{ end }}
    </div>
  </div>
  <div class="md:col-span-4 order-3 md:order-3">
      {{ block "profileTimeline" . }}{{ end }}
  </div>
{{ end }}

{{ define "profileTimeline" }}
  <p class="text-sm font-bold px-2 pb-4 dark:text-white">ACTIVITY</p>
  <div class="flex flex-col gap-4 relative">
    {{ if .ProfileTimeline.IsEmpty }}
      <div class="text-base text-gray-500 flex items-center justify-center italic p-12 border border-gray-200 dark:border-gray-700 rounded">
        <span class="flex items-center gap-2">
          This user does not have any activity yet.
        </span>
      </div>
    {{ end }}

    {{ with .ProfileTimeline }}
      {{ range $idx, $byMonth := .ByMonth }}
        {{ with $byMonth }}
          {{ if not .IsEmpty }}
            <div class="border border-gray-200 dark:border-gray-700 rounded-sm py-4 px-6">
            <p class="text-sm font-mono mb-2 text-gray-500 dark:text-gray-400">
              {{ if eq $idx 0 }}
                this month
              {{ else }}
                {{$idx}} month{{if ne $idx 1}}s{{end}} ago
              {{ end }}
            </p>

              <div class="flex flex-col gap-1">
                {{ block "commits"  .Commits }} {{ end }}
                {{ block "repoEvents"  .RepoEvents }} {{ end }}
                {{ block "issueEvents" .IssueEvents }} {{ end }}
                {{ block "pullEvents"  .PullEvents }} {{ end }}
              </div>
            </div>
          {{ end }}
        {{ end }}
      {{ end }}
    {{ end }}
  </div>
{{ end }}

{{ define "commits" }}
  {{ if . }}
    <div class="flex flex-wrap items-center gap-1">
      {{ i "git-commit-horizontal" "size-5" }}
      created {{ scaleFmt . }} commits
    </div>
  {{ end }}
{{ end }}

{{ define "repoEvents" }}
  {{ if gt (len .) 0 }}
    <details>
      <summary class="list-none cursor-pointer hover:text-gray-500 hover:dark:text-gray-400">
        <div class="flex flex-wrap items-center gap-2">
          {{ i "book-plus" "w-4 h-4" }}
          created {{ scaleFmt (len .) }} {{if eq (len .) 1 }}repository{{else}}repositories{{end}}
        </div>
      </summary>
      <div class="py-2 text-sm flex flex-col gap-3 mb-2">
        {{ range . }}
          <div class="flex flex-wrap items-center justify-between gap-2">
            <span class="flex items-center gap-2">
              <span class="text-gray-500 dark:text-gray-400">
                {{ if .Source }}
                {{ i "git-fork" "w-4 h-4" }}
                {{ else }}
                {{ i "book-plus" "w-4 h-4" }}
                {{ end }}
              </span>
              <a href="/{{ resolve .Repo.Did }}/{{ .Repo.Slug }}" class="no-underline hover:underline">
                {{- .Repo.Name -}}
              </a>
            </span>

            {{ with .Repo.RepoStats }}
              {{ with .Language }}
                <div class="flex gap-2 items-center text-xs font-mono text-gray-400 ">
                  {{ template "repo/fragments/colorBall" (dict "color" (langColor .)) }}
                  <span>{{ . }}</span>
                </div>
              {{end }}
            {{end }}
          </div>
        {{ end }}
      </div>
    </details>
  {{ end }}
{{ end }}

{{ define "issueEvents" }}
  {{ $items := .Items }}
  {{ $stats := .Stats }}

  {{ if gt (len $items) 0 }}
    <details>
      <summary class="list-none cursor-pointer hover:text-gray-500 hover:dark:text-gray-400">
        <div class="flex flex-wrap items-center gap-2">
          {{ i "circle-dot" "w-4 h-4" }}

          <div>
            created {{ scaleFmt (len $items) }} {{if eq (len $items) 1 }}issue{{else}}issues{{end}} 
          </div>

          {{ if gt $stats.Open 0 }}
            <span class="px-2 py-1/2 text-sm rounded text-white bg-green-600 dark:bg-green-700">
              {{scaleFmt $stats.Open}} open
            </span>
          {{ end }}

          {{ if gt $stats.Closed 0 }}
          <span class="px-2 py-1/2 text-sm rounded text-white bg-gray-800 dark:bg-gray-700">
            {{scaleFmt $stats.Closed}} closed
          </span>
          {{ end }}

        </div>
      </summary>
      <div class="py-2 text-sm flex flex-col gap-3 mb-2">
        {{ range $items }}
          {{ template "user/fragments/issueEvent" . }}
        {{ end }}
      </div>
    </details>
  {{ end }}
{{ end }}

{{ define "pullEvents" }}
  {{ $items := .Items }}
  {{ $stats := .Stats }}
  {{ if gt (len $items) 0 }}
    <details>
      <summary class="list-none cursor-pointer hover:text-gray-500 hover:dark:text-gray-400">
        <div class="flex flex-wrap items-center gap-2">
          {{ i "git-pull-request" "w-4 h-4" }}

          <div>
            created {{ scaleFmt (len $items) }} {{if eq (len $items) 1 }}pull request{{else}}pull requests{{end}} 
          </div>

          {{ if gt $stats.Open 0 }}
            <span class="px-2 py-1/2 text-sm rounded text-white bg-green-600 dark:bg-green-700">
              {{scaleFmt $stats.Open}} open
            </span>
          {{ end }}

          {{ if gt $stats.Merged 0 }}
            <span class="px-2 py-1/2 text-sm rounded text-white bg-purple-600 dark:bg-purple-700">
              {{scaleFmt $stats.Merged}} merged
            </span>
          {{ end }}


          {{ if gt $stats.Closed 0 }}
          <span class="px-2 py-1/2 text-sm rounded text-white bg-gray-800 dark:bg-gray-700">
            {{scaleFmt $stats.Closed}} closed
          </span>
          {{ end }}

        </div>
      </summary>
      <div class="py-2 text-sm flex flex-col gap-3 mb-2">
        {{ range $items }}
          {{ template "user/fragments/pullEvent" . }}
        {{ end }}
      </div>
    </details>
  {{ end }}
{{ end }}

{{ define "ownRepos" }}
  <div>
    <div class="text-sm font-bold px-2 pb-4 dark:text-white flex items-center gap-2">
      <a href="/{{ resolve $.Card.UserDid }}?tab=repos"
        class="flex text-black dark:text-white items-center gap-2 no-underline hover:no-underline group">
        <span>PINNED REPOS</span>
      </a>
      {{ if and .LoggedInUser (eq .LoggedInUser.Did .Card.UserDid) }}
        <button
          hx-get="profile/edit-pins"
          hx-target="#all-repos"
          class="py-0 font-normal text-sm flex gap-2 items-center group">
          {{ i "pencil" "w-3 h-3" }}
          {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
        </button>
      {{ end }}
    </div>
    <div id="repos" class="grid grid-cols-1 gap-4 items-stretch">
      {{ range .Repos }}
      <div class="border border-gray-200 dark:border-gray-700 rounded-sm">
        {{ if .RepoDid }}
          {{ template "user/fragments/repoCard" (list $ . false) }}
        {{ else }}
          <div class="py-4 px-6 gap-1 flex flex-col drop-shadow-sm rounded bg-gray-50 dark:bg-gray-900 min-h-32 opacity-60">
            <div class="font-medium dark:text-white flex items-center">
              {{ i "book-marked" "w-4 h-4 mr-1.5 shrink-0" }}
              <span class="truncate min-w-0">{{ resolve .Did }}/{{ .Name }}</span>
            </div>
            <div class="text-gray-500 dark:text-gray-400 text-sm italic">
              This repo is hosted on a legacy knot that ought to be upgraded.
            </div>
          </div>
        {{ end }}
      </div>
      {{ else }}
        <div class="text-base text-gray-500 flex items-center justify-center italic p-12 border border-gray-200 dark:border-gray-700 rounded">
          <span class="flex items-center gap-2">
            This user does not have any pinned repos.
          </span>
        </div>
      {{ end }}
    </div>
  </div>
{{ end }}

{{ define "collaboratingRepos" }}
  {{ if gt (len .CollaboratingRepos) 0 }}
    <div>
      <p class="text-sm font-bold px-2 pb-4 dark:text-white">COLLABORATING ON</p>
      <div id="collaborating" class="grid grid-cols-1 gap-4">
        {{ range .CollaboratingRepos }}
        <div class="border border-gray-200 dark:border-gray-700 rounded-sm">
          {{ if .RepoDid }}
            {{ template "user/fragments/repoCard" (list $ . true) }}
          {{ else }}
            <div class="py-4 px-6 gap-1 flex flex-col drop-shadow-sm rounded bg-gray-50 dark:bg-gray-900 min-h-32 opacity-60">
              <div class="font-medium dark:text-white flex items-center">
                {{ i "book-marked" "w-4 h-4 mr-1.5 shrink-0" }}
                <span class="truncate min-w-0">{{ resolve .Did }}/{{ .Name }}</span>
              </div>
              <div class="text-gray-500 dark:text-gray-400 text-sm italic">
                This repo is hosted on a legacy knot that ought to be upgraded.
              </div>
            </div>
          {{ end }}
        </div>
        {{ else }}
            <p class="px-6 dark:text-white">This user is not collaborating.</p>
        {{ end }}
      </div>
    </div>
  {{ end }}
{{ end }}