oxios 1.12.0

Oxios Agent OS — Agent Operating System powered by oxi-sdk
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54

import { ChevronRight, Home } from 'lucide-react'

interface FileBreadcrumbProps {
  path: string
  onNavigate: (dir: string) => void
}

export function FileBreadcrumb({ path, onNavigate }: FileBreadcrumbProps) {
  if (!path) {
    return (
      <div className="flex items-center gap-1 text-sm text-muted-foreground">
        <Home className="h-4 w-4" />
        <span>root</span>
      </div>
    )
  }

  const segments = path.split('/').filter(Boolean)
  const parts: { label: string; fullPath: string }[] = []
  let accumulated = ''
  for (const seg of segments) {
    accumulated = accumulated ? `${accumulated}/${seg}` : seg
    parts.push({ label: seg, fullPath: accumulated })
  }

  return (
    <div className="flex items-center gap-1 text-sm flex-wrap">
      <button
        type="button"
        className="flex items-center gap-1 text-muted-foreground hover:text-foreground transition-colors"
        onClick={() => onNavigate('')}
      >
        <Home className="h-3.5 w-3.5" />
        <span>root</span>
      </button>
      {parts.map((part, i) => (
        <span key={part.fullPath} className="flex items-center gap-1">
          <ChevronRight className="h-3 w-3 text-muted-foreground" />
          {i === parts.length - 1 ? (
            <span className="font-medium text-foreground">{part.label}</span>
          ) : (
            <button
              type="button"
              className="text-muted-foreground hover:text-foreground transition-colors"
              onClick={() => onNavigate(part.fullPath)}
            >
              {part.label}
            </button>
          )}
        </span>
      ))}
    </div>
  )
}