fixes

albertsalgueda · albertsalgueda · commit d3d507d8a0a5 · 2026-03-23T18:57:21.000+01:00
diff --git a/src/app/api/health/[instanceId]/route.ts b/src/app/api/health/[instanceId]/route.ts
@@ -2,6 +2,10 @@ import { NextResponse } from 'next/server'
 import { requireAuth } from '@/lib/auth'
 import { supabaseAdmin } from '@/lib/supabase/admin'
 import { checkInstanceHealth } from '@/lib/openclaw/health'
+import { createDnsRecord, isDnsConfigured } from '@/lib/dns/cloudflare'
+import { logInstanceEvent } from '@/lib/control-plane'
+
+const INSTANCE_DOMAIN = process.env.INSTANCE_DOMAIN ?? 'agentcomputers.app'
 
 export async function GET(
   _req: Request,
@@ -36,6 +40,22 @@ export async function GET(
     updates.provisioned_at = new Date().toISOString()
   }
 
+  if (!instance.dashboard_url && instance.ip_address && health.status === 'healthy' && isDnsConfigured()) {
+    try {
+      const dns = await createDnsRecord(instance.slug, instance.ip_address)
+      if (dns.success) {
+        updates.dashboard_url = `https://${instance.slug}.${INSTANCE_DOMAIN}`
+        await logInstanceEvent(instanceId, 'dns_created', {
+          record_id: dns.id,
+          hostname: `${instance.slug}.${INSTANCE_DOMAIN}`,
+          source: 'health_check_retry',
+        })
+      }
+    } catch (err) {
+      console.error('DNS retry during health check failed:', err)
+    }
+  }
+
   await supabaseAdmin
     .from('instances')
     .update(updates)
diff --git a/src/components/instances/instance-dashboard.tsx b/src/components/instances/instance-dashboard.tsx
@@ -1,19 +1,46 @@
 'use client'
 
 import { ExternalLink, LoaderCircle } from 'lucide-react'
-import { useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import { buttonVariants } from '@/components/ui/button'
 import type { Instance } from '@/types/instance'
 
+const LOAD_TIMEOUT_MS = 8000
+
+function buildDashboardUrl(base: string, token: string | null): string {
+  return token ? `${base}/#token=${token}` : base
+}
+
 export function InstanceDashboard({ instance }: { instance: Instance }) {
-  const baseUrl = instance.dashboard_url ?? (instance.ip_address ? `http://${instance.ip_address}` : null)
-  const dashboardUrl = baseUrl
-    ? instance.gateway_token
-      ? `${baseUrl}/#token=${instance.gateway_token}`
-      : baseUrl
+  const httpsBase = instance.dashboard_url ?? null
+  const ipBase = instance.ip_address ? `http://${instance.ip_address}` : null
+  const [useFallback, setUseFallback] = useState(false)
+  const [loaded, setLoaded] = useState(false)
+  const timerRef = useRef<ReturnType<typeof setTimeout>>(null)
+
+  const activeBase = useFallback ? (ipBase ?? httpsBase) : (httpsBase ?? ipBase)
+  const dashboardUrl = activeBase
+    ? buildDashboardUrl(activeBase, instance.gateway_token)
     : null
 
-  const [loaded, setLoaded] = useState(false)
+  useEffect(() => {
+    return () => { if (timerRef.current) clearTimeout(timerRef.current) }
+  }, [])
+
+  function startLoadTimer() {
+    if (timerRef.current) clearTimeout(timerRef.current)
+    if (!useFallback && httpsBase && ipBase) {
+      timerRef.current = setTimeout(() => {
+        setUseFallback(true)
+        setLoaded(false)
+      }, LOAD_TIMEOUT_MS)
+    }
+  }
+
+  function handleLoad() {
+    if (timerRef.current) clearTimeout(timerRef.current)
+    setLoaded(true)
+  }
 
   if (!dashboardUrl) {
     return (
@@ -52,12 +79,14 @@ export function InstanceDashboard({ instance }: { instance: Instance }) {
           </div>
         )}
         <iframe
+          key={dashboardUrl}
           src={dashboardUrl}
           className="h-[calc(100dvh-14rem)] w-full"
           style={{ colorScheme: 'dark', background: 'var(--background, #0a0a0a)' }}
           title="OpenClaw Dashboard"
           allow="clipboard-read; clipboard-write"
-          onLoad={() => setLoaded(true)}
+          ref={(el) => { if (el) startLoadTimer() }}
+          onLoad={handleLoad}
         />
       </div>
     </div>
diff --git a/src/components/instances/instance-terminal-workspace.tsx b/src/components/instances/instance-terminal-workspace.tsx
@@ -1,12 +1,13 @@
 'use client'
 
-import { useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import { ExternalLink, LoaderCircle, Plus, RefreshCw, TerminalSquare, X } from 'lucide-react'
-import { Button, buttonVariants } from '@/components/ui/button'
 import { cn } from '@/lib/utils'
 import { getInstanceTerminalConnection } from '@/lib/terminal'
 import type { Instance } from '@/types/instance'
 
+const LOAD_TIMEOUT_MS = 8000
+
 interface InstanceTerminalWorkspaceProps {
   instance: Instance
   className?: string
@@ -31,6 +32,18 @@ export function InstanceTerminalWorkspace({
   const [activeSessionId, setActiveSessionId] = useState('terminal-1')
   const [nextSessionNumber, setNextSessionNumber] = useState(2)
   const [loadedSessions, setLoadedSessions] = useState<Record<string, boolean>>({})
+  const [useFallback, setUseFallback] = useState(false)
+  const loadTimers = useRef<Record<string, ReturnType<typeof setTimeout>>>({})
+
+  const terminalUrl = useFallback && connection.directUrl
+    ? connection.directUrl
+    : connection.preferredUrl
+
+  useEffect(() => {
+    return () => {
+      Object.values(loadTimers.current).forEach(clearTimeout)
+    }
+  }, [])
 
   if (instance.status !== 'running') {
     return (
@@ -50,7 +63,7 @@ export function InstanceTerminalWorkspace({
     )
   }
 
-  if (!connection.preferredUrl) {
+  if (!terminalUrl) {
     return (
       <div className="flex min-h-[28rem] items-center justify-center rounded-xl border bg-card p-8 text-center">
         <div className="max-w-sm space-y-3">
@@ -64,9 +77,24 @@ export function InstanceTerminalWorkspace({
     )
   }
 
-  const terminalUrl = connection.preferredUrl
   const activeSession = sessions.find((s) => s.id === activeSessionId) ?? sessions[0]
 
+  function startLoadTimer(sessionId: string) {
+    clearTimeout(loadTimers.current[sessionId])
+    if (!useFallback && connection.directUrl && connection.mode === 'proxied') {
+      loadTimers.current[sessionId] = setTimeout(() => {
+        setUseFallback(true)
+        setLoadedSessions({})
+        setSessions((prev) => prev.map((s) => ({ ...s, version: s.version + 1 })))
+      }, LOAD_TIMEOUT_MS)
+    }
+  }
+
+  function handleLoad(sessionId: string) {
+    clearTimeout(loadTimers.current[sessionId])
+    setLoadedSessions((prev) => ({ ...prev, [sessionId]: true }))
+  }
+
   function createNewSession() {
     const session = createSession(nextSessionNumber)
     setSessions((prev) => [...prev, session])
@@ -84,6 +112,7 @@ export function InstanceTerminalWorkspace({
 
   function closeSession(sessionId: string) {
     if (sessions.length === 1) return
+    clearTimeout(loadTimers.current[sessionId])
     const idx = sessions.findIndex((s) => s.id === sessionId)
     const remaining = sessions.filter((s) => s.id !== sessionId)
     setSessions(remaining)
@@ -99,9 +128,7 @@ export function InstanceTerminalWorkspace({
 
   return (
     <div className={cn('flex flex-col gap-0 overflow-hidden rounded-xl border bg-[#0a0a0a]', className)}>
-      {/* Toolbar */}
       <div className="flex items-center gap-1 border-b border-white/10 bg-[#111] px-2 py-1.5">
-        {/* Tabs */}
         <div className="flex min-w-0 flex-1 items-center gap-1 overflow-x-auto">
           {sessions.map((session) => {
             const isActive = session.id === activeSession.id
@@ -145,7 +172,6 @@ export function InstanceTerminalWorkspace({
           </button>
         </div>
 
-        {/* Actions */}
         <div className="flex items-center gap-1">
           <button
             type="button"
@@ -156,7 +182,7 @@ export function InstanceTerminalWorkspace({
             <RefreshCw className="h-3.5 w-3.5" />
           </button>
           <a
-            href={connection.preferredUrl}
+            href={terminalUrl}
             target="_blank"
             rel="noopener noreferrer"
             className="rounded-md p-1.5 text-white/40 transition-colors hover:bg-white/5 hover:text-white/70"
@@ -167,7 +193,6 @@ export function InstanceTerminalWorkspace({
         </div>
       </div>
 
-      {/* Terminal iframe area */}
       <div className="relative min-h-[calc(100dvh-16rem)] bg-[#0a0a0a]">
         {sessions.map((session) => {
           const isActive = session.id === activeSession.id
@@ -191,13 +216,14 @@ export function InstanceTerminalWorkspace({
               )}
 
               <iframe
-                key={`${session.id}:${session.version}`}
+                key={`${session.id}:${session.version}:${terminalUrl}`}
                 src={terminalUrl}
                 title={session.title}
                 className="block h-full w-full"
                 style={{ colorScheme: 'dark', background: '#0a0a0a' }}
                 allow="clipboard-read; clipboard-write; fullscreen"
-                onLoad={() => setLoadedSessions((prev) => ({ ...prev, [session.id]: true }))}
+                ref={(el) => { if (el && isActive) startLoadTimer(session.id) }}
+                onLoad={() => handleLoad(session.id)}
               />
             </div>
           )
diff --git a/src/lib/control-plane.test.ts b/src/lib/control-plane.test.ts
@@ -139,8 +139,7 @@ describe('control plane provisioning', () => {
       expect.objectContaining({
         gatewayToken: 'gateway-token-123',
         dashboardUrl: 'https://demo.agent.example',
-        aiGatewayApiKey: 'vck_123',
-        stripeRestrictedKey: 'rk_123',
+        proxyBaseUrl: 'https://agentcomputers.app/api/gateway/proxy',
       })
     )
     expect(mockGenerateCloudInit).toHaveBeenCalledWith(
diff --git a/src/lib/control-plane.ts b/src/lib/control-plane.ts
@@ -53,14 +53,32 @@ export async function provisionInstance(
     },
   })
 
+  let dnsSuccess = false
+  if (isDnsConfigured()) {
+    try {
+      const dns = await createDnsRecord(instance.slug, server.public_net.ipv4.ip)
+      dnsSuccess = dns.success
+      if (dns.success) {
+        await logInstanceEvent(instance.id, 'dns_created', {
+          record_id: dns.id,
+          hostname: `${instance.slug}.${INSTANCE_DOMAIN}`,
+        })
+      } else {
+        console.error('DNS record creation returned failure for', instance.slug)
+      }
+    } catch (err) {
+      console.error('DNS record creation failed:', err)
+    }
+  }
+
   const { error: updateError } = await supabaseAdmin
     .from('instances')
     .update({
       hetzner_server_id: server.id,
       hetzner_server_type: plan.hetzner_type,
       ip_address: server.public_net.ipv4.ip,
       gateway_token: gatewayToken,
-      dashboard_url: dashboardUrl,
+      dashboard_url: dnsSuccess ? dashboardUrl : null,
     })
     .eq('id', instance.id)
 
@@ -69,20 +87,6 @@ export async function provisionInstance(
     throw new Error(`Instance DB update failed: ${updateError.message}`)
   }
 
-  if (isDnsConfigured()) {
-    try {
-      const dns = await createDnsRecord(instance.slug, server.public_net.ipv4.ip)
-      if (dns.success) {
-        await logInstanceEvent(instance.id, 'dns_created', {
-          record_id: dns.id,
-          hostname: `${instance.slug}.${INSTANCE_DOMAIN}`,
-        })
-      }
-    } catch (err) {
-      console.error('DNS record creation failed:', err)
-    }
-  }
-
   await logInstanceEvent(instance.id, 'server_created', {
     server_id: server.id,
     ip: server.public_net.ipv4.ip,
