Files
bewcloud/components/files/FilesBreadcrumb.tsx
Bruno Bernardino 3f5422f8eb Add basic Notes UI
2024-04-26 14:31:25 +01:00

60 lines
1.6 KiB
TypeScript

interface FilesBreadcrumbProps {
path: string;
isShowingNotes?: boolean;
}
export default function FilesBreadcrumb({ path, isShowingNotes }: FilesBreadcrumbProps) {
const routePath = isShowingNotes ? 'notes' : 'files';
if (!isShowingNotes && path === '/') {
return (
<h3 class='text-base font-semibold text-white whitespace-nowrap mr-2'>
All files
</h3>
);
}
if (isShowingNotes && path === '/Notes/') {
return (
<h3 class='text-base font-semibold text-white whitespace-nowrap mr-2'>
All notes
</h3>
);
}
const pathParts = path.slice(1, -1).split('/');
if (isShowingNotes) {
pathParts.shift();
}
return (
<h3 class='text-base font-semibold text-white whitespace-nowrap mr-2'>
{isShowingNotes ? <a href={`/notes?path=/Notes/`}>All notes</a> : <a href={`/files?path=/`}>All files</a>}
{pathParts.map((part, index) => {
if (index === pathParts.length - 1) {
return (
<>
<span class='ml-2 text-xs'>/</span>
<span class='ml-2'>{decodeURIComponent(part)}</span>
</>
);
}
const fullPathForPart: string[] = [];
for (let pathPartIndex = 0; pathPartIndex <= index; ++pathPartIndex) {
fullPathForPart.push(pathParts[pathPartIndex]);
}
return (
<>
<span class='ml-2 text-xs'>/</span>
<a href={`/${routePath}?path=/${fullPathForPart.join('/')}/`} class='ml-2'>{decodeURIComponent(part)}</a>
</>
);
})}
</h3>
);
}