changes for build for sxsw

neode-ui/src/views/OnboardingBackup.vue

@@ -15,7 +15,8 @@
       <!-- Content Area -->
       <div class="flex flex-col items-center gap-4 sm:gap-6 mb-4 sm:mb-6 px-3 sm:px-4">
         <div class="w-full max-w-[600px] space-y-4 sm:space-y-6">
-          <p v-if="errorMessage" class="text-red-400 text-sm">{{ errorMessage }}</p>
+          <p v-if="serverStarting" class="text-orange-400/80 text-sm">Server is still starting up. You can try again shortly or skip this step.</p>
+          <p v-else-if="errorMessage" class="text-red-400 text-sm">{{ errorMessage }}</p>
           <!-- Passphrase Input -->
           <div class="path-option-card cursor-default px-4 py-4 sm:px-6 sm:py-6">
             <div class="text-left w-full">
@@ -102,6 +103,7 @@ const passphrase = ref('')
 const isDownloading = ref(false)
 const downloaded = ref(false)
 const errorMessage = ref('')
+const serverStarting = ref(false)
 
 async function downloadBackup() {
   if (!passphrase.value) return
@@ -133,8 +135,8 @@ async function downloadBackup() {
     localStorage.setItem('neode_backup_created', '1')
   } catch (err) {
     const msg = err instanceof Error ? err.message : String(err)
-    if (/502|503|timeout|fetch|network/i.test(msg)) {
-      errorMessage.value = 'Server is not reachable. Please ensure your node is running and try again.'
+    if (/502|503|504|timeout|fetch|network|Failed to fetch/i.test(msg)) {
+      serverStarting.value = true
     } else {
       errorMessage.value = msg || 'Failed to create backup. Please try again.'
     }

neode-ui/src/views/OnboardingDid.vue

@@ -14,8 +14,8 @@
 
       <!-- Content Area -->
       <div class="flex flex-col items-center gap-6 mb-6">
-        <!-- Generating state — spinning lock -->
-        <div v-if="!generatedDid && isGenerating" class="text-center">
+        <!-- Waiting for server / Generating state -->
+        <div v-if="!generatedDid && (isGenerating || waitingForServer)" class="text-center">
           <div class="flex justify-center mb-4">
             <div class="w-16 h-16 rounded-full bg-white/10 flex items-center justify-center onb-lock-spin">
               <svg class="w-8 h-8 text-orange-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="2">
@@ -23,18 +23,12 @@
               </svg>
             </div>
           </div>
-          <p class="text-lg text-white/80">Generating your identity key...</p>
-        </div>
-
-        <!-- Connection failed - retry -->
-        <div v-if="!generatedDid && !isGenerating && connectionFailed" class="text-center">
-          <p class="text-white/60 text-base mb-4">{{ errorMessage }}</p>
-          <button
-            @click="fetchDid"
-            class="path-action-button path-action-button--continue"
-          >
-            Retry
-          </button>
+          <div v-if="waitingForServer" class="flex items-center justify-center gap-3 mb-2">
+            <p class="text-lg text-white/80">Server starting up</p>
+            <span class="text-sm text-white/40 font-mono tabular-nums">{{ elapsedDisplay }}</span>
+          </div>
+          <p v-if="waitingForServer" class="text-sm text-white/50">This usually takes 1–3 minutes after first boot</p>
+          <p v-if="!waitingForServer" class="text-lg text-white/80">Generating your identity key...</p>
         </div>
 
         <!-- Generated DID Display -->
@@ -104,17 +98,37 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
+import { ref, onMounted, onUnmounted } from 'vue'
 import { useRouter } from 'vue-router'
 import { rpcClient } from '@/api/rpc-client'
 
 const router = useRouter()
 const generatedDid = ref<string>('')
 const isGenerating = ref(false)
-const connectionFailed = ref(false)
+const waitingForServer = ref(false)
 const autoAdvancing = ref(false)
-const errorMessage = ref<string>('')
 const didCopied = ref(false)
+const elapsedSeconds = ref(0)
+const elapsedDisplay = ref('0:00')
+let retryTimer: ReturnType<typeof setTimeout> | null = null
+let elapsedTimer: ReturnType<typeof setInterval> | null = null
+let startTime = 0
+
+function startElapsedTimer() {
+  startTime = Date.now()
+  elapsedTimer = setInterval(() => {
+    const secs = Math.floor((Date.now() - startTime) / 1000)
+    elapsedSeconds.value = secs
+    const m = Math.floor(secs / 60)
+    const s = secs % 60
+    elapsedDisplay.value = `${m}:${s.toString().padStart(2, '0')}`
+  }, 1000)
+}
+
+function stopTimers() {
+  if (retryTimer) { clearTimeout(retryTimer); retryTimer = null }
+  if (elapsedTimer) { clearInterval(elapsedTimer); elapsedTimer = null }
+}
 
 function storeDidState(did: string, pubkey: string) {
   localStorage.setItem('neode_did', did)
@@ -122,28 +136,26 @@ function storeDidState(did: string, pubkey: string) {
 }
 
 async function fetchDid() {
-  isGenerating.value = true
-  connectionFailed.value = false
-  errorMessage.value = ''
-
-  for (let attempt = 0; attempt < 3; attempt++) {
-    try {
-      const { did, pubkey } = await rpcClient.getNodeDid()
-      generatedDid.value = did
-      storeDidState(did, pubkey)
-      autoAdvanceAfterDelay()
-      isGenerating.value = false
-      return
-    } catch (err) {
-      if (attempt < 2) {
-        await new Promise((r) => setTimeout(r, 1000 * (attempt + 1)))
-      }
-    }
+  if (!waitingForServer.value) {
+    isGenerating.value = true
   }
 
-  isGenerating.value = false
-  connectionFailed.value = true
-  errorMessage.value = 'Could not connect to your server. Please check that it is running and try again.'
+  try {
+    const { did, pubkey } = await rpcClient.getNodeDid()
+    stopTimers()
+    generatedDid.value = did
+    storeDidState(did, pubkey)
+    isGenerating.value = false
+    waitingForServer.value = false
+    autoAdvanceAfterDelay()
+  } catch {
+    isGenerating.value = false
+    if (!waitingForServer.value) {
+      waitingForServer.value = true
+      startElapsedTimer()
+    }
+    retryTimer = setTimeout(fetchDid, 4000)
+  }
 }
 
 function autoAdvanceAfterDelay() {
@@ -162,11 +174,17 @@ onMounted(() => {
   }
 })
 
+onUnmounted(() => {
+  stopTimers()
+})
+
 function proceed() {
+  stopTimers()
   router.push('/onboarding/identity').catch(() => {})
 }
 
 function skipForNow() {
+  stopTimers()
   router.push('/onboarding/identity').catch(() => {})
 }
 

neode-ui/src/views/OnboardingIdentity.vue

@@ -53,8 +53,11 @@
         </div>
       </div>
 
-      <!-- Error -->
-      <p v-if="errorMessage" class="text-red-400 text-sm text-center mb-4">{{ errorMessage }}</p>
+      <!-- Error / Server starting -->
+      <div v-if="serverStarting" class="text-center mb-4 px-3">
+        <p class="text-orange-400/80 text-sm">Server is still starting up. Your identity will be saved once it's ready.</p>
+      </div>
+      <p v-else-if="errorMessage" class="text-red-400 text-sm text-center mb-4">{{ errorMessage }}</p>
 
       <!-- Action Buttons -->
       <div class="flex gap-3 sm:gap-4 max-w-[600px] mx-auto flex-shrink-0 px-3 sm:px-4 pb-4 sm:pb-6">
@@ -87,6 +90,7 @@ const identityName = ref('Personal')
 const selectedPurpose = ref('personal')
 const isCreating = ref(false)
 const errorMessage = ref('')
+const serverStarting = ref(false)
 
 const purposes = [
   { value: 'personal', label: 'Personal', desc: 'Everyday use', color: 'bg-blue-500/30 text-blue-400' },
@@ -94,9 +98,15 @@ const purposes = [
   { value: 'anonymous', label: 'Anonymous', desc: 'Private', color: 'bg-purple-500/30 text-purple-400' },
 ]
 
+function isServerStartingError(err: unknown): boolean {
+  const msg = err instanceof Error ? err.message : String(err)
+  return /502|503|504|timeout|fetch|network|Failed to fetch/i.test(msg)
+}
+
 async function createIdentity() {
   isCreating.value = true
   errorMessage.value = ''
+  serverStarting.value = false
   try {
     await rpcClient.call({
       method: 'identity.create',
@@ -107,7 +117,11 @@ async function createIdentity() {
     })
     router.push('/onboarding/backup').catch(() => {})
   } catch (err) {
-    errorMessage.value = err instanceof Error ? err.message : 'Failed to create identity'
+    if (isServerStartingError(err)) {
+      serverStarting.value = true
+    } else {
+      errorMessage.value = err instanceof Error ? err.message : 'Failed to create identity'
+    }
   } finally {
     isCreating.value = false
   }

neode-ui/src/views/OnboardingVerify.vue

@@ -14,7 +14,8 @@
 
       <!-- Content Area -->
       <div class="flex flex-col items-center gap-6 mb-6">
-        <p v-if="errorMessage" class="text-red-400 text-sm">{{ errorMessage }}</p>
+        <p v-if="serverStarting" class="text-orange-400/80 text-sm">Server is still starting up. You can try again shortly or skip this step.</p>
+        <p v-else-if="errorMessage" class="text-red-400 text-sm">{{ errorMessage }}</p>
         <!-- Sign Button (if not verified yet) -->
         <button
           v-if="!verified"
@@ -92,6 +93,7 @@ const verified = ref(false)
 const isSigning = ref(false)
 const signature = ref('')
 const errorMessage = ref('')
+const serverStarting = ref(false)
 
 /** Generate a cryptographically random challenge (32 bytes, base64) */
 function generateChallenge(): string {
@@ -114,11 +116,13 @@ async function signChallenge() {
       return
     } catch (err) {
       const msg = err instanceof Error ? err.message : ''
-      const isRetryable = /502|503|timeout|fetch|network/i.test(msg)
+      const isRetryable = /502|503|504|timeout|fetch|network|Failed to fetch/i.test(msg)
       if (!isRetryable || attempt === 2) {
-        errorMessage.value = isRetryable
-          ? 'Server is not reachable. You can retry or skip this step.'
-          : (msg || 'Failed to sign challenge. You can retry or skip this step.')
+        if (isRetryable) {
+          serverStarting.value = true
+        } else {
+          errorMessage.value = msg || 'Failed to sign challenge. You can retry or skip this step.'
+        }
       } else {
         await new Promise((r) => setTimeout(r, 1000 * (attempt + 1)))
       }