fix: prop types in combobox

2 files changed, 17 insertions, 8 deletions

diff --git a/apps/web/app/(dash)/chat/chatQueryInput.tsx b/apps/web/app/(dash)/chat/chatQueryInput.tsx
index c7267298..62dd9668 100644
--- a/apps/web/app/(dash)/chat/chatQueryInput.tsx
+++ b/apps/web/app/(dash)/chat/chatQueryInput.tsx
@@ -116,6 +116,8 @@ function QueryInput({
 					<Divider />
 					<div className="flex justify-between items-center gap-6 h-auto bg-secondary rounded-b-3xl border-2 border-border">
 						<Combobox
+							selectedSpaces={selectedSpaces}
+							setSelectedSpaces={setSelectedSpaces}
 							options={options}
 							className="rounded-bl-3xl bg-[#3C464D] w-44"
 							onSelect={(v) =>
@@ -146,10 +148,7 @@ function QueryInput({
 									]);
 									setSelectedSpaces((prev) => [...prev, creationTask.data!]);
 								} else {
-									toast.error(
-										"Space creation failed: " + creationTask.error ??
-											"Unknown error",
-									);
+									toast.error("Space creation failed: " + creationTask.error);
 								}
 							}}
 							placeholder="Chat with a space..."
diff --git a/packages/ui/shadcn/combobox.tsx b/packages/ui/shadcn/combobox.tsx
index 7ebb1ef4..27b67152 100644
--- a/packages/ui/shadcn/combobox.tsx
+++ b/packages/ui/shadcn/combobox.tsx
@@ -9,6 +9,7 @@ import {
 	CommandItem,
 	CommandList,
 } from "./command";
+import { cn } from "../lib/utils";
 
 interface Option {
 	value: string;
@@ -21,6 +22,8 @@ interface ComboboxWithCreateProps {
 	onSubmit: (newName: string) => void;
 	selectedSpaces: number[];
 	setSelectedSpaces: React.Dispatch<React.SetStateAction<number[]>>;
+	className?: string;
+	placeholder?: string;
 }
 
 const ComboboxWithCreate = ({
@@ -29,6 +32,8 @@ const ComboboxWithCreate = ({
 	onSubmit,
 	selectedSpaces,
 	setSelectedSpaces,
+	className,
+	placeholder,
 }: ComboboxWithCreateProps) => {
 	const [inputValue, setInputValue] = useState("");
 
@@ -52,7 +57,10 @@ const ComboboxWithCreate = ({
 
 	return (
 		<Command
-			className={`group flex bg-[#2F353C] h-min rounded-md ${selectedSpaces.length > 0 && "p-2"} transition-all mt-4 mb-4`}
+			className={cn(
+				`group flex bg-[#2F353C] h-min rounded-md ${selectedSpaces.length > 0 && "p-2"} transition-all mt-4 mb-4`,
+				className,
+			)}
 		>
 			<div className="inline-flex flex-wrap gap-1">
 				{selectedSpaces.map((spaceId) => (
@@ -73,10 +81,12 @@ const ComboboxWithCreate = ({
 			<CommandInput
 				onChangeCapture={handleInputChange}
 				onKeyDown={handleKeyDown}
-				placeholder="Select or create a new space."
+				placeholder={placeholder}
 				value={inputValue}
 			/>
-			<CommandList className={`z-10 translate-x-5 opacity-0 transition-all absolute group-focus-within:opacity-100 bg-secondary p-2 rounded-b-xl max-w-64 ${selectedSpaces.length > 0 ?"translate-y-20": "translate-y-12"}`}>
+			<CommandList
+				className={`z-10 translate-x-5 opacity-0 transition-all absolute group-focus-within:opacity-100 bg-secondary p-2 rounded-b-xl max-w-64 ${selectedSpaces.length > 0 ? "translate-y-20" : "translate-y-12"}`}
+			>
 				<CommandGroup className="hidden group-focus-within:block">
 					{filteredOptions.map((option) => (
 						<CommandItem
@@ -107,4 +117,4 @@ const ComboboxWithCreate = ({
 	);
 };
 
-export default ComboboxWithCreate;
\ No newline at end of file
+export default ComboboxWithCreate;