Merge branch 'zzf-search'

src/components/layout/navbar/MobileSearch.tsx

@@ -14,7 +14,7 @@ export const MobileSearchBar = ({
 }) => {
   return (
     <>
-      <div className="block w-full justify-center mx-auto  mt-8 z-10 max-w-screen-2xl px-4">
+      <div className="block w-full justify-center mx-auto  mt-8 z-10 max-w-[1200px] ">
         <Suspense fallback={<SearchSkeleton />}>
           <Search search={false} onClose={onClose} />
         </Suspense>

src/components/layout/navbar/Search.tsx

@@ -4,7 +4,7 @@ import { useRouter, useSearchParams } from "next/navigation";
 import { useEffect, useRef, useState } from "react";
 import { createUrl } from "@/utils/helper";
 import { ArrowLeftIcon } from "@heroicons/react/24/outline";
-import { useMediaQuery } from "@utils/hooks/useMediaQueryHook";
+// import { useMediaQuery } from "@utils/hooks/useMediaQueryHook";
 
 export default function Search({
   search = false,
@@ -83,11 +83,11 @@ export default function Search({
       handleSubmit();
     }
   };
-  const isDesktop = useMediaQuery("(min-width: 1024px)");
+  // const isDesktop = useMediaQuery("(min-width: 1024px)");
    // 当前显示的占位文案
   const currentPlaceholder = placeholderList[placeholderIndex];
   return (
-  <div className={`${isDesktop ? "max-w-[550px]" : ""} relative w-full mx-auto xl:min-w-[516px] outline-none hover:outline-none`}>
+  <div className={` relative w-full mx-auto xl:min-w-[516px] outline-none hover:outline-none`}>
       {setSearch && (
         <button
           onClick={() => setSearch(!search)}

src/components/layout/navbar/SearchPop.tsx

@@ -28,7 +28,7 @@ export default function SearchPop({
   open,
   onClose,
 }: SearchPopProps) {
-  const { data, error, searchProducts } = useSearchProduct();
+  const { data, error, searchProducts,loading } = useSearchProduct();
 
   const [keyword, setKeyword] = useState("");
   const [placeholderIndex, setPlaceholderIndex] = useState(0);
@@ -384,7 +384,9 @@ export default function SearchPop({
               </Grid>
             ) :
             null} */}
-            <p className="text-center font-medium text-base leading-[24px] mb-9">Sorry, we couldn't find any results</p>
+            {(hasKeyword && !loading && products.length === 0)&&(
+               <p className="text-center font-medium text-base leading-[24px] mb-9">Sorry, we couldn't find any results</p>
+            )}
             <Recommend 
               paddingClassName="py-0"
               titleClassName="text-base font-semibold"