Make the branch sorting work

6bdf18eea5616dd326c56236b7a13b1ec7491fd0

Tucker McKnight <tucker@pangolin.lan> | Tue Dec 30 2025

Make the branch sorting work

Also preserve the user's choice across page loads. (Call the function
again at the bottom of the main.js file.)

Also rename "patches" to "commits" on commits page.
frontend/main.js:76
Before
After
frontend/main.js:109
Before
108
109


    window.popovers.forEach(popover => popover.hide())
  }
⁣
⁣
})
After
108
109
110
111
    window.popovers.forEach(popover => popover.hide())
  }
})

showBranchesResults(searchBox.value)
js_templates/common/branchesListItems.ts:1
Before




0




1


2



3
4









5
6
7
e⁣
⁣
⁣
⁣
⁣
xport default (branches: Array<{name: string, href: string, date: string}>, defaultBranch: string, currentBranch: string): string => {
⁣
⁣
⁣
⁣
  return branches.map((branch) => {
⁣
⁣
    const currentBadge = currentBranch === branch.name ? '<div class="badge rounded-pill bg-secondary mx-1">current</div>' : ''
⁣
⁣
⁣
    const defaultBadge = defaultBranch === branch.name ? '<div class="badge rounded-pill bg-info text-dark mx-1">default</div>' : ''

⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
    return `<a href='${branch.href}' class='dropdown-item my-1'><span class="branch-dropdown-branch-name me-1">${branch.name}</span>${currentBadge}${defaultBadge}<span class="text-body d-block ms-2">updated ${branch.date}</span></a>`
  }).join('')
}

After
0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
export default (
  branches: Array<{name: string, href: string, date: string}>,
  defaultBranch: string,
  currentBranch: string,
  sortBy: 'name' | 'date',
): string => {
  return branches.toSorted((a, b) => {
    if (a[sortBy] < b[sortBy]) { return -1 }
    if (a[sortBy] > b[sortBy]) { return 1 }
    return 0
  }).map((branch) => {
    const currentBadge = currentBranch === branch.name
      ? '<div class="badge rounded-pill bg-secondary mx-1">current</div>'
      : ''

    const defaultBadge = defaultBranch === branch.name
      ? '<div class="badge rounded-pill bg-info text-dark mx-1">default</div>'
      : ''

    return `
      <a href='${branch.href}' class='dropdown-item my-1'>
        <span class="branch-dropdown-branch-name me-1">
          ${branch.name}
        </span>${currentBadge}${defaultBadge}
        <span class="text-body d-block ms-2">
          updated ${branch.date}
        </span>
      </a>
    `
  }).join('')
}

js_templates/common/htmlPage.ts:70
Before
69
70
71
72
73
74
75
76
77
78
79
80
                              </div>
                              <div class="sortRadioButtons">
                                <div class="sortRadioButton pe-1">
                                  <input class="form-check-input" type="radio" name="branchSort" id="branchSortByDate" checked>
                                  <label class="form-check-label" for="branchSortByDate">
                                    Last commit
                                  </label>
                                </div>
                                <div class="sortRadioButton ps-1">
                                  <input class="form-check-input" type="radio" name="branchSort" id="branchSortByName">
                                  <label class="form-check-label" for="branchSortByName">
                                    Name
                                  </label>
After
69
70
71
72
73
74
75
76
77
78
79
80
                              </div>
                              <div class="sortRadioButtons">
                                <div class="sortRadioButton pe-1">
                                  <input class="form-check-input sort-filter" type="radio" name="branchSort" value='date' id="branchSortByDate" checked>
                                  <label class="form-check-label" for="branchSortByDate">
                                    Last commit
                                  </label>
                                </div>
                                <div class="sortRadioButton ps-1">
                                  <input class="form-check-input sort-filter" type="radio" name="branchSort" value='name' id="branchSortByName">
                                  <label class="form-check-label" for="branchSortByName">
                                    Name
                                  </label>
js_templates/common/htmlPage.ts:86
Before
85
86
87
88
89
90
                          </form>
                          <div class="dropdown-divider"></div>
                          <div id="dropdown-branches-results" class="dropdown-branches">
                            ${branchesListItems(branchesWithHrefs, repo.defaultBranch, branch.name)}
                          </div>
                        </div>
                      </div>
After
85
86
87
88
89
90
                          </form>
                          <div class="dropdown-divider"></div>
                          <div id="dropdown-branches-results" class="dropdown-branches">
                            ${branchesListItems(branchesWithHrefs, repo.defaultBranch, branch.name, 'date')}
                          </div>
                        </div>
                      </div>
templates/file.njk:37
Before
36
37
38
39
40
41
    {% set annotations = fileInfo.repoName | getFileLastTouchInfo(fileInfo.branchName, fileInfo.file) %}
    <code style="white-space: pre;"><pre class="language-text">
{%- for annotation in annotations -%}
<a href="{{reposPath}}/{{fileInfo.repoName | slugify}}/branches/{{fileInfo.branchName | slugify}}/patches/{{annotation.sha}}">{{ (annotation.sha | truncate(6, true, '')) }}</a> {{ annotation.author }}
{% endfor -%}
    </pre></code>
  </div>
After
36
37
38
39
40
41
    {% set annotations = fileInfo.repoName | getFileLastTouchInfo(fileInfo.branchName, fileInfo.file) %}
    <code style="white-space: pre;"><pre class="language-text">
{%- for annotation in annotations -%}
<a href="{{reposPath}}/{{fileInfo.repoName | slugify}}/branches/{{fileInfo.branchName | slugify}}/commits/{{annotation.sha}}">{{ (annotation.sha | truncate(6, true, '')) }}</a> {{ annotation.author }}
{% endfor -%}
    </pre></code>
  </div>