Branch

htmlPage.ts

View raw file 
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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140

7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight

import { type ReposConfiguration } from '../../src/configTypes.ts'
import { type Repository } from '../../src/dataTypes.ts'
import { NavHelper } from '../helpers/nav.ts'

export const branchesListItems = (branches: Array<{name: string, href: string, date: string}>, defaultBranch: string): string => {
  return branches.map((branch) => {
    const badge = defaultBranch === branch.name ? '<div class="badge rounded-pill bg-primary ms-2">default</div>' : ''
    return `<a href='${branch.href}' class='dropdown-item my-1'><span class="branch-dropdown-branch-name">${branch.name}</span>${badge}<span class="text-body d-block ms-2">updated ${branch.date}</span></a>`
  }).join('')
}

export default async (reposConfig: ReposConfiguration, eleventyConfig: any, pageContent: Function) => {
  return async (data) => {
    if (data.currentRepo === '') {
      return
    }

    const repo: Repository = data.currentRepo
    const branch: Repository['branches'][0] = data.currentBranch

    const slugify = eleventyConfig.getFilter("slugify")
    const nav = NavHelper(reposConfig, slugify, repo.name, branch.name)

    const branchesWithHrefs = repo.branches.map((branch) => {
      return {
        name: branch.name,
        href: nav.repoBranchHome(branch.name),
        date: repo.commits.get(branch.head).date.toDateString(),
      }
    })

    return `
      <!doctype html>
      <html lang="en">
        <head>
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width, initial-scale=1">
          <title>${repo.name}</title>
          <link rel="stylesheet" href="/css/design-board.css">
          <link href="https://unpkg.com/prismjs@1.20.0/themes/prism.css" rel="stylesheet" />
          <script>
            window.branchesWithHrefs = ${JSON.stringify(branchesWithHrefs)};
            window.defaultBranch = "${repo.defaultBranch}";
            window.cloneUrl = "${repo.cloneUrl}";
          </script>
          <script src="${nav.rootPath()}frontend/top.js"></script>
        </head>
        <body>
          <div class="container">
            <div class="row">
              <div class="col">
                <nav class="navbar navbar-expand">
                  <ul class="navbar-nav flex-wrap">
                    <li class="nav-item">
                      <a class="nav-link" href="${nav.rootPath()}">&larr; All repositories</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="#">${repo.name}</a>
                    </li>
                    <li class="nav-item">
                      <span class="nav-link d-inline-block">Branch:</span>
                      <div class="branch-selector dropdown-center d-inline-block">
                        <button class="branches nav-link d-inline-block btn dropdown-toggle" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
                          ${branch.name}
                        </button>
                        <div class="dropdown-menu">
                          <form class="mx-3 my-1">
                            <input type="text" class="form-control" id="dropdownBranchSearch" placeholder="Search branches...">
                            <div>
                              <div class="row mt-3">
                                <div class="col">
                                  <label class="form-label">Sort by:</label>
                                </div>
                              </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>
                                </div>
                              </div>
                            </div>
                          </form>
                          <div class="dropdown-divider"></div>
                          <div id="dropdown-branches-results" class="dropdown-branches">
                            ${branchesListItems(branchesWithHrefs, repo.defaultBranch)}
                          </div>
                        </div>
                      </div>
                    </li>
                  </ul>
                </nav>
              </div>
            </div>
            <div class="row">
              <div class="col">
                <nav class="navbar navbar-expand">
                  <ul class="main-nav navbar-nav flex-wrap">
                    <li class="nav-item">
                      <a class="nav-link active" aria-current="page" href="${nav.repoCurrentBranchHome()}">Home</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="${nav.repoCurrentBranchFiles()}">Files</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="${nav.repoCurrentBranchCommits()}">Commits</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="${nav.repoCurrentBranchBranches()}">Branches</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="#">Tags</a>
                    </li>
                  </ul>
                </nav>
              </div>
            </div>

            <div class="row">
              <div class="col-12">
                ${await pageContent(eleventyConfig, data)}
              </div>
            </div>

          </div>
          <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" crossorigin="anonymous"></script>
          <script src="${nav.rootPath()}frontend/main-frontend.bundle.js"></script>
        </body>
      </html>
      `
  }
}