swanadiva/HostKeeper
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: modal scroll, SSH key textarea, nav full-page, remove OS/Provider

Browse Source 
- Fix modal scroll: restructure overlay with scroll/centering wrapper
- Add SSH key textarea + file upload to host modal (authType='key')
- Fix textarea reset on new host (clear via DOM)
- SSH username placeholder instead of default 'root'
- Nav uses plain <a href> instead of HTMX for full-page navigation
- /hosts route returns full page; /hosts/list for HTMX partials
- Remove OS and Provider from host modal, grid card, and list card
- Fix key modal x-data scope for Alpine $dispatch
- Update key_grid to display multi-line key content properly
- Simplify SSH key placeholder format
This commit is contained in:
swanadiva
2026-07-09 18:21:45 +07:00
parent 5445d15aca
commit 56eaf57649
7 changed files with 100 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/backend/views/host_list.html
+6 -13
View File
@@ -20,18 +20,16 @@
<span class="font-medium">{{.Username | default "root"}}@{{if .Hostname}}{{.Hostname}}{{else}}{{.IP}}{{end}}{{if ne .Port 22}}:{{.Port}}{{end}}</span>
</p>
<div class="flex flex-wrap gap-1.5 mb-4">
<span class="px-2 py-0.5 bg-surface-container-low rounded text-[10px] font-medium text-on-surface-variant">{{.OS}}</span>
<span class="px-2 py-0.5 bg-surface-container-low rounded text-[10px] font-medium text-on-surface-variant">{{.Provider}}</span>
{{if .Type}}<span class="px-2 py-0.5 bg-primary-container/10 text-primary rounded text-[10px] font-bold uppercase">{{.Type}}</span>{{end}}
</div>
{{if .Type}}<div class="flex flex-wrap gap-1.5 mb-4">
<span class="px-2 py-0.5 bg-primary-container/10 text-primary rounded text-[10px] font-bold uppercase">{{.Type}}</span>
</div>{{end}}
<div class="pt-3 border-t border-outline-variant/30 flex justify-between items-center text-xs">
<span class="text-outline italic">Last seen {{.LastSeen}}</span>
<div class="flex gap-1">
<a href="/terminal?host={{.ID}}" class="bg-primary text-white hover:bg-primary-container hover:text-on-primary-container font-bold text-xs py-1.5 px-3 rounded-lg transition-all">Connect</a>
<button type="button"
@click="$dispatch('edit-host', { ID: '{{.ID}}', Name: '{{.Name}}', IP: '{{.IP}}', Hostname: '{{.Hostname}}', Port: {{.Port}}, Username: '{{.Username}}', OS: '{{.OS}}', Provider: '{{.Provider}}', Type: '{{.Type}}', AuthType: '{{.AuthType}}', Password: '{{.Password}}', Notes: '{{.Notes}}' })"
@click="$dispatch('edit-host', { ID: '{{.ID}}', Name: '{{.Name}}', IP: '{{.IP}}', Hostname: '{{.Hostname}}', Port: {{.Port}}, Username: '{{.Username}}', Type: '{{.Type}}', AuthType: '{{.AuthType}}', Password: '{{.Password}}', Notes: '{{.Notes}}' })"
class="p-1.5 rounded-lg hover:bg-surface-container text-on-surface-variant hover:text-primary transition-colors" title="Edit">
<svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0115.75 21H5.25A2.25 2.25 0 013 18.75V8.25A2.25 2.25 0 015.25 6H10"/></svg>
</button>
@@ -61,15 +59,11 @@
<div class="w-10 h-10 rounded-lg bg-surface-container-low flex items-center justify-center text-primary shrink-0 border border-outline-variant/20">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M5 12h14M12 5l7 7-7 7"/></svg>
</div>
<div class="min-w-0 flex-1 sm:grid sm:grid-cols-3 sm:gap-4 items-center">
<div class="min-w-0 flex-1 sm:grid sm:grid-cols-2 sm:gap-4 items-center">
<div>
<h4 class="font-bold text-on-surface group-hover:text-primary transition-colors text-sm truncate">{{.Name}}</h4>
<span class="font-mono text-xs text-outline">{{.IP}}</span>
</div>
<div class="hidden sm:block">
<p class="text-xs text-on-surface-variant font-medium">{{.OS}}</p>
<p class="text-[10px] text-outline">{{.Provider}}</p>
</div>
<div class="hidden md:block">
<span class="text-xs text-outline italic">Seen {{.LastSeen}}</span>
</div>
@@ -82,7 +76,7 @@
</span>
<a href="/terminal?host={{.ID}}" class="bg-primary text-white hover:bg-primary-container hover:text-on-primary-container font-bold text-xs py-1.5 px-4 rounded-lg transition-all">Connect</a>
<button type="button"
@click="$dispatch('edit-host', { ID: '{{.ID}}', Name: '{{.Name}}', IP: '{{.IP}}', Hostname: '{{.Hostname}}', Port: {{.Port}}, Username: '{{.Username}}', OS: '{{.OS}}', Provider: '{{.Provider}}', Type: '{{.Type}}', AuthType: '{{.AuthType}}', Password: '{{.Password}}', Notes: '{{.Notes}}' })"
@click="$dispatch('edit-host', { ID: '{{.ID}}', Name: '{{.Name}}', IP: '{{.IP}}', Hostname: '{{.Hostname}}', Port: {{.Port}}, Username: '{{.Username}}', Type: '{{.Type}}', AuthType: '{{.AuthType}}', Password: '{{.Password}}', Notes: '{{.Notes}}' })"
class="p-1.5 rounded-lg hover:bg-surface-container text-on-surface-variant hover:text-primary transition-colors" title="Edit">
<svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0115.75 21H5.25A2.25 2.25 0 013 18.75V8.25A2.25 2.25 0 015.25 6H10"/></svg>
</button>
@@ -110,5 +104,4 @@
</div>
{{end}}
</div>
{{template "host_modal" .}}
{{end}}