From fce42d12b4a9ac61f6940fa98ef4a4865afc0a11 Mon Sep 17 00:00:00 2001
From: arvinxx <arvinx@foxmail.com>
Date: Sun, 14 Feb 2021 14:13:28 +0800
Subject: [PATCH] =?UTF-8?q?:bug:=20fix:=20=E4=BF=AE=E6=AD=A3=20search=20ba?=
 =?UTF-8?q?r=20=E5=BC=80=E5=8F=91=E6=97=B6=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 config/config.ts                              |  3 +++
 .../app/SearchResult/useKeyboardResult.ts     | 19 +++++++++----------
 src/contentScripts/searchBar/app/index.tsx    |  4 ++--
 .../searchBar/app/useSearchService.ts         |  8 +++++---
 src/utils/env.ts                              |  1 +
 5 files changed, 20 insertions(+), 15 deletions(-)

diff --git a/config/config.ts b/config/config.ts
index 1b6c792..6930b30 100644
--- a/config/config.ts
+++ b/config/config.ts
@@ -10,6 +10,9 @@ export default defineConfig({
     theme: resolve(__dirname, '../src/theme'),
   },
   theme,
+  define: {
+    'process.env.SEARCH_BAR': process.env.SEARCH_BAR,
+  },
   // chrome 插件配置项
   extensions: {
     name: `Power Yuque${isDev ? ' DEV' : ''}`,
diff --git a/src/contentScripts/searchBar/app/SearchResult/useKeyboardResult.ts b/src/contentScripts/searchBar/app/SearchResult/useKeyboardResult.ts
index 9e13efa..69b0df6 100644
--- a/src/contentScripts/searchBar/app/SearchResult/useKeyboardResult.ts
+++ b/src/contentScripts/searchBar/app/SearchResult/useKeyboardResult.ts
@@ -18,25 +18,25 @@ export const useKeyboardResult = () => {
 
   const [resultIndex, setResultIndex] = useState(0);
   const resultRef = useRef<HTMLDivElement>(null);
-  console.log('real', resultIndex);
 
   /**
    * 处理结果区高度
    */
-  const scrollResultContainer = (index: number, back?: boolean) => {
+  const scrollResultContainer = (back?: boolean) => {
     const { current: ctn } = resultRef;
     if (!ctn) return;
 
     const step = 77;
 
-    if (index === result.length) {
-      ctn.scrollTop = 0;
-    }
-
     if (!back) {
-      if (index > 3) {
+      if (resultIndex > 3) {
         ctn.scrollTop += step;
       }
+
+      // 最后一个
+      if (resultIndex === result.length - 1) {
+        ctn.scrollTop = 0;
+      }
     } else if (ctn.scrollTop > 0) {
       ctn.scrollTop -= step;
     }
@@ -65,7 +65,6 @@ export const useKeyboardResult = () => {
   // 将焦点切换到 Options
   const onKeyDown = (event: KeyboardEvent) => {
     if (focusKey !== 'result') return;
-    console.log(resultIndex);
 
     switch (event.key) {
       case 'Tab':
@@ -74,7 +73,7 @@ export const useKeyboardResult = () => {
         break;
       case 'ArrowDown':
         event.preventDefault();
-        scrollResultContainer(resultIndex + 1);
+        scrollResultContainer();
         switchResultIndex();
         break;
       case 'ArrowUp':
@@ -83,7 +82,7 @@ export const useKeyboardResult = () => {
         if (resultIndex === 0) {
           focusOnOptions();
         } else {
-          scrollResultContainer(resultIndex - 1, true);
+          scrollResultContainer(true);
           switchResultIndex(true);
         }
         break;
diff --git a/src/contentScripts/searchBar/app/index.tsx b/src/contentScripts/searchBar/app/index.tsx
index 93be79e..09c4686 100644
--- a/src/contentScripts/searchBar/app/index.tsx
+++ b/src/contentScripts/searchBar/app/index.tsx
@@ -12,7 +12,7 @@ import SearchInput from './SearchInput';
 import SearchResult from './SearchResult';
 
 import styles from './style.less';
-import { isDev } from '@/utils';
+import { isDevSearchBar } from '@/utils';
 
 const SearchBar: FC = () => {
   const { visible, searchBarRef } = useContext(SearchBarService);
@@ -77,7 +77,7 @@ const SearchBar: FC = () => {
 
 export default () => (
   <YuqueTokenService.Provider value={useYuqueTokenService()}>
-    <SearchBarService.Provider value={useSearchBarService(isDev)}>
+    <SearchBarService.Provider value={useSearchBarService(isDevSearchBar)}>
       <SearchService.Provider value={useSearchService()}>
         <SearchBar />
       </SearchService.Provider>
diff --git a/src/contentScripts/searchBar/app/useSearchService.ts b/src/contentScripts/searchBar/app/useSearchService.ts
index 5c397db..2ac6c73 100644
--- a/src/contentScripts/searchBar/app/useSearchService.ts
+++ b/src/contentScripts/searchBar/app/useSearchService.ts
@@ -14,7 +14,7 @@ import {
   distinctUntilChanged,
 } from 'rxjs/operators';
 
-import { getServiceToken, request } from '@/utils';
+import { getServiceToken, isDevSearchBar, request } from '@/utils';
 
 /**
  * SearchInput 需要的状态
@@ -92,8 +92,10 @@ export const useSearchService = () => {
 
   // TEST 用于测试 list 的代码
   useEffect(() => {
-    // @ts-ignore
-    onSearchEvent({ target: { value: '设计' } });
+    if (isDevSearchBar) {
+      // @ts-ignore
+      onSearchEvent({ target: { value: '设计' } });
+    }
   }, []);
 
   return {
diff --git a/src/utils/env.ts b/src/utils/env.ts
index 7e06fc7..d091c8e 100644
--- a/src/utils/env.ts
+++ b/src/utils/env.ts
@@ -1,5 +1,6 @@
 export const isDev = process.env.NODE_ENV === 'development';
 export const isTest = process.env.NODE_ENV === 'test';
+export const isDevSearchBar = process.env.SEARCH_BAR === '1';
 
 export const yuqueToken = isTest
   ? process.env.YUQUE_TOKEN!