diff --git a/app/client/components/path-selector.tsx b/app/client/components/path-selector.tsx new file mode 100644 index 00000000..4d6e6a4d --- /dev/null +++ b/app/client/components/path-selector.tsx @@ -0,0 +1,52 @@ +import { useState } from "react"; +import { DirectoryBrowser } from "./directory-browser"; +import { Button } from "./ui/button"; + +type Props = { + value: string; + onChange: (path: string) => void; + label?: string; +}; + +/** + * A reusable path selector component that shows the selected path + * with a "Change" button, and expands to a DirectoryBrowser when clicked. + * Matches the pattern used in the volume creation form. + */ +export const PathSelector = ({ value, onChange, label = "Selected path:" }: Props) => { + const [showBrowser, setShowBrowser] = useState(false); + + if (showBrowser) { + return ( +
+ Files will be restored to this location. Default "/" restores to original paths. +