arnef/nidus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases 3 Activity

feat(web): add file sorting to files browser

Browse Source
This commit is contained in:
arnef
2026-08-31 05:57:35 +02:00
parent 995441e917
commit ea917b4148
6 changed files with 419 additions and 170 deletions
Download Patch File Download Diff File Expand all files Collapse all files
internal/web/templates/files.templ
+29 -4
View File
@@ -16,7 +16,7 @@ type FileEntry struct {
RelPath string // relative path (no leading slash) used to build the link
}
templ FilesPage(username string, breadcrumbs []Breadcrumb, entries []FileEntry, currentPath string) {
templ FilesPage(username string, breadcrumbs []Breadcrumb, entries []FileEntry, currentPath string, sortBy string, sortDir string) {
@Layout("Files", username) {
<div class="flex items-center justify-between mb-6 gap-4 flex-wrap">
<h1 class="text-2xl font-semibold">Files</h1>
@@ -33,6 +33,10 @@ templ FilesPage(username string, breadcrumbs []Breadcrumb, entries []FileEntry,
Upload folder
<input id="upload-folder-input" type="file" webkitdirectory multiple class="hidden"/>
</label>
<select id="sort-select" class="rounded-md border-gray-300 border px-2 py-1.5 text-sm text-gray-700">
<option value="name_asc" selected?={ sortBy == "name" && sortDir == "asc" }>Name (asc)</option>
<option value="name_desc" selected?={ sortBy == "name" && sortDir == "desc" }>Name (desc)</option>
</select>
</div>
</div>
@@ -48,6 +52,8 @@ templ FilesPage(username string, breadcrumbs []Breadcrumb, entries []FileEntry,
id="file-drop-zone"
data-current-path={ currentPath }
data-upload-url={ "/web/files/" + currentPath }
data-sort-by={ sortBy }
data-sort-dir={ sortDir }
class="bg-white rounded-lg border-2 border-dashed border-gray-200 p-2 transition-colors"
>
<!-- Table layout for wider screens (sm and up). -->
@@ -60,9 +66,29 @@ templ FilesPage(username string, breadcrumbs []Breadcrumb, entries []FileEntry,
</colgroup>
<thead>
<tr class="text-left text-gray-400 border-b border-gray-100">
<th class="py-2 px-3 font-medium">Name</th>
<th class="py-2 px-3 font-medium">
if sortBy == "name" {
if sortDir == "asc" {
<a href={ templ.URL("/web/files/" + currentPath + "?sort_by=name&sort_dir=desc") } class="hover:text-indigo-600">Name <span class="ml-1 text-xs">↓</span></a>
} else {
<a href={ templ.URL("/web/files/" + currentPath + "?sort_by=name&sort_dir=asc") } class="hover:text-indigo-600">Name <span class="ml-1 text-xs">↑</span></a>
}
} else {
<a href={ templ.URL("/web/files/" + currentPath + "?sort_by=name&sort_dir=asc") } class="hover:text-indigo-600">Name</a>
}
</th>
<th class="py-2 px-3 font-medium">Size</th>
<th class="py-2 px-3 font-medium">Modified</th>
<th class="py-2 px-3 font-medium">
if sortBy == "modtime" {
if sortDir == "asc" {
<a href={ templ.URL("/web/files/" + currentPath + "?sort_by=modtime&sort_dir=desc") } class="hover:text-indigo-600">Modified <span class="ml-1 text-xs">↓</span></a>
} else {
<a href={ templ.URL("/web/files/" + currentPath + "?sort_by=modtime&sort_dir=asc") } class="hover:text-indigo-600">Modified <span class="ml-1 text-xs">↑</span></a>
}
} else {
<a href={ templ.URL("/web/files/" + currentPath + "?sort_by=modtime&sort_dir=asc") } class="hover:text-indigo-600">Modified</a>
}
</th>
<th class="py-2 px-3 font-medium"></th>
</tr>
</thead>
@@ -163,4 +189,3 @@ templ fileDeleteButton(e FileEntry) {
Delete
</button>
}