{{ define "title" }}Search · {{ .RepoInfo.FullName }} · Tangled{{ end }}

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

    {{ template "repo/fragments/og" (dict "RepoInfo" .RepoInfo) }}
{{ end }}

{{ define "repoContent" }}
<main>
  <div class="flex relative w-full mb-4">
    <div class="flex-1 flex relative">
      <input
        id="repo-search-input"
        type="text"
        name="q"
        value="{{ .FilterQuery }}"
        placeholder="Find files or code"
        hx-get="/{{ .RepoInfo.FullName }}/search"
        hx-trigger="{{ if .FilterQuery }}load, {{ end }}keydown[key=='Enter'] from:#repo-search-input, input changed delay:100ms from:#repo-search-input"
        hx-target="#repo-files"
        hx-swap="outerHTML"
        hx-replace-url="true"
        autofocus
        class="flex-1 py-1 pl-2 pr-10 mr-[-1px] rounded-r-none peer"
      >
      <a
        href="?"
        class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hidden peer-[:not(:placeholder-shown)]:block"
      >
        {{ i "x" "w-4 h-4" }}
      </a>
    </div>
    <button
      type="button"
      hx-get="/{{ .RepoInfo.FullName }}/search"
      hx-include="#repo-search-input"
      hx-target="#repo-files"
      hx-swap="outerHTML"
      hx-replace-url="true"
      class="p-2 text-gray-400 border rounded-r border-gray-300 dark:border-gray-600"
    >
      {{ i "search" "w-4 h-4" }}
    </button>
  </div>
  {{ if not .LoggedInUser }}
    <div class="flex items-center gap-2 my-2 bg-orange-50 dark:bg-orange-900/30 border border-orange-300 dark:border-orange-700 rounded px-3 py-2 text-orange-600 dark:text-orange-300 text-sm">
      {{ i "circle-alert" "size-4" }}
      <span><a href="/login" class="underline">Login</a> to search files or codes.</span>
    </div>
  {{ else }}
    {{ template "repo/fragments/searchResults" dict }}
  {{ end }}
</main>
{{ end }}