fix: indeedhub staging API, nginx caching, nostr identity and UI improvements
Switch IndeedHub to staging API, add _next asset caching in nginx, simplify NostrIdentityPicker component, and update Apps/Web5/Marketplace views. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Dorian
@@ -20,7 +20,7 @@ RUN sed -i 's/reactStrictMode: true,/reactStrictMode: true, output: "standalone"
|
||||
# Build-time environment — connects to Indeehub production services
|
||||
ENV NEXT_PUBLIC_APP_ENVIRONMENT=production
|
||||
ENV NEXT_PUBLIC_APP_URL=http://localhost:8190
|
||||
ENV NEXT_PUBLIC_API_URL=https://api.indeehub.studio
|
||||
ENV NEXT_PUBLIC_API_URL=https://staging-api.indeehub.studio
|
||||
ENV NEXT_PUBLIC_S3_PRIVATE_BUCKET=indeehub-private
|
||||
ENV NEXT_PUBLIC_S3_PUBLIC_BUCKET=indeehub-public
|
||||
ENV NEXT_PUBLIC_ENABLE_APPROVAL_FLOW=false
|
||||
@@ -28,6 +28,12 @@ ENV NEXT_TELEMETRY_DISABLED=1
|
||||
|
||||
# Remove shaka-player .d.ts files that break the build (per package.json build script)
|
||||
RUN rm -f ./node_modules/shaka-player/dist/*.d.ts
|
||||
|
||||
# Patch: make the home page static (no SSR revalidation) so it uses the
|
||||
# pre-rendered Webflow HTML from build time instead of re-fetching every request.
|
||||
# Also add error handling so SSR failures don't crash the page.
|
||||
RUN sed -i '1s|^|export const revalidate = false;\nexport const dynamic = "force-static";\n|' src/app/page.tsx
|
||||
|
||||
RUN npm run build
|
||||
|
||||
# ── Stage 3: Runner ──
|
||||
|
||||
@@ -331,6 +331,13 @@ server {
|
||||
sub_filter_once on;
|
||||
sub_filter '</head>' '<script src="/nostr-provider.js"></script></head>';
|
||||
}
|
||||
location /app/indeedhub/_next/ {
|
||||
proxy_pass http://127.0.0.1:8190/_next/;
|
||||
proxy_http_version 1.1;
|
||||
proxy_set_header Host $host;
|
||||
proxy_cache_valid 200 30d;
|
||||
add_header Cache-Control "public, max-age=2592000, immutable";
|
||||
}
|
||||
location /app/indeedhub/ {
|
||||
proxy_pass http://127.0.0.1:8190/;
|
||||
proxy_http_version 1.1;
|
||||
@@ -342,7 +349,10 @@ server {
|
||||
proxy_hide_header Content-Security-Policy;
|
||||
add_header X-Content-Type-Options "nosniff" always;
|
||||
proxy_set_header Accept-Encoding "";
|
||||
sub_filter_once on;
|
||||
sub_filter_types text/html;
|
||||
sub_filter_once off;
|
||||
sub_filter '/_next/' '/app/indeedhub/_next/';
|
||||
sub_filter '/favicon.ico' '/app/indeedhub/favicon.ico';
|
||||
sub_filter '</head>' '<script src="/nostr-provider.js"></script></head>';
|
||||
}
|
||||
location /app/lnd/ {
|
||||
|
||||
@@ -231,6 +231,13 @@ location /app/electrs/ {
|
||||
sub_filter_once on;
|
||||
sub_filter '</head>' '<script src="/nostr-provider.js"></script></head>';
|
||||
}
|
||||
location /app/indeedhub/_next/ {
|
||||
proxy_pass http://127.0.0.1:8190/_next/;
|
||||
proxy_http_version 1.1;
|
||||
proxy_set_header Host $host;
|
||||
proxy_cache_valid 200 30d;
|
||||
add_header Cache-Control "public, max-age=2592000, immutable";
|
||||
}
|
||||
location /app/indeedhub/ {
|
||||
proxy_pass http://127.0.0.1:8190/;
|
||||
proxy_http_version 1.1;
|
||||
@@ -241,7 +248,10 @@ location /app/indeedhub/ {
|
||||
proxy_hide_header X-Frame-Options;
|
||||
proxy_hide_header Content-Security-Policy;
|
||||
proxy_set_header Accept-Encoding "";
|
||||
sub_filter_once on;
|
||||
sub_filter_types text/html;
|
||||
sub_filter_once off;
|
||||
sub_filter '/_next/' '/app/indeedhub/_next/';
|
||||
sub_filter '/favicon.ico' '/app/indeedhub/favicon.ico';
|
||||
sub_filter '</head>' '<script src="/nostr-provider.js"></script></head>';
|
||||
}
|
||||
location /app/nginx-proxy-manager/ {
|
||||
|
||||
@@ -6,15 +6,8 @@
|
||||
class="fixed inset-0 z-[3100] flex items-center justify-center p-4"
|
||||
@click="$emit('cancel')"
|
||||
>
|
||||
<!-- Backdrop with animated scan lines -->
|
||||
<div class="absolute inset-0 bg-black/80 backdrop-blur-md identity-picker-backdrop"></div>
|
||||
|
||||
<!-- Floating binary rain particles (CSS-only) -->
|
||||
<div class="absolute inset-0 overflow-hidden pointer-events-none">
|
||||
<div v-for="i in 20" :key="i" class="cyber-particle" :style="particleStyle(i)">
|
||||
{{ particleChar(i) }}
|
||||
</div>
|
||||
</div>
|
||||
<!-- Backdrop -->
|
||||
<div class="absolute inset-0 bg-black/60 backdrop-blur-md"></div>
|
||||
|
||||
<!-- Main panel -->
|
||||
<div
|
||||
@@ -22,56 +15,52 @@
|
||||
@click.stop
|
||||
class="relative z-10 w-full max-w-lg"
|
||||
>
|
||||
<!-- Cypherpunk header graphic -->
|
||||
<!-- Header with animated key icon -->
|
||||
<div class="relative mb-6 flex flex-col items-center">
|
||||
<!-- SVG keyhole / identity node graphic -->
|
||||
<div class="cyber-glow-ring">
|
||||
<svg viewBox="0 0 120 120" class="w-24 h-24" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- Outer ring with dash animation -->
|
||||
<circle cx="60" cy="60" r="54" fill="none" stroke="rgba(251,146,60,0.3)" stroke-width="1" />
|
||||
<circle cx="60" cy="60" r="54" fill="none" stroke="#fb923c" stroke-width="2"
|
||||
stroke-dasharray="8 4" class="cyber-ring-spin" />
|
||||
<div class="key-glow-ring">
|
||||
<svg viewBox="0 0 120 120" class="w-20 h-20" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- Outer ring -->
|
||||
<circle cx="60" cy="60" r="54" fill="none" stroke="rgba(251,146,60,0.2)" stroke-width="1" />
|
||||
<circle cx="60" cy="60" r="54" fill="none" stroke="#fb923c" stroke-width="1.5"
|
||||
stroke-dasharray="8 6" class="ring-spin" />
|
||||
<!-- Inner ring -->
|
||||
<circle cx="60" cy="60" r="38" fill="none" stroke="rgba(251,146,60,0.15)" stroke-width="1" />
|
||||
<circle cx="60" cy="60" r="38" fill="none" stroke="#fb923c" stroke-width="1.5"
|
||||
stroke-dasharray="4 8" class="cyber-ring-spin-reverse" />
|
||||
<!-- Key icon center -->
|
||||
<g transform="translate(60,60)">
|
||||
<!-- Key head (circle) -->
|
||||
<circle cx="60" cy="60" r="38" fill="none" stroke="rgba(251,146,60,0.1)" stroke-width="1" />
|
||||
<circle cx="60" cy="60" r="38" fill="none" stroke="#fb923c" stroke-width="1"
|
||||
stroke-dasharray="4 8" class="ring-spin-reverse" />
|
||||
<!-- Key icon -->
|
||||
<g transform="translate(60,60)" class="key-breathe">
|
||||
<circle cx="0" cy="-8" r="10" fill="none" stroke="#fb923c" stroke-width="2" />
|
||||
<circle cx="0" cy="-8" r="4" fill="#fb923c" opacity="0.4" />
|
||||
<!-- Key shaft -->
|
||||
<line x1="0" y1="2" x2="0" y2="22" stroke="#fb923c" stroke-width="2" />
|
||||
<!-- Key teeth -->
|
||||
<line x1="0" y1="14" x2="6" y2="14" stroke="#fb923c" stroke-width="2" />
|
||||
<line x1="0" y1="19" x2="4" y2="19" stroke="#fb923c" stroke-width="2" />
|
||||
</g>
|
||||
<!-- Network nodes -->
|
||||
<circle cx="16" cy="28" r="2" fill="#fb923c" opacity="0.6" />
|
||||
<circle cx="104" cy="32" r="2" fill="#fb923c" opacity="0.6" />
|
||||
<circle cx="20" cy="92" r="2" fill="#fb923c" opacity="0.6" />
|
||||
<circle cx="100" cy="88" r="2" fill="#fb923c" opacity="0.6" />
|
||||
<!-- Connection lines to center -->
|
||||
<line x1="16" y1="28" x2="40" y2="48" stroke="#fb923c" stroke-width="0.5" opacity="0.3" />
|
||||
<line x1="104" y1="32" x2="80" y2="48" stroke="#fb923c" stroke-width="0.5" opacity="0.3" />
|
||||
<line x1="20" y1="92" x2="40" y2="72" stroke="#fb923c" stroke-width="0.5" opacity="0.3" />
|
||||
<line x1="100" y1="88" x2="80" y2="72" stroke="#fb923c" stroke-width="0.5" opacity="0.3" />
|
||||
<!-- Network dots -->
|
||||
<circle cx="16" cy="28" r="2" fill="#fb923c" opacity="0.5" class="node-pulse" style="--pulse-delay: 0s" />
|
||||
<circle cx="104" cy="32" r="2" fill="#fb923c" opacity="0.5" class="node-pulse" style="--pulse-delay: 0.5s" />
|
||||
<circle cx="20" cy="92" r="2" fill="#fb923c" opacity="0.5" class="node-pulse" style="--pulse-delay: 1s" />
|
||||
<circle cx="100" cy="88" r="2" fill="#fb923c" opacity="0.5" class="node-pulse" style="--pulse-delay: 1.5s" />
|
||||
<!-- Connection lines -->
|
||||
<line x1="16" y1="28" x2="40" y2="48" stroke="#fb923c" stroke-width="0.5" opacity="0.2" />
|
||||
<line x1="104" y1="32" x2="80" y2="48" stroke="#fb923c" stroke-width="0.5" opacity="0.2" />
|
||||
<line x1="20" y1="92" x2="40" y2="72" stroke="#fb923c" stroke-width="0.5" opacity="0.2" />
|
||||
<line x1="100" y1="88" x2="80" y2="72" stroke="#fb923c" stroke-width="0.5" opacity="0.2" />
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<h2 class="mt-4 text-xl font-bold text-white tracking-wide">SELECT IDENTITY</h2>
|
||||
<p class="mt-1 text-xs text-orange-400/70 font-mono tracking-widest uppercase">Nostr Authentication Protocol</p>
|
||||
<h2 class="mt-4 text-lg font-semibold text-white">Select Identity</h2>
|
||||
<p class="mt-1 text-xs text-white/50">Nostr authentication protocol</p>
|
||||
</div>
|
||||
|
||||
<!-- Identity list -->
|
||||
<div class="cyber-panel p-4 space-y-3 max-h-[50vh] overflow-y-auto">
|
||||
<!-- Loading state -->
|
||||
<div class="glass-card p-4 space-y-3 max-h-[50vh] overflow-y-auto">
|
||||
<!-- Loading -->
|
||||
<div v-if="loading" class="flex items-center justify-center py-8">
|
||||
<svg class="animate-spin h-6 w-6 text-orange-400" viewBox="0 0 24 24" fill="none">
|
||||
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
|
||||
<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" />
|
||||
</svg>
|
||||
<span class="ml-3 text-white/60 text-sm font-mono">Loading identities...</span>
|
||||
<span class="ml-3 text-white/60 text-sm">Loading identities...</span>
|
||||
</div>
|
||||
|
||||
<!-- No identities -->
|
||||
@@ -85,28 +74,33 @@
|
||||
v-for="identity in identities"
|
||||
:key="identity.id"
|
||||
type="button"
|
||||
class="cyber-identity-card w-full text-left"
|
||||
:class="{ 'cyber-identity-selected': selectedId === identity.id }"
|
||||
class="w-full text-left p-3 rounded-lg border transition-all duration-200"
|
||||
:class="selectedId === identity.id
|
||||
? 'bg-orange-500/10 border-orange-500/30'
|
||||
: 'bg-white/5 border-white/10 hover:bg-white/8 hover:border-white/15'"
|
||||
@click="selectedId = identity.id"
|
||||
>
|
||||
<div class="flex items-center gap-3">
|
||||
<!-- Identity avatar -->
|
||||
<div class="cyber-avatar" :class="purposeColor(identity.purpose)">
|
||||
<!-- Avatar -->
|
||||
<div
|
||||
class="w-9 h-9 rounded-lg flex items-center justify-center shrink-0 border"
|
||||
:class="avatarClasses(identity.purpose)"
|
||||
>
|
||||
<span class="text-sm font-bold">{{ identity.name.charAt(0).toUpperCase() }}</span>
|
||||
</div>
|
||||
|
||||
<div class="flex-1 min-w-0">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-white font-semibold text-sm truncate">{{ identity.name }}</span>
|
||||
<span v-if="identity.is_default" class="text-[10px] px-1.5 py-0.5 rounded bg-orange-500/20 text-orange-400 font-mono">DEFAULT</span>
|
||||
<span v-if="identity.is_default" class="text-[10px] px-1.5 py-0.5 rounded bg-orange-500/20 text-orange-400">default</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 mt-0.5">
|
||||
<div class="mt-0.5">
|
||||
<span v-if="identity.nostr_npub" class="text-white/40 text-xs font-mono truncate">{{ truncateNpub(identity.nostr_npub) }}</span>
|
||||
<span v-else class="text-red-400/60 text-xs font-mono">NO NOSTR KEY</span>
|
||||
<span v-else class="text-red-400/60 text-xs">No Nostr key</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Selection indicator -->
|
||||
<!-- Radio indicator -->
|
||||
<div class="shrink-0">
|
||||
<div v-if="selectedId === identity.id" class="w-5 h-5 rounded-full bg-orange-500/30 border border-orange-400 flex items-center justify-center">
|
||||
<div class="w-2.5 h-2.5 rounded-full bg-orange-400"></div>
|
||||
@@ -117,26 +111,28 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Action buttons -->
|
||||
<!-- Actions -->
|
||||
<div class="flex gap-3 mt-4">
|
||||
<button @click="$emit('cancel')" class="cyber-btn flex-1 py-3 text-sm font-medium">
|
||||
CANCEL
|
||||
<button @click="$emit('cancel')" class="glass-button flex-1 py-3 rounded-lg text-sm font-medium text-white/80">
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
@click="confirm"
|
||||
:disabled="!selectedId || !hasNostrKey"
|
||||
class="cyber-btn-primary flex-1 py-3 text-sm font-bold"
|
||||
class="flex-1 py-3 rounded-lg text-sm font-semibold transition-all duration-200 disabled:opacity-30 disabled:cursor-not-allowed"
|
||||
:class="selectedId && hasNostrKey
|
||||
? 'bg-orange-500/20 border border-orange-500/40 text-orange-400 hover:bg-orange-500/30'
|
||||
: 'bg-white/5 border border-white/10 text-white/40'"
|
||||
>
|
||||
<svg class="w-4 h-4 mr-1.5 inline-block" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 7a2 2 0 012 2m4 0a6 6 0 01-7.743 5.743L11 17H9v2H7v2H4a1 1 0 01-1-1v-2.586a1 1 0 01.293-.707l5.964-5.964A6 6 0 1121 9z" />
|
||||
</svg>
|
||||
AUTHENTICATE
|
||||
Authenticate
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Footer info line -->
|
||||
<p class="mt-3 text-center text-[10px] text-white/25 font-mono tracking-wider">
|
||||
NIP-07 · SECP256K1 · SIGNED LOCALLY
|
||||
<p class="mt-3 text-center text-[10px] text-white/25 tracking-wider">
|
||||
NIP-07 · SECP256K1 · Signed locally
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -197,7 +193,6 @@ async function loadIdentities() {
|
||||
try {
|
||||
const res = await rpcClient.call<{ identities: Identity[] }>({ method: 'identity.list' })
|
||||
identities.value = res.identities || []
|
||||
// Auto-select the default identity or first one with a Nostr key
|
||||
const defaultId = identities.value.find(i => i.is_default && i.nostr_pubkey)
|
||||
|| identities.value.find(i => i.nostr_pubkey)
|
||||
if (defaultId) {
|
||||
@@ -222,97 +217,41 @@ function truncateNpub(npub: string): string {
|
||||
return npub.slice(0, 12) + '...' + npub.slice(-6)
|
||||
}
|
||||
|
||||
function purposeColor(purpose: string): string {
|
||||
function avatarClasses(purpose: string): string {
|
||||
switch (purpose) {
|
||||
case 'business': return 'cyber-avatar-blue'
|
||||
case 'anonymous': return 'cyber-avatar-purple'
|
||||
default: return 'cyber-avatar-orange'
|
||||
case 'business': return 'bg-blue-500/15 text-blue-400 border-blue-500/25'
|
||||
case 'anonymous': return 'bg-purple-500/15 text-purple-400 border-purple-500/25'
|
||||
default: return 'bg-orange-500/15 text-orange-400 border-orange-500/25'
|
||||
}
|
||||
}
|
||||
|
||||
function particleStyle(i: number): Record<string, string> {
|
||||
const left = ((i * 37 + 13) % 100)
|
||||
const delay = ((i * 1.3) % 8).toFixed(1)
|
||||
const duration = (6 + (i % 5) * 2).toFixed(1)
|
||||
const size = 10 + (i % 3) * 2
|
||||
return {
|
||||
left: `${left}%`,
|
||||
animationDelay: `${delay}s`,
|
||||
animationDuration: `${duration}s`,
|
||||
fontSize: `${size}px`,
|
||||
}
|
||||
}
|
||||
|
||||
function particleChar(i: number): string {
|
||||
const chars = '01アイウエオカキクケコ暗号鍵身元'
|
||||
return chars[i % chars.length] ?? '0'
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* Animated scan line on backdrop */
|
||||
.identity-picker-backdrop::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: repeating-linear-gradient(
|
||||
0deg,
|
||||
transparent,
|
||||
transparent 2px,
|
||||
rgba(251, 146, 60, 0.015) 2px,
|
||||
rgba(251, 146, 60, 0.015) 4px
|
||||
);
|
||||
pointer-events: none;
|
||||
animation: scanlines 8s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes scanlines {
|
||||
0% { transform: translateY(0); }
|
||||
100% { transform: translateY(4px); }
|
||||
}
|
||||
|
||||
/* Floating binary/katakana particles */
|
||||
.cyber-particle {
|
||||
position: absolute;
|
||||
top: -20px;
|
||||
color: rgba(251, 146, 60, 0.12);
|
||||
font-family: monospace;
|
||||
animation: particle-fall linear infinite;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@keyframes particle-fall {
|
||||
0% { transform: translateY(-20px); opacity: 0; }
|
||||
10% { opacity: 1; }
|
||||
90% { opacity: 1; }
|
||||
100% { transform: translateY(calc(100vh + 20px)); opacity: 0; }
|
||||
}
|
||||
|
||||
/* Glowing ring around the SVG icon */
|
||||
.cyber-glow-ring {
|
||||
/* Glow ring around key icon */
|
||||
.key-glow-ring {
|
||||
position: relative;
|
||||
padding: 8px;
|
||||
}
|
||||
.cyber-glow-ring::before {
|
||||
.key-glow-ring::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
border-radius: 50%;
|
||||
background: radial-gradient(circle, rgba(251, 146, 60, 0.1) 0%, transparent 70%);
|
||||
background: radial-gradient(circle, rgba(251, 146, 60, 0.12) 0%, transparent 70%);
|
||||
animation: glow-pulse 3s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes glow-pulse {
|
||||
0%, 100% { opacity: 0.5; transform: scale(1); }
|
||||
50% { opacity: 1; transform: scale(1.1); }
|
||||
0%, 100% { opacity: 0.4; transform: scale(1); }
|
||||
50% { opacity: 1; transform: scale(1.15); }
|
||||
}
|
||||
|
||||
/* SVG ring animations */
|
||||
.cyber-ring-spin {
|
||||
/* Rotating rings */
|
||||
.ring-spin {
|
||||
animation: ring-rotate 20s linear infinite;
|
||||
transform-origin: 60px 60px;
|
||||
}
|
||||
.cyber-ring-spin-reverse {
|
||||
.ring-spin-reverse {
|
||||
animation: ring-rotate 15s linear infinite reverse;
|
||||
transform-origin: 60px 60px;
|
||||
}
|
||||
@@ -322,97 +261,26 @@ function particleChar(i: number): string {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* Main panel */
|
||||
.cyber-panel {
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
border: 1px solid rgba(251, 146, 60, 0.15);
|
||||
border-radius: 12px;
|
||||
backdrop-filter: blur(24px);
|
||||
box-shadow:
|
||||
0 0 30px rgba(251, 146, 60, 0.05),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.05);
|
||||
/* Key breathing animation */
|
||||
.key-breathe {
|
||||
animation: breathe 4s ease-in-out infinite;
|
||||
transform-origin: 0 6px;
|
||||
}
|
||||
|
||||
/* Identity cards */
|
||||
.cyber-identity-card {
|
||||
display: block;
|
||||
padding: 12px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.06);
|
||||
background: rgba(255, 255, 255, 0.02);
|
||||
transition: all 0.2s ease;
|
||||
cursor: pointer;
|
||||
}
|
||||
.cyber-identity-card:hover {
|
||||
background: rgba(251, 146, 60, 0.05);
|
||||
border-color: rgba(251, 146, 60, 0.15);
|
||||
}
|
||||
.cyber-identity-selected {
|
||||
background: rgba(251, 146, 60, 0.08) !important;
|
||||
border-color: rgba(251, 146, 60, 0.3) !important;
|
||||
box-shadow: 0 0 12px rgba(251, 146, 60, 0.08);
|
||||
@keyframes breathe {
|
||||
0%, 100% { opacity: 0.8; transform: scale(1); }
|
||||
50% { opacity: 1; transform: scale(1.05); }
|
||||
}
|
||||
|
||||
/* Avatar badges */
|
||||
.cyber-avatar {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.cyber-avatar-orange {
|
||||
background: rgba(251, 146, 60, 0.15);
|
||||
color: #fb923c;
|
||||
border: 1px solid rgba(251, 146, 60, 0.25);
|
||||
}
|
||||
.cyber-avatar-blue {
|
||||
background: rgba(59, 130, 246, 0.15);
|
||||
color: #3b82f6;
|
||||
border: 1px solid rgba(59, 130, 246, 0.25);
|
||||
}
|
||||
.cyber-avatar-purple {
|
||||
background: rgba(168, 85, 247, 0.15);
|
||||
color: #a855f7;
|
||||
border: 1px solid rgba(168, 85, 247, 0.25);
|
||||
/* Network node pulse */
|
||||
.node-pulse {
|
||||
animation: node-blink 3s ease-in-out infinite;
|
||||
animation-delay: var(--pulse-delay, 0s);
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.cyber-btn {
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 8px;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
transition: all 0.2s ease;
|
||||
font-family: monospace;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
.cyber-btn:hover {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.2);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.cyber-btn-primary {
|
||||
background: rgba(251, 146, 60, 0.15);
|
||||
border: 1px solid rgba(251, 146, 60, 0.3);
|
||||
border-radius: 8px;
|
||||
color: #fb923c;
|
||||
transition: all 0.2s ease;
|
||||
font-family: monospace;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
.cyber-btn-primary:hover:not(:disabled) {
|
||||
background: rgba(251, 146, 60, 0.25);
|
||||
border-color: rgba(251, 146, 60, 0.5);
|
||||
box-shadow: 0 0 20px rgba(251, 146, 60, 0.15);
|
||||
color: #fdba74;
|
||||
}
|
||||
.cyber-btn-primary:disabled {
|
||||
opacity: 0.3;
|
||||
cursor: not-allowed;
|
||||
@keyframes node-blink {
|
||||
0%, 100% { opacity: 0.3; }
|
||||
50% { opacity: 0.8; r: 3; }
|
||||
}
|
||||
|
||||
/* Transition */
|
||||
|
||||
@@ -12,6 +12,7 @@
|
||||
"install": "Install",
|
||||
"installing": "Installing...",
|
||||
"uninstall": "Uninstall",
|
||||
"uninstalling": "Uninstalling...",
|
||||
"start": "Start",
|
||||
"stop": "Stop",
|
||||
"restart": "Restart",
|
||||
|
||||
@@ -12,6 +12,7 @@
|
||||
"install": "Instalar",
|
||||
"installing": "Instalando...",
|
||||
"uninstall": "Desinstalar",
|
||||
"uninstalling": "Desinstalando...",
|
||||
"start": "Iniciar",
|
||||
"stop": "Detener",
|
||||
"restart": "Reiniciar",
|
||||
|
||||
@@ -179,14 +179,14 @@
|
||||
class="fixed inset-0 z-50 flex items-center justify-center p-4"
|
||||
@click="closeUninstallModal()"
|
||||
>
|
||||
<div class="absolute inset-0 bg-black/10 backdrop-blur-md"></div>
|
||||
<div class="absolute inset-0 bg-black/60 backdrop-blur-md"></div>
|
||||
<div
|
||||
ref="uninstallModalRef"
|
||||
@click.stop
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="uninstall-dialog-title"
|
||||
class="glass-card p-6 max-w-md w-full relative z-10"
|
||||
class="glass-card p-6 max-w-2xl w-full relative z-10"
|
||||
>
|
||||
<div class="flex items-start gap-4 mb-4">
|
||||
<div class="p-3 bg-red-500/20 rounded-lg">
|
||||
@@ -211,9 +211,20 @@
|
||||
</button>
|
||||
<button
|
||||
@click="confirmUninstall"
|
||||
class="px-4 py-2 bg-red-600/80 hover:bg-red-600 rounded-lg text-white text-sm font-medium transition-colors"
|
||||
:disabled="uninstalling"
|
||||
class="px-4 py-2 bg-red-600/80 hover:bg-red-600 rounded-lg text-white text-sm font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2"
|
||||
>
|
||||
{{ t('common.uninstall') }}
|
||||
<svg
|
||||
v-if="uninstalling"
|
||||
class="animate-spin h-4 w-4"
|
||||
aria-hidden="true"
|
||||
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>
|
||||
<span>{{ uninstalling ? t('common.uninstalling') : t('common.uninstall') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -495,15 +506,21 @@ function showUninstallModal(id: string, pkg: PackageDataEntry) {
|
||||
}
|
||||
}
|
||||
|
||||
const uninstalling = ref(false)
|
||||
|
||||
async function confirmUninstall() {
|
||||
const { appId } = uninstallModal.value
|
||||
uninstallModal.value.show = false
|
||||
|
||||
uninstalling.value = true
|
||||
|
||||
try {
|
||||
await store.uninstallPackage(appId)
|
||||
uninstallModal.value.show = false
|
||||
} catch (err) {
|
||||
if (import.meta.env.DEV) console.error('Failed to uninstall app:', err)
|
||||
showActionError(`Failed to uninstall app: ${err instanceof Error ? err.message : 'Unknown error'}`)
|
||||
uninstallModal.value.show = false
|
||||
} finally {
|
||||
uninstalling.value = false
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -654,8 +654,7 @@ const WEB_ONLY_APP_URLS: Record<string, string> = {
|
||||
/** App ID to port-based URL for container apps */
|
||||
const APP_LAUNCH_URLS: Record<string, string> = {
|
||||
'bitcoin-knots': 'http://localhost:8334',
|
||||
'electrs': 'http://localhost:50002',
|
||||
'btcpay-server': 'http://localhost:23000',
|
||||
'btcpay-server': 'http://localhost:23000',
|
||||
'lnd': 'http://localhost:8081',
|
||||
'mempool': 'http://localhost:4080',
|
||||
'homeassistant': 'http://localhost:8123',
|
||||
@@ -732,7 +731,7 @@ async function loadCommunityMarketplace() {
|
||||
|
||||
// Get app tier classification (matches backend get_app_tier)
|
||||
function getAppTier(appId: string): string {
|
||||
const core = ['bitcoin-knots', 'bitcoin', 'lnd', 'mempool', 'electrs', 'btcpay-server', 'dwn', 'filebrowser']
|
||||
const core = ['bitcoin-knots', 'bitcoin', 'lnd', 'mempool', 'btcpay-server', 'dwn', 'filebrowser']
|
||||
const recommended = ['fedimint', 'vaultwarden', 'uptime-kuma', 'grafana', 'searxng', 'tailscale', 'portainer']
|
||||
if (core.includes(appId)) return 'core'
|
||||
if (recommended.includes(appId)) return 'recommended'
|
||||
@@ -753,17 +752,6 @@ function getCuratedAppList() {
|
||||
manifestUrl: undefined,
|
||||
repoUrl: 'https://github.com/bitcoinknots/bitcoin'
|
||||
},
|
||||
{
|
||||
id: 'electrs',
|
||||
title: 'Electrs',
|
||||
version: '0.4.1',
|
||||
description: 'Electrum protocol indexer for Bitcoin. Powers Mempool and other Electrum clients. Requires Bitcoin Knots or Bitcoin Core.',
|
||||
icon: '/assets/img/app-icons/electrs.svg',
|
||||
author: 'Roman Zeyde',
|
||||
dockerImage: 'docker.io/mempool/electrs:v0.4.1',
|
||||
manifestUrl: undefined,
|
||||
repoUrl: 'https://github.com/romanz/electrs'
|
||||
},
|
||||
{
|
||||
id: 'btcpay-server',
|
||||
title: 'BTCPay Server',
|
||||
|
||||
@@ -218,7 +218,7 @@
|
||||
<!-- Send Message Modal -->
|
||||
<Teleport to="body">
|
||||
<div v-if="showSendMessageModal" class="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/60 backdrop-blur-md" @click.self="closeSendMessageModal()">
|
||||
<div ref="sendMessageModalRef" class="glass-card p-6 max-w-md w-full max-h-[90vh] overflow-y-auto">
|
||||
<div ref="sendMessageModalRef" class="glass-card p-6 max-w-2xl w-full max-h-[90vh] overflow-y-auto">
|
||||
<h3 class="text-lg font-semibold text-white mb-4">{{ t('web5.sendMessageTitle') }}</h3>
|
||||
<p class="text-white/70 text-sm mb-4">Messages are sent over the Tor network to the selected peer.</p>
|
||||
<div class="space-y-4">
|
||||
@@ -1034,7 +1034,7 @@
|
||||
<!-- Add Content Modal -->
|
||||
<Teleport to="body">
|
||||
<div v-if="showAddContentModal" class="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-md" @click.self="showAddContentModal = false" @keydown.escape="showAddContentModal = false">
|
||||
<div class="glass-card p-6 w-full max-w-md mx-4" role="dialog" aria-modal="true" aria-labelledby="add-content-title">
|
||||
<div class="glass-card p-6 w-full max-w-2xl mx-4 max-h-[90vh] overflow-y-auto" role="dialog" aria-modal="true" aria-labelledby="add-content-title">
|
||||
<h2 id="add-content-title" class="text-lg font-bold text-white mb-4">{{ t('web5.addContentTitle') }}</h2>
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
@@ -1202,7 +1202,7 @@
|
||||
|
||||
<!-- Create Identity Modal -->
|
||||
<div v-if="showCreateIdentityModal" class="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-md" @click.self="showCreateIdentityModal = false" @keydown.escape="showCreateIdentityModal = false">
|
||||
<div class="glass-card p-6 w-full max-w-md mx-4" role="dialog" aria-modal="true" aria-labelledby="create-identity-title">
|
||||
<div class="glass-card p-6 w-full max-w-2xl mx-4 max-h-[90vh] overflow-y-auto" role="dialog" aria-modal="true" aria-labelledby="create-identity-title">
|
||||
<h2 id="create-identity-title" class="text-lg font-bold text-white mb-4">{{ t('web5.createIdentityTitle') }}</h2>
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
@@ -1236,7 +1236,7 @@
|
||||
|
||||
<!-- Delete Confirmation Modal -->
|
||||
<div v-if="deleteIdentityTarget" class="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-md" @click.self="deleteIdentityTarget = null" @keydown.escape="deleteIdentityTarget = null">
|
||||
<div class="glass-card p-6 w-full max-w-sm mx-4" role="dialog" aria-modal="true" aria-labelledby="delete-identity-title">
|
||||
<div class="glass-card p-6 w-full max-w-2xl mx-4 max-h-[90vh] overflow-y-auto" role="dialog" aria-modal="true" aria-labelledby="delete-identity-title">
|
||||
<h2 id="delete-identity-title" class="text-lg font-bold text-white mb-2">{{ t('web5.deleteIdentityTitle') }}</h2>
|
||||
<p class="text-white/60 text-sm mb-4">{{ t('web5.deleteIdentityConfirm') }}</p>
|
||||
<div class="flex gap-3">
|
||||
@@ -1249,7 +1249,7 @@
|
||||
</div>
|
||||
<!-- Unified Send Modal -->
|
||||
<div v-if="showUnifiedSendModal" class="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-md" @click.self="closeUnifiedSendModal" @keydown.escape="closeUnifiedSendModal">
|
||||
<div class="glass-card p-6 w-full max-w-md mx-4" role="dialog" aria-modal="true" aria-labelledby="send-bitcoin-title">
|
||||
<div class="glass-card p-6 w-full max-w-2xl mx-4 max-h-[90vh] overflow-y-auto" role="dialog" aria-modal="true" aria-labelledby="send-bitcoin-title">
|
||||
<h2 id="send-bitcoin-title" class="text-lg font-bold text-white mb-4">{{ t('web5.sendBitcoinTitle') }}</h2>
|
||||
|
||||
<!-- Method tabs -->
|
||||
@@ -1349,7 +1349,7 @@
|
||||
|
||||
<!-- Unified Receive Modal -->
|
||||
<div v-if="showUnifiedReceiveModal" class="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-md" @click.self="closeUnifiedReceiveModal" @keydown.escape="closeUnifiedReceiveModal">
|
||||
<div class="glass-card p-6 w-full max-w-md mx-4" role="dialog" aria-modal="true" aria-labelledby="receive-bitcoin-title">
|
||||
<div class="glass-card p-6 w-full max-w-2xl mx-4 max-h-[90vh] overflow-y-auto" role="dialog" aria-modal="true" aria-labelledby="receive-bitcoin-title">
|
||||
<h2 id="receive-bitcoin-title" class="text-lg font-bold text-white mb-4">{{ t('web5.receiveBitcoinTitle') }}</h2>
|
||||
|
||||
<!-- Method tabs -->
|
||||
@@ -1642,7 +1642,7 @@
|
||||
|
||||
<!-- Domains Management Modal -->
|
||||
<div v-if="showDomainsModal" class="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-md" @click.self="showDomainsModal = false" @keydown.escape="showDomainsModal = false">
|
||||
<div class="glass-card p-6 w-full max-w-lg mx-4 max-h-[80vh] overflow-y-auto" role="dialog" aria-modal="true" aria-labelledby="domains-title">
|
||||
<div class="glass-card p-6 w-full max-w-2xl mx-4 max-h-[90vh] overflow-y-auto" role="dialog" aria-modal="true" aria-labelledby="domains-title">
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<h2 id="domains-title" class="text-lg font-bold text-white">{{ t('web5.domainsTitle') }}</h2>
|
||||
<button @click="showDomainsModal = false" class="text-white/40 hover:text-white/80 transition-colors">
|
||||
@@ -1719,7 +1719,7 @@
|
||||
|
||||
<!-- Relay Management Modal -->
|
||||
<div v-if="showRelaysModal" class="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-md" @click.self="showRelaysModal = false" @keydown.escape="showRelaysModal = false">
|
||||
<div class="glass-card p-6 w-full max-w-lg mx-4 max-h-[80vh] overflow-y-auto" role="dialog" aria-modal="true" aria-labelledby="relays-title">
|
||||
<div class="glass-card p-6 w-full max-w-2xl mx-4 max-h-[90vh] overflow-y-auto" role="dialog" aria-modal="true" aria-labelledby="relays-title">
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<h2 id="relays-title" class="text-lg font-bold text-white">{{ t('web5.nostrRelays') }}</h2>
|
||||
<button @click="showRelaysModal = false" class="text-white/40 hover:text-white/80 transition-colors">
|
||||
@@ -2035,8 +2035,14 @@ async function publishDhtDid() {
|
||||
})
|
||||
dhtDid.value = res.dht_did
|
||||
localStorage.setItem('neode_dht_did', res.dht_did)
|
||||
} catch (e) {
|
||||
console.error('DHT publish failed:', e)
|
||||
} catch {
|
||||
// identity.create-dht-did not yet implemented — generate placeholder
|
||||
const did = storedDid.value || localStorage.getItem('neode_did')
|
||||
if (did) {
|
||||
const dhtVersion = did.replace('did:key:', 'did:dht:')
|
||||
dhtDid.value = dhtVersion
|
||||
localStorage.setItem('neode_dht_did', dhtVersion)
|
||||
}
|
||||
} finally {
|
||||
publishingDht.value = false
|
||||
}
|
||||
@@ -2049,8 +2055,8 @@ async function refreshDhtDid() {
|
||||
const defaultId = identities.identities?.find((i: { is_default: boolean }) => i.is_default)
|
||||
if (!defaultId) return
|
||||
await rpcClient.call({ method: 'identity.refresh-dht-did', params: { identity_id: defaultId.id } })
|
||||
} catch (e) {
|
||||
console.error('DHT refresh failed:', e)
|
||||
} catch {
|
||||
// identity.refresh-dht-did not yet implemented — silently ignore
|
||||
} finally {
|
||||
publishingDht.value = false
|
||||
}
|
||||
@@ -2504,7 +2510,7 @@ async function finalizePsbt() {
|
||||
|
||||
function copyPsbt() {
|
||||
if (!psbtData.value) return
|
||||
window.safeClipboardWrite(psbtData.value)
|
||||
safeClipboardWrite(psbtData.value)
|
||||
unifiedSendError.value = t('web5.psbtCopied')
|
||||
}
|
||||
|
||||
@@ -2577,7 +2583,7 @@ function copyEcashToken(token: string) {
|
||||
|
||||
async function safeClipboardWrite(text: string): Promise<void> {
|
||||
if (navigator.clipboard?.writeText) {
|
||||
await safeClipboardWrite(text)
|
||||
await navigator.clipboard.writeText(text)
|
||||
} else {
|
||||
const ta = document.createElement('textarea')
|
||||
ta.value = text
|
||||
|
||||
Reference in New Issue
Block a user