arkaos 3.77.0 → 4.0.0

package/dashboard/app/components/KnowledgeSourcesList.vue

@@ -9,6 +9,12 @@
 interface SourceRow {
   source: string
   chunks: number
+  id: string
+  title?: string
+  type?: string
+  has_media?: boolean
+  duration?: number
+  status?: string
 }
 
 const { fetchApi, apiBase } = useApi()
@@ -78,6 +84,15 @@ function sourceLabel(src: string): string {
   }
   return src
 }
+
+const typeColorMap: Record<string, 'error' | 'primary' | 'warning' | 'success' | 'neutral'> = {
+  youtube: 'error',
+  web: 'primary',
+  pdf: 'warning',
+  audio: 'success',
+  markdown: 'neutral',
+  video: 'error'
+}
 </script>
 
 <template>
@@ -87,7 +102,7 @@ function sourceLabel(src: string): string {
         <div>
           <h3 class="text-lg font-bold">Indexed sources</h3>
           <p class="text-xs text-muted mt-0.5">
-            Every distinct source contributing chunks to the vector store.
+            Click any source to view its transcript, video, and knowledge.
             <span v-if="data?.total">{{ data.total }} total.</span>
           </p>
         </div>
@@ -120,18 +135,30 @@ function sourceLabel(src: string): string {
       <ul class="space-y-1.5">
         <li
           v-for="row in paged"
-          :key="row.source"
-          class="flex items-center gap-3 rounded-lg border border-default p-2.5 hover:border-primary/40 transition-colors"
+          :key="row.id"
+          class="flex items-center gap-2 rounded-lg border border-default p-2.5 hover:border-primary/40 transition-colors"
         >
-          <UIcon
-            :name="row.source.startsWith('http') ? 'i-lucide-link' : 'i-lucide-file-text'"
-            class="size-4 text-muted shrink-0"
-          />
-          <div class="flex-1 min-w-0">
-            <p class="text-sm font-mono truncate" :title="row.source">
-              {{ sourceLabel(row.source) }}
-            </p>
-          </div>
+          <NuxtLink
+            :to="`/knowledge/${row.id}`"
+            class="flex items-center gap-3 flex-1 min-w-0"
+          >
+            <UIcon
+              :name="row.source.startsWith('http') ? 'i-lucide-link' : 'i-lucide-file-text'"
+              class="size-4 text-muted shrink-0"
+            />
+            <div class="flex-1 min-w-0">
+              <p class="text-sm truncate text-highlighted" :title="row.source">
+                {{ row.title || sourceLabel(row.source) }}
+              </p>
+            </div>
+            <UBadge
+              v-if="row.type"
+              :label="row.type"
+              :color="typeColorMap[row.type] ?? 'neutral'"
+              variant="subtle"
+              size="xs"
+            />
+          </NuxtLink>
           <UBadge :label="`${row.chunks} chunk${row.chunks === 1 ? '' : 's'}`" variant="subtle" size="xs" />
           <UButton
             icon="i-lucide-trash-2"
@@ -139,7 +166,7 @@ function sourceLabel(src: string): string {
             variant="ghost"
             size="xs"
             aria-label="Delete source"
-            @click="remove(row)"
+            @click.stop.prevent="remove(row)"
           />
         </li>
       </ul>

package/dashboard/app/pages/cognition.vue

@@ -26,9 +26,14 @@ interface Status {
 
 const { apiBase } = useApi()
 
+// Sentinel for the "All tags" option. Reka UI forbids an empty-string
+// SelectItem value (it is reserved for clearing the selection), so the
+// "show everything" choice needs a non-empty, collision-safe value.
+const ALL_TAGS = '__all__'
+
 const days = ref(7)
 const confidenceFilter = ref<'all' | 'high' | 'medium' | 'low'>('all')
-const tagFilter = ref('')
+const tagFilter = ref(ALL_TAGS)
 const insights = ref<Insight[]>([])
 const status = ref<Status | null>(null)
 const available = ref(true)
@@ -70,7 +75,7 @@ onMounted(refresh)
 // Reset the tag filter when the window changes — a tag may not exist in the
 // new window, which would otherwise strand the user on an empty result.
 watch(days, () => {
-  tagFilter.value = ''
+  tagFilter.value = ALL_TAGS
   refresh()
 })
 
@@ -82,7 +87,7 @@ const allTags = computed(() => {
 
 const filtered = computed(() => insights.value.filter((i) => {
   if (confidenceFilter.value !== 'all' && i.confidence !== confidenceFilter.value) return false
-  if (tagFilter.value && !i.tags.includes(tagFilter.value)) return false
+  if (tagFilter.value !== ALL_TAGS && !i.tags.includes(tagFilter.value)) return false
   return true
 }))
 
@@ -204,7 +209,7 @@ const isActive = computed(() => {
           <USelect
             v-if="allTags.length"
             v-model="tagFilter"
-            :items="[{ label: 'All tags', value: '' }, ...allTags.map(t => ({ label: '#' + t, value: t }))]"
+            :items="[{ label: 'All tags', value: ALL_TAGS }, ...allTags.map(t => ({ label: '#' + t, value: t }))]"
             size="sm"
             class="w-40"
           />