lfg2025/archy
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases 33 Wiki Activity

feat: wire Home Network card to real app store data

Browse Source 
Replace hardcoded "All Running", "Connected", "12" in the Network
overview card with computed values from useAppStore. Services status
reflects actual running/total app counts, connectivity uses WebSocket
connection state, and running apps count is live.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-03-05 07:43:40 +00:00
parent 62aa3be63d
commit 1c797da908
2 changed files with 25 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
neode-ui/src/views/Home.vue
View File

@@ -141,24 +141,24 @@
<div class="home-card-stats space-y-3 mb-4 flex-1 min-h-0">
<div class="flex items-center justify-between p-3 bg-white/5 rounded-lg">
<div class="flex items-center gap-3">
<div class="w-2 h-2 rounded-full bg-green-400"></div>
<div class="w-2 h-2 rounded-full" :class="servicesDotColor"></div>
<span class="text-sm text-white/80">Services Status</span>
</div>
<span class="text-sm text-green-400 font-medium">All Running</span>
<span class="text-sm font-medium" :class="servicesStatusColor">{{ servicesStatusText }}</span>
</div>
<div class="flex items-center justify-between p-3 bg-white/5 rounded-lg">
<div class="flex items-center gap-3">
<div class="w-2 h-2 rounded-full bg-green-400"></div>
<div class="w-2 h-2 rounded-full" :class="connectivityDotColor"></div>
<span class="text-sm text-white/80">Connectivity</span>
</div>
<span class="text-sm text-green-400 font-medium">Connected</span>
<span class="text-sm font-medium" :class="connectivityColor">{{ connectivityText }}</span>
</div>
<div class="flex items-center justify-between p-3 bg-white/5 rounded-lg">
<div class="flex items-center gap-3">
<div class="w-2 h-2 rounded-full bg-blue-400"></div>
<span class="text-sm text-white/80">Connected Nodes</span>
<span class="text-sm text-white/80">Running Apps</span>
</div>
<span class="text-sm text-white/80 font-medium">12</span>
<span class="text-sm text-white/80 font-medium">{{ runningCount }}</span>
</div>
</div>
<div class="home-card-buttons flex gap-2 mt-auto pt-4 shrink-0">
@@ -377,6 +377,24 @@ const runningCount = computed(() =>
Object.values(packages.value).filter(pkg => pkg.state === PackageState.Running).length
)
// Network card computed values
const servicesAllRunning = computed(() =>
appCount.value > 0 && runningCount.value === appCount.value
)
const servicesStatusText = computed(() => {
if (appCount.value === 0) return 'No Apps'
return servicesAllRunning.value ? 'All Running' : `${runningCount.value}/${appCount.value} Running`
})
const servicesStatusColor = computed(() =>
appCount.value === 0 ? 'text-white/60' : servicesAllRunning.value ? 'text-green-400' : 'text-yellow-400'
)
const servicesDotColor = computed(() =>
appCount.value === 0 ? 'bg-white/40' : servicesAllRunning.value ? 'bg-green-400' : 'bg-yellow-400'
)
const connectivityText = computed(() => store.isConnected ? 'Connected' : 'Disconnected')
const connectivityColor = computed(() => store.isConnected ? 'text-green-400' : 'text-red-400')
const connectivityDotColor = computed(() => store.isConnected ? 'bg-green-400' : 'bg-red-400')
// Quick Start Goals dismiss logic
const quickStartDismissed = ref(false)