tree.templ RawHistoryFolder

1// SPDX-License-Identifier: AGPL-3.0-or-later
2
3package web
4
5// Tree is a directory: the filter, the entries with their last commit, the
6// notes on what is left out, and the README of the directory below.
7templ Tree(l Layout, p TreePage) {
8	@Shell(l, nil) {
9		<div class="filter">
10			<label for="tree-filter">filter&gt;</label>
11			<input
12				id="tree-filter"
13				type="search"
14				data-filter
15				placeholder="this directory  ( / )"
16				autocomplete="off"
17				hx-on:input="let t = this.value.toLowerCase(); q('#tree-rows > tr').arr().forEach(r => r.hidden = !r.textContent.toLowerCase().includes(t)); take('data-cursor', '#tree-rows > tr:not([hidden])')"
18			/>
19		</div>
20		<table class="list tree" aria-label="Entries">
21			<thead>
22				<tr><th class="cur"></th><th class="c-kind"></th><th class="c-name">name</th><th class="c-size">size</th><th class="c-sub">last commit</th><th class="c-who">author</th><th class="c-when">date</th></tr>
23			</thead>
24			<tbody id="tree-rows" data-rows>
25				for _, r := range p.Rows {
26					@TreeRowView(r)
27				}
28			</tbody>
29		</table>
30		if len(p.Rows) == 0 {
31			<p class="lede dim">this directory is empty.</p>
32		}
33		for _, n := range p.Notes {
34			<p class="note">{ n }</p>
35		}
36		if p.Readme != nil {
37			<h2 class="rule-h"><span>{ p.Readme.Name }</span></h2>
38			@ReadmeView(*p.Readme)
39		}
40	}
41}
42
43// TreeRowView is one entry of a directory. Glyph: ▾ directory, @ symbolic
44// link, + submodule, · file.
45templ TreeRowView(r TreeRow) {
46	<tr data-cursor?={ r.Cursor }>
47		<td class="cur" aria-hidden="true"></td>
48		<td class="c-kind" aria-hidden="true">{ r.Glyph }</td>
49		<td class="c-name">
50			if r.Href != "" {
51				<a href={ templ.SafeURL(r.Href) }>{ r.Name }</a>
52			} else {
53				{ r.Name }
54			}
55		</td>
56		<td class="c-size num dim">{ r.Size }</td>
57		<td class="c-sub dim">
58			if r.CHref != "" {
59				<a href={ templ.SafeURL(r.CHref) }>{ r.Subject }</a>
60			}
61		</td>
62		<td class="c-who dim">{ r.Author }</td>
63		<td class="c-when nowrap dim">
64			if r.WhenAt != "" {
65				<time datetime={ r.WhenAt } title={ r.WhenAt }>{ r.When }</time>
66			}
67		</td>
68	</tr>
69}