56e04a9df8
ISO build no longer copies netavark from build host (Debian 13/GLIBC 2.41) which broke container networking on Debian 12 targets. Rootfs already installs netavark from Debian 12 repos — just configure the backend. Install RPC now adopts existing containers (from first-boot) instead of erroring on duplicates. Container scanner extracts real versions from image tags and detects available updates against pinned versions. Frontend shows update button with version info when updates are available. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
169 lines
8.8 KiB
Vue
169 lines
8.8 KiB
Vue
<template>
|
|
<div class="space-y-6">
|
|
<!-- App Info Card -->
|
|
<div class="glass-card p-6">
|
|
<h3 class="text-lg font-bold text-white mb-4">{{ t('appDetails.information') }}</h3>
|
|
<div class="space-y-3">
|
|
<div class="flex items-center justify-between py-2 border-b border-white/10">
|
|
<span class="text-white/60 text-sm">{{ t('common.version') }}</span>
|
|
<div class="text-right">
|
|
<span class="text-white font-medium">v{{ pkg.manifest.version }}</span>
|
|
<span v-if="pkg['available-update']" class="text-orange-300 text-xs ml-2">
|
|
v{{ pkg['available-update'] }} available
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div v-if="pkg.manifest.author" class="flex items-center justify-between py-2 border-b border-white/10">
|
|
<span class="text-white/60 text-sm">{{ t('common.developer') }}</span>
|
|
<span class="text-white font-medium">{{ pkg.manifest.author }}</span>
|
|
</div>
|
|
<div class="flex items-center justify-between py-2 border-b border-white/10">
|
|
<span class="text-white/60 text-sm">{{ t('common.status') }}</span>
|
|
<span class="text-white font-medium capitalize">{{ pkg.state }}</span>
|
|
</div>
|
|
<div v-if="pkg.manifest.license" class="flex items-center justify-between py-2 border-b border-white/10">
|
|
<span class="text-white/60 text-sm">{{ t('common.license') }}</span>
|
|
<span class="text-white font-medium">{{ pkg.manifest.license }}</span>
|
|
</div>
|
|
<div class="flex items-center justify-between py-2">
|
|
<span class="text-white/60 text-sm">{{ t('common.category') }}</span>
|
|
<span class="text-white font-medium">App</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Fedimint Services Card -->
|
|
<div v-if="packageKey === 'fedimint'" class="glass-card p-6">
|
|
<h3 class="text-lg font-bold text-white mb-4">{{ t('appDetails.services') }}</h3>
|
|
<div class="space-y-3">
|
|
<div class="flex items-center gap-3 py-2 border-b border-white/10">
|
|
<span class="w-2 h-2 rounded-full" :class="pkg.state === 'running' ? 'bg-green-400' : 'bg-yellow-400'"></span>
|
|
<div class="flex-1">
|
|
<p class="text-white/80 font-medium text-sm">{{ t('appDetails.guardian') }}</p>
|
|
<p class="text-white/50 text-xs capitalize">{{ pkg.state }}</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-center gap-3 py-2">
|
|
<span class="w-2 h-2 rounded-full" :class="gatewayState === 'running' ? 'bg-green-400' : gatewayState === 'stopped' ? 'bg-yellow-400' : 'bg-red-400'"></span>
|
|
<div class="flex-1">
|
|
<p class="text-white/80 font-medium text-sm">{{ t('appDetails.gateway') }}</p>
|
|
<p class="text-white/50 text-xs capitalize">{{ gatewayState }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Access (LAN + Tor) Card -->
|
|
<div v-if="interfaceAddresses" class="glass-card p-6">
|
|
<h3 class="text-lg font-bold text-white mb-4">{{ t('appDetails.access') }}</h3>
|
|
<div class="space-y-3">
|
|
<div v-if="interfaceAddresses['lan-address']" class="flex items-start gap-3">
|
|
<svg class="w-5 h-5 text-green-400 flex-shrink-0 mt-0.5" 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>
|
|
<div class="flex-1 min-w-0">
|
|
<p class="text-white/80 font-medium">{{ t('appDetails.lan') }}</p>
|
|
<a
|
|
:href="lanUrl"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="text-blue-400 hover:text-blue-300 text-sm break-all"
|
|
>
|
|
{{ interfaceAddresses['lan-address'] }}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div v-if="showTorAddress" class="flex items-start gap-3">
|
|
<svg class="w-5 h-5 text-amber-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" />
|
|
</svg>
|
|
<div class="flex-1 min-w-0">
|
|
<p class="text-white/80 font-medium">{{ t('appDetails.tor') }}</p>
|
|
<span class="text-amber-300/90 text-sm font-mono break-all">{{ torUrl }}</span>
|
|
<p class="text-white/50 text-xs mt-1">{{ t('appDetails.requiresTor') }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Requirements Card (hidden for web-only apps) -->
|
|
<div v-if="!isWebOnly" class="glass-card p-6">
|
|
<h3 class="text-lg font-bold text-white mb-4">{{ t('appDetails.requirements') }}</h3>
|
|
<div class="space-y-3">
|
|
<div class="flex items-start gap-3">
|
|
<svg class="w-5 h-5 text-blue-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z" />
|
|
</svg>
|
|
<div class="flex-1">
|
|
<p class="text-white/80 font-medium">{{ t('appDetails.ram') }}</p>
|
|
<p class="text-white/60 text-sm">{{ t('appDetails.ramDesc') }}</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-start gap-3">
|
|
<svg class="w-5 h-5 text-purple-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4" />
|
|
</svg>
|
|
<div class="flex-1">
|
|
<p class="text-white/80 font-medium">{{ t('appDetails.storage') }}</p>
|
|
<p class="text-white/60 text-sm">{{ t('appDetails.storageDesc') }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Links Card -->
|
|
<div class="glass-card p-6">
|
|
<h3 class="text-lg font-bold text-white mb-4">{{ t('appDetails.links') }}</h3>
|
|
<div class="space-y-2">
|
|
<a
|
|
v-if="pkg.manifest.website"
|
|
:href="pkg.manifest.website"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="flex items-center gap-2 text-blue-400 hover:text-blue-300 transition-colors"
|
|
>
|
|
<svg class="w-5 h-5" 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>
|
|
{{ t('appDetails.website') }}
|
|
</a>
|
|
<a
|
|
href="#"
|
|
class="flex items-center gap-2 text-blue-400 hover:text-blue-300 transition-colors"
|
|
>
|
|
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
|
|
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.840 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
|
|
</svg>
|
|
{{ t('appDetails.sourceCode') }}
|
|
</a>
|
|
<a
|
|
href="#"
|
|
class="flex items-center gap-2 text-blue-400 hover:text-blue-300 transition-colors"
|
|
>
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
|
|
</svg>
|
|
{{ t('appDetails.documentation') }}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useI18n } from 'vue-i18n'
|
|
|
|
const { t } = useI18n()
|
|
|
|
defineProps<{
|
|
pkg: Record<string, any>
|
|
packageKey: string
|
|
isWebOnly: boolean
|
|
gatewayState: string
|
|
interfaceAddresses: { 'tor-address': string; 'lan-address': string | null } | null
|
|
lanUrl: string
|
|
torUrl: string
|
|
showTorAddress: boolean
|
|
}>()
|
|
</script>
|