vstockwell/wraith
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 67 Wiki Activity

fix: add tags input to host modal, pass groupId when creating from group

Browse Source 
- Tags field added to New Host modal (comma separated)
- Clicking + on a group now passes groupId to the new host
- Shows "Adding to: GroupName" in modal when creating from a group
- Refreshes tree after host creation

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Vantz Stockwell 2026-03-13 10:30:29 -04:00
parent ae97bd5a4a
commit 7e347ce378
1 changed files with 19 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
frontend/pages/index.vue
View File

@ -26,6 +26,7 @@ onMounted(async () => {
function openNewHost(groupId?: number) {
editingHost.value = groupId ? { groupId } : null
inlineHost.value = { name: '', hostname: '', port: 22, protocol: 'ssh', groupId: groupId || null, tags: '' }
showHostDialog.value = true
}
@ -112,7 +113,7 @@ function dismissSavePrompt() {
}
// Inline modal state
const inlineHost = ref({ name: '', hostname: '', port: 22, protocol: 'ssh' as 'ssh' | 'rdp' })
const inlineHost = ref({ name: '', hostname: '', port: 22, protocol: 'ssh' as 'ssh' | 'rdp', groupId: null as number | null, tags: '' })
async function createGroupInline() {
const nameEl = document.getElementById('grp-name') as HTMLInputElement
@ -123,14 +124,21 @@ async function createGroupInline() {
async function createHostInline() {
if (!inlineHost.value.name || !inlineHost.value.hostname) return
const tags = inlineHost.value.tags
.split(',')
.map(t => t.trim())
.filter(Boolean)
await connections.createHost({
name: inlineHost.value.name,
hostname: inlineHost.value.hostname,
port: inlineHost.value.port,
protocol: inlineHost.value.protocol,
groupId: inlineHost.value.groupId,
tags,
})
showHostDialog.value = false
inlineHost.value = { name: '', hostname: '', port: 22, protocol: 'ssh' }
inlineHost.value = { name: '', hostname: '', port: 22, protocol: 'ssh', groupId: null, tags: '' }
await connections.fetchTree()
}
// Client-side search filtering
@ -383,6 +391,10 @@ async function deleteSelectedHost() {
</div>
</div>
<div v-else class="space-y-3">
<!-- Show which group this host will be added to -->
<div v-if="inlineHost.groupId" class="text-xs text-gray-500 bg-gray-800 rounded px-2 py-1">
Adding to: <span class="text-gray-300">{{ connections.groups.find((g: any) => g.id === inlineHost.groupId)?.name || 'Group' }}</span>
</div>
<div>
<label class="block text-sm text-gray-400 mb-1">Name</label>
<input v-model="inlineHost.name" type="text" placeholder="My Server"
@ -407,6 +419,11 @@ async function deleteSelectedHost() {
<option value="rdp">RDP</option>
</select>
</div>
<div>
<label class="block text-sm text-gray-400 mb-1">Tags <span class="text-gray-600">(comma separated)</span></label>
<input v-model="inlineHost.tags" type="text" placeholder="ssh, prod, web"
class="w-full px-3 py-2 bg-gray-800 border border-gray-700 rounded text-white" />
</div>
<div class="flex justify-end gap-2 pt-2">
<button @click="showHostDialog = false" class="px-4 py-2 text-sm text-gray-400 hover:text-white">Cancel</button>
<button @click="createHostInline()" class="px-4 py-2 text-sm bg-sky-600 hover:bg-sky-700 text-white rounded">Save</button>