Workspaces and Terminals

src/workspaces/apps/FileBrowser/Breadcrumb.tsx

@@ -3,23 +3,26 @@ import { ChevronRight, Home } from 'lucide-react';
 type BreadcrumbProps = {
   path: string;
   onNavigate: (path: string) => void;
+  basePath?: string;
 };
 
-export const Breadcrumb = ({ path, onNavigate }: BreadcrumbProps) => {
-  const segments = path.split('/').filter(Boolean);
+export const Breadcrumb = ({ path, onNavigate, basePath = '/' }: BreadcrumbProps) => {
+  const relativePath = basePath !== '/' && path.startsWith(basePath) ? path.slice(basePath.length) : path;
+  const segments = relativePath.split('/').filter(Boolean);
 
   return (
     <nav className="flex items-center gap-1 text-sm flex-wrap">
       <button
-        onClick={() => onNavigate('/')}
+        onClick={() => onNavigate(basePath)}
         className="flex items-center gap-1 text-duck-forest hover:text-duck-teal transition-colors cursor-pointer font-medium"
       >
         <Home className="h-4 w-4" />
-        <span>home</span>
+        <span>{basePath === '/' ? 'home' : basePath.split('/').pop()}</span>
       </button>
 
       {segments.map((segment, i) => {
-        const segmentPath = '/' + segments.slice(0, i + 1).join('/');
+        const relative = '/' + segments.slice(0, i + 1).join('/');
+        const segmentPath = basePath === '/' ? relative : basePath + relative;
         const isLast = i === segments.length - 1;
 
         return (