fix: trace debug — show Stranger_NNN for unnamed traces instead of unknown

portal/src/views/HomeView.vue

@@ -112,6 +112,12 @@
       <h3 class="text-xl font-semibold text-orange-400 mb-4">SFTPGo 狀態</h3>
       
       <div v-if="sftpgoStatus" class="space-y-4">
+        <!-- Status message -->
+        <div v-if="statusMsg" class="text-sm px-3 py-2 rounded"
+          :class="statusMsg.type === 'ok' ? 'bg-green-900/50 text-green-300' : 'bg-red-900/50 text-red-300'">
+          {{ statusMsg.text }}
+          <button @click="statusMsg = null" class="ml-2 text-gray-500 hover:text-white">&times;</button>
+        </div>
         <!-- Basic Info -->
         <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-4">
           <div class="bg-gray-900 p-4 rounded border border-gray-600">
@@ -343,11 +349,7 @@
 
 <script setup lang="ts">
 import { ref, onMounted } from 'vue'
-import { getHealth, getIngestStats, getSftpgoStatus, getInferenceHealth } from '@/api/client'
-
-const isTauri = () => {
-  return (window as any).__TAURI__ !== undefined
-}
+import { getHealth, getIngestStats, getSftpgoStatus, getInferenceHealth, getCurrentConfig, isTauri } from '@/api/client'
 
 interface ServiceStatus {
   status: string
@@ -414,8 +416,9 @@ const ingestStats = ref<IngestStats | null>(null)
 const sftpgoStatus = ref<SftpgoStatus | null>(null)
 const inferenceHealth = ref<InferenceHealthResponse | null>(null)
 const loading = ref(false)
-const apiBaseUrl = ref('http://127.0.0.1:3003 (dev)')
+const apiBaseUrl = ref(getCurrentConfig().api_base_url)
 const sftpgoUrl = ref('https://sftpgo.momentry.ddns.net/web/client')
+const statusMsg = ref<{ text: string; type: string } | null>(null)
 
 async function fetchHealth() {
   loading.value = true
@@ -455,33 +458,31 @@ async function fetchInferenceHealth() {
 function openSftpgoFiles() {
   const url = sftpgoUrl.value
   console.log('Momentry: Opening URL:', url, 'isTauri:', isTauri())
-  alert('即將開啟：' + url)
+  statusMsg.value = { text: '即將開啟：' + url, type: 'ok' }
   
   if (isTauri()) {
-    // Use Tauri invoke in app mode
     try {
       import('@tauri-apps/api/core').then(({ invoke }) => {
         invoke('plugin:shell|open', { path: url }).then(() => {
           console.log('Momentry: Opened with shell')
-          alert('已開啟')
+          statusMsg.value = { text: '已開啟', type: 'ok' }
         }).catch((e) => {
           console.error('Momentry: Shell error:', e)
-          alert('開啟失敗：' + e)
+          statusMsg.value = { text: '開啟失敗：' + e, type: 'err' }
         })
       })
     } catch (e) {
       console.error('Momentry: Import error:', e)
-      alert('導入失敗：' + e)
+      statusMsg.value = { text: '導入失敗：' + e, type: 'err' }
     }
     return
   }
-  // Use browser open in web mode
   window.open(url, '_blank')?.focus()
 }
 
 function copySftpgoUrl() {
   navigator.clipboard.writeText(sftpgoUrl.value)
-  alert('已複製網址：' + sftpgoUrl.value)
+  statusMsg.value = { text: '已複製網址：' + sftpgoUrl.value, type: 'ok' }
 }
 
 async function refreshHealth() {
@@ -507,44 +508,3 @@ onMounted(() => {
   fetchInferenceHealth()
 })
 </script>
-
-<script lang="ts">
-import { defineComponent, h } from 'vue'
-
-const ServiceStatusCard = defineComponent({
-  props: {
-    name: String,
-    status: String,
-    latency: [Number, null],
-    error: [String, null]
-  },
-  setup(props) {
-    const statusColor = () => {
-      if (props.status === 'ok') return 'text-green-400'
-      if (props.status === 'degraded') return 'text-yellow-400'
-      return 'text-red-400'
-    }
-    
-    const bgColor = () => {
-      if (props.status === 'ok') return 'bg-green-900/20 border-green-700'
-      if (props.status === 'degraded') return 'bg-yellow-900/20 border-yellow-700'
-      return 'bg-red-900/20 border-red-700'
-    }
-    
-    return () => h('div', {
-      class: `rounded-lg p-3 border ${bgColor()}`
-    }, [
-      h('div', { class: 'flex items-center justify-between' }, [
-        h('span', { class: 'font-semibold' }, props.name),
-        h('span', { class: statusColor() }, props.status === 'ok' ? '●' : '○')
-      ]),
-      props.latency ? h('div', { class: 'text-xs text-gray-400 mt-1' }, `${props.latency}ms`) : null,
-      props.error ? h('div', { class: 'text-xs text-red-400 mt-1 truncate' }, props.error) : null
-    ])
-  }
-})
-
-export default {
-  components: { ServiceStatusCard }
-}
-</script>