48 lines
1.2 KiB
TypeScript
48 lines
1.2 KiB
TypeScript
import { useState } from "react";
|
|
import { LocalFileBrowser } from "./file-browsers/local-file-browser";
|
|
import { Button } from "./ui/button";
|
|
|
|
type Props = {
|
|
value: string;
|
|
onChange: (path: string) => void;
|
|
label?: string;
|
|
};
|
|
|
|
export const PathSelector = ({ value, onChange }: Props) => {
|
|
const [showBrowser, setShowBrowser] = useState(false);
|
|
|
|
if (showBrowser) {
|
|
return (
|
|
<div className="space-y-2">
|
|
<LocalFileBrowser
|
|
className="border rounded-lg overflow-hidden"
|
|
useScrollArea
|
|
scrollAreaClassName="h-64"
|
|
foldersOnly
|
|
selectableFolders
|
|
selectedFolder={value}
|
|
onFolderSelect={(path) => {
|
|
onChange(path);
|
|
setShowBrowser(false);
|
|
}}
|
|
showSelectedPathFooter
|
|
selectedPath={value}
|
|
loadingMessage="Loading directories..."
|
|
emptyMessage="No subdirectories found"
|
|
/>
|
|
<Button type="button" variant="ghost" size="sm" onClick={() => setShowBrowser(false)}>
|
|
Cancel
|
|
</Button>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="flex items-center gap-2">
|
|
<div className="flex-1 text-sm font-mono bg-muted px-3 py-2 rounded-md border">{value}</div>
|
|
<Button type="button" variant="outline" onClick={() => setShowBrowser(true)} size="sm">
|
|
Change
|
|
</Button>
|
|
</div>
|
|
);
|
|
};
|