{{ define "title" }}{{ .Tab }} settings{{ end }}

{{ define "content" }}
  <div class="p-6">
    <p class="text-xl font-bold dark:text-white">Settings</p>
  </div>
  <div class="bg-white dark:bg-gray-800 p-6 rounded relative w-full mx-auto drop-shadow-sm dark:text-white">
    <section class="w-full grid grid-cols-1 md:grid-cols-4 gap-6">
      <div class="col-span-1">
        {{ template "user/settings/fragments/sidebar" . }}
      </div>
      <div class="col-span-1 md:col-span-3 flex flex-col gap-6">
        {{ template "migrationSettings" . }}
      </div>
    </section>
  </div>
{{ end }}

{{ define "migrationSettings" }}
  <div class="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
    <div>
      <h2 class="text-sm pb-2 uppercase font-bold">Repository imports</h2>
      <p class="text-gray-500 dark:text-gray-400">
        Track the status of repositories pulled in from another forge.
        Successful imports stay; failed ones can be retried by starting a new migration with the same name.
      </p>
    </div>
    <div class="sm:justify-self-end">
      <a href="/account/migrate?service=github" class="btn flex items-center gap-2 whitespace-nowrap">
        {{ i "plus" "size-4" }}
        new migration
      </a>
    </div>
  </div>

  <div class="flex flex-col rounded border border-gray-200 dark:border-gray-700 w-full">
    {{ if not .Migrations }}
      <div class="flex items-center justify-center p-4 text-gray-500">
        no migrations yet
      </div>
    {{ else }}
      <table class="w-full text-left table-fixed">
        <thead class="text-xs uppercase text-gray-500">
          <tr>
            <th class="px-3 py-2">Repo</th>
            <th class="px-3 py-2">Knot</th>
            <th class="px-3 py-2">Status</th>
            <th class="px-3 py-2 hidden sm:table-cell">Updated</th>
          </tr>
        </thead>
        {{ template "account/migrate/fragments/progressRows" . }}
      </table>
    {{ end }}
  </div>
{{ end }}