Refactor code structure and remove redundant changes

src-old/components/search/SearchDropdown.tsx

@@ -0,0 +1,69 @@
+import { useState, useRef, useEffect } from 'react';
+import { Search } from 'lucide-react';
+import { Input } from '@/components/ui/input';
+import { SearchResults } from './SearchResults';
+
+export function SearchDropdown() {
+  const [query, setQuery] = useState('');
+  const [isOpen, setIsOpen] = useState(false);
+  const [isFocused, setIsFocused] = useState(false);
+  const searchRef = useRef<HTMLDivElement>(null);
+  const inputRef = useRef<HTMLInputElement>(null);
+
+  useEffect(() => {
+    const handleClickOutside = (event: MouseEvent) => {
+      if (searchRef.current && !searchRef.current.contains(event.target as Node)) {
+        setIsOpen(false);
+        setIsFocused(false);
+      }
+    };
+
+    document.addEventListener('mousedown', handleClickOutside);
+    return () => document.removeEventListener('mousedown', handleClickOutside);
+  }, []);
+
+  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const value = e.target.value;
+    setQuery(value);
+    setIsOpen(value.length >= 1);
+  };
+
+  const handleInputFocus = () => {
+    setIsFocused(true);
+    if (query.length >= 1) {
+      setIsOpen(true);
+    }
+  };
+
+  const handleClose = () => {
+    setIsOpen(false);
+    setQuery('');
+    inputRef.current?.blur();
+  };
+
+  return (
+    <div ref={searchRef} className={`relative w-full min-w-0 transition-all duration-300 ${isFocused ? 'scale-105' : ''}`}>
+      <div className="relative w-full min-w-0">
+        <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground w-4 h-4 flex-shrink-0" />
+        <Input
+          ref={inputRef}
+          id="search-input"
+          name="search"
+          placeholder="Search parks, rides..."
+          value={query}
+          onChange={handleInputChange}
+          onFocus={handleInputFocus}
+          className={`pl-10 pr-4 w-full bg-muted/50 border-border/50 focus:border-primary/50 transition-all duration-300 ${
+            isFocused ? 'shadow-lg shadow-primary/10' : ''
+          }`}
+        />
+      </div>
+      
+      {isOpen && (
+        <div className="absolute top-full mt-1 left-0 right-0 bg-popover border border-border rounded-lg shadow-xl z-[100] max-w-2xl">
+          <SearchResults query={query} onClose={handleClose} />
+        </div>
+      )}
+    </div>
+  );
+}