fix: Tor Status label (was Connectivity), remove Discover install banner

- Server.vue: "Connectivity" → "Tor Status" with tor.list-services check
- Discover.vue: removed full-width install progress banner (progress shown inline on cards)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-03-19 16:44:46 +00:00
parent ca65a8172c
commit c78a123e9c
2 changed files with 22 additions and 64 deletions

View File

@@ -78,56 +78,7 @@
</div>
</div>
<!-- Installation Progress Banners -->
<div v-if="installingApps.size > 0" aria-live="polite" class="mb-6 space-y-3">
<div
v-for="[appId, progress] in installingApps"
:key="appId"
class="glass-card p-4 border-l-4"
:class="{
'border-blue-500': progress.status === 'downloading' || progress.status === 'installing',
'border-orange-500': progress.status === 'starting',
'border-green-500': progress.status === 'complete',
'border-red-500': progress.status === 'error'
}"
>
<div class="flex items-center justify-between mb-3">
<div class="flex items-center gap-3">
<svg
v-if="progress.status !== 'complete' && progress.status !== 'error'"
class="animate-spin h-5 w-5 text-blue-400" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
>
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
</svg>
<svg v-else-if="progress.status === 'complete'" class="h-5 w-5 text-green-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
<svg v-else class="h-5 w-5 text-red-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
<div>
<p class="text-white font-medium">{{ progress.title }}</p>
<p class="text-white/70 text-sm">{{ progress.message }}</p>
</div>
</div>
<div class="text-white/60 text-sm">{{ progress.progress }}%</div>
</div>
<div class="w-full bg-white/10 rounded-full h-2 overflow-hidden">
<div
class="h-full rounded-full transition-all duration-500"
:class="{
'bg-gradient-to-r from-blue-500 to-blue-400': progress.status === 'downloading' || progress.status === 'installing',
'bg-gradient-to-r from-orange-500 to-orange-400': progress.status === 'starting',
'bg-gradient-to-r from-green-500 to-green-400': progress.status === 'complete',
'bg-gradient-to-r from-red-500 to-red-400': progress.status === 'error'
}"
:style="{ width: `${progress.progress}%` }"
></div>
</div>
</div>
</div>
<!-- Install progress shown on cards inline, no separate banner -->
<!-- Featured Apps Section (only when no search) -->
<div v-if="!searchQuery" class="mb-10">

View File

@@ -167,9 +167,9 @@
<svg class="w-5 h-5 text-white/60" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9" />
</svg>
<span class="text-white/80 text-sm">Connectivity</span>
<span class="text-white/80 text-sm">Tor</span>
</div>
<span class="text-sm" :class="networkData.torConnected ? 'text-green-400' : 'text-white/60'">{{ networkData.torConnected ? 'Tor Connected' : 'N/A' }}</span>
<span class="text-sm" :class="networkData.torConnected ? 'text-green-400' : 'text-white/60'">{{ networkData.torConnected ? 'Connected' : 'N/A' }}</span>
</div>
<div class="flex items-center justify-between p-3 bg-white/5 rounded-lg">
@@ -520,9 +520,14 @@ const connectedNodes = ref(0)
const servicesRunning = ref(true)
const restarting = ref(false)
// Connectivity status: 'connected' | 'disconnected' | 'checking'
const connectivityStatus = ref<'connected' | 'disconnected' | 'checking'>('connected')
const checkingConnectivity = ref(false)
// Tor status
const torStatusLabel = ref<'running' | 'stopped' | 'checking'>('checking')
const checkingTor = ref(false)
const torStatusColor = computed(() => {
if (torStatusLabel.value === 'running') return 'bg-green-400'
if (torStatusLabel.value === 'checking') return 'bg-yellow-400'
return 'bg-red-400'
})
// Auto-sync toggle
const autoSyncEnabled = ref(true)
@@ -854,7 +859,7 @@ async function cleanupRotatedServices() {
}
onMounted(() => {
checkConnectivity()
checkTorStatus()
loadNetworkData()
loadPeerCount()
loadInterfaces()
@@ -901,21 +906,23 @@ async function restartServices() {
}
restarting.value = false
servicesRunning.value = false
connectivityStatus.value = 'disconnected'
torStatusLabel.value = 'stopped'
}
pollHealth(15)
}
async function checkConnectivity() {
checkingConnectivity.value = true
connectivityStatus.value = 'checking'
async function checkTorStatus() {
checkingTor.value = true
torStatusLabel.value = 'checking'
try {
await rpcClient.call({ method: 'server.health', params: {} })
connectivityStatus.value = 'connected'
const res = await rpcClient.call<{ services: TorServiceInfo[] }>({ method: 'tor.list-services' })
const services = res.services || []
torServices.value = services
torStatusLabel.value = services.some(s => s.onion_address) ? 'running' : 'stopped'
} catch {
connectivityStatus.value = 'disconnected'
torStatusLabel.value = 'stopped'
} finally {
checkingConnectivity.value = false
checkingTor.value = false
}
}