From 5c9b8377a8a80ace1bf526c11a0b9d0110db4714 Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Wed, 2 Mar 2022 11:20:45 +0800
Subject: [PATCH] =?UTF-8?q?=E6=90=9C=E7=B4=A2=E5=BE=AE=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 themes/NEXT/components/SearchInput.js | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/themes/NEXT/components/SearchInput.js b/themes/NEXT/components/SearchInput.js
index 25dc8ccb..73aa521b 100644
--- a/themes/NEXT/components/SearchInput.js
+++ b/themes/NEXT/components/SearchInput.js
@@ -4,7 +4,7 @@ import { useImperativeHandle, useRef, useState } from 'react'
 
 const SearchInput = ({ currentTag, currentSearch, cRef }) => {
   const { locale } = useGlobal()
-  const [searchKey, setSearchKey] = useState(currentSearch || '')
+  // const [searchKey, setSearchKey] = useState(currentSearch || '')
   const [onLoading, setLoadingState] = useState(false)
   const router = useRouter()
   const searchInputRef = useRef()
@@ -36,11 +36,10 @@ const SearchInput = ({ currentTag, currentSearch, cRef }) => {
   }
   const cleanSearch = () => {
     searchInputRef.current.value = ''
-    setSearchKey('')
   }
 
   const updateSearchKey = (val) => {
-    setSearchKey(val)
+    searchInputRef.current.value = val
   }
 
   return <div className='flex border dark:border-gray-600 w-full bg-gray-100 dark:bg-gray-900'>
@@ -51,12 +50,12 @@ const SearchInput = ({ currentTag, currentSearch, cRef }) => {
       className={'w-full text-sm pl-4 transition focus:shadow-lg font-light leading-10 border-gray-300 text-black bg-gray-100 dark:bg-gray-900 dark:text-white'}
       onKeyUp={handleKeyUp}
       onChange={e => updateSearchKey(e.target.value)}
-      defaultValue={searchKey}
+      defaultValue={currentSearch}
     />
-    {(searchKey && searchKey.length && <i className='fas fa-times text-gray-300 float-right m-3 cursor-pointer' onClick={cleanSearch} />)}
+    {(currentSearch && currentSearch.length > 0 && <i className='fas fa-times text-gray-300 float-right m-3 cursor-pointer' onClick={cleanSearch} />)}
 
     <div className='p-3 bg-gray-50 flex border-l dark:border-gray-700 dark:hover:bg-gray-800 dark:bg-gray-600 justify-center items-center cursor-pointer'
-      onClick={() => { handleSearch(searchKey) }}>
+      onClick={handleSearch}>
         <i className={`${onLoading ? 'fa-spinner animate-spin ' : 'fa-search'} fas hover:scale-125 hover:text-black transform duration-200 dark:text-gray-300 dark:hover:text-white text-gray-600 cursor-pointer`} />
     </div>
   </div>