refactor: replace socket prop usage with window.socketManager for consistent socket handling across components

src/components/header/SearchBar.js

@@ -12,12 +12,10 @@ import IconButton from "@mui/material/IconButton";
 import SearchIcon from "@mui/icons-material/Search";
 import KeyboardReturnIcon from "@mui/icons-material/KeyboardReturn";
 import { useNavigate, useLocation } from "react-router-dom";
-import SocketContext from "../../contexts/SocketContext.js";
 
 const SearchBar = () => {
   const navigate = useNavigate();
   const location = useLocation();
-  const context = React.useContext(SocketContext);
   const searchParams = new URLSearchParams(location.search);
 
   // State management
@@ -60,7 +58,7 @@ const SearchBar = () => {
   // @note Autocomplete function using getSearchProducts Socket.io API - returns objects with name and seoName
   const fetchAutocomplete = React.useCallback(
     (query) => {
-      if (!context || !context.socket || !context.socket.connected || !query || query.length < 2) {
+      if (!query || query.length < 2) {
         setSuggestions([]);
         setShowSuggestions(false);
         setLoadingSuggestions(false);
@@ -69,7 +67,7 @@ const SearchBar = () => {
 
       setLoadingSuggestions(true);
 
-      context.socket.emit(
+      window.socketManager.emit(
         "getSearchProducts",
         {
           query: query.trim(),
@@ -92,7 +90,7 @@ const SearchBar = () => {
         }
       );
     },
-    [context]
+    []
   );
 
   const handleSearchChange = (e) => {