fix: resolve TypeScript errors in migrated components

apps/web/src/components/ui/select.tsx

@@ -0,0 +1,102 @@
+import * as React from "react";
+
+export interface SelectProps {
+  value?: string;
+  onValueChange?: (value: string) => void;
+  defaultValue?: string;
+  disabled?: boolean;
+  children?: React.ReactNode;
+}
+
+export interface SelectTriggerProps {
+  id?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export interface SelectContentProps {
+  children?: React.ReactNode;
+}
+
+export interface SelectItemProps {
+  value: string;
+  children?: React.ReactNode;
+}
+
+export interface SelectValueProps {
+  placeholder?: string;
+}
+
+const SelectContext = React.createContext<{
+  value?: string;
+  onValueChange?: (value: string) => void;
+  isOpen: boolean;
+  setIsOpen: (open: boolean) => void;
+}>({ isOpen: false, setIsOpen: () => {} });
+
+export function Select({ value, onValueChange, defaultValue, disabled, children }: SelectProps) {
+  const [isOpen, setIsOpen] = React.useState(false);
+  const [internalValue, setInternalValue] = React.useState(defaultValue);
+  
+  const currentValue = value !== undefined ? value : internalValue;
+  
+  const handleValueChange = (newValue: string) => {
+    if (value === undefined) {
+      setInternalValue(newValue);
+    }
+    onValueChange?.(newValue);
+    setIsOpen(false);
+  };
+
+  return (
+    <SelectContext.Provider value={{ value: currentValue, onValueChange: handleValueChange, isOpen, setIsOpen }}>
+      <div className="relative">{children}</div>
+    </SelectContext.Provider>
+  );
+}
+
+export function SelectTrigger({ id, className = "", children }: SelectTriggerProps) {
+  const { isOpen, setIsOpen } = React.useContext(SelectContext);
+  
+  return (
+    <button
+      id={id}
+      type="button"
+      onClick={() => setIsOpen(!isOpen)}
+      className={`flex h-10 w-full items-center justify-between rounded-md border border-gray-300 bg-white px-3 py-2 text-sm ${className}`}
+    >
+      {children}
+    </button>
+  );
+}
+
+export function SelectValue({ placeholder }: SelectValueProps) {
+  const { value } = React.useContext(SelectContext);
+  
+  return <span>{value || placeholder}</span>;
+}
+
+export function SelectContent({ children }: SelectContentProps) {
+  const { isOpen } = React.useContext(SelectContext);
+  
+  if (!isOpen) return null;
+  
+  return (
+    <div className="absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-md border border-gray-300 bg-white shadow-lg">
+      {children}
+    </div>
+  );
+}
+
+export function SelectItem({ value, children }: SelectItemProps) {
+  const { onValueChange } = React.useContext(SelectContext);
+  
+  return (
+    <div
+      onClick={() => onValueChange?.(value)}
+      className="cursor-pointer px-3 py-2 text-sm hover:bg-gray-100"
+    >
+      {children}
+    </div>
+  );
+}