diff --git a/src/components/autocomplete.tsx b/src/components/autocomplete.tsx index b6d5a6f..00a0638 100644 --- a/src/components/autocomplete.tsx +++ b/src/components/autocomplete.tsx @@ -1,5 +1,12 @@ +"use client" import { useState } from "react" -import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem } from "./ui/command" +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, +} from "./ui/command" import { Popover, PopoverContent, PopoverTrigger } from "./ui/popover" import { Check, ChevronsUpDown } from "lucide-react" import { cn } from "@/lib/utils" @@ -16,7 +23,6 @@ const Autocomplete = ({ setPath, }: AutocompleteProperties) => { const [open, setOpen] = useState(false) - const [value, setValue] = useState("") const [input, setInput] = useState("") const getFolders = (files: File[]) => @@ -33,11 +39,7 @@ const Autocomplete = ({ aria-expanded={open} className="w-[200px] justify-between" > - {value - ? getFolders(downloadableFiles).find( - (file) => file.name === value - )?.name - : "Destination folder"} + {input ? input : "Destination folder"} @@ -47,25 +49,34 @@ const Autocomplete = ({ placeholder="Destination folder" onValueChange={setInput} /> - {`Create folder "${input}"`} + { + setInput(input) + setPath(input) + setOpen(false) + }} + > + {`Create folder "${input}"`} + {getFolders(downloadableFiles).map((file) => ( { - setValue( - currentValue === value + setInput( + currentValue === input ? "" : currentValue ) setPath(currentValue) + setOpen(false) }} > > className?: string @@ -12,7 +11,6 @@ interface DropzoneProps { files: any[] } -// Create the Dropzone component receiving props export function Dropzone({ setFiles, className, @@ -20,9 +18,8 @@ export function Dropzone({ files, ...props }: DropzoneProps) { - // Initialize state variables using the useState hook const fileInputRef = useRef(null) // Reference to file input element - const [error, setError] = useState(null) // Error message state + //const [error, setError] = useState(null) // Error message state // Function to handle drag over event const handleDragOver = (e: React.DragEvent) => { @@ -60,7 +57,7 @@ export function Dropzone({ const fileList = Array.from(files) setFiles((prevFiles: any[]) => [...prevFiles, ...fileList]) - setError(null) // Reset error state + //setError(null) // Reset error state } // Function to simulate a click on the file input element @@ -115,7 +112,7 @@ export function Dropzone({ ) })} - {error && {error}} + {/*error && {error}*/} ) diff --git a/src/components/ui/command.tsx b/src/components/ui/command.tsx index 17cc641..35fe465 100644 --- a/src/components/ui/command.tsx +++ b/src/components/ui/command.tsx @@ -75,7 +75,7 @@ const CommandEmpty = React.forwardRef< >((props, ref) => ( ))