Explicit fallback in searchbar (#1559)

4 files changed, 20 insertions, 21 deletions

diff --git a/plugins/base/frontend/src/main/components/search/dokkaFuzzyFilter.tsx b/plugins/base/frontend/src/main/components/search/dokkaFuzzyFilter.tsx
index 6d40336f..98fb1455 100644
--- a/plugins/base/frontend/src/main/components/search/dokkaFuzzyFilter.tsx
+++ b/plugins/base/frontend/src/main/components/search/dokkaFuzzyFilter.tsx
@@ -1,5 +1,5 @@
 import {Select} from "@jetbrains/ring-ui";
-import {Option, OptionWithHighlightComponent, OptionWithSearchResult, SearchRank} from "./types";
+import {Option, OptionWithHighlightComponent, OptionWithSearchResult} from "./types";
 import fuzzyHighlight from '@jetbrains/ring-ui/components/global/fuzzy-highlight.js'
 import React from "react";
 import {SearchResultRow, signatureFromSearchResult} from "./searchResultRow";
@@ -8,7 +8,7 @@ import _ from "lodash";
 const orderRecords = (records: OptionWithSearchResult[], searchPhrase: string): OptionWithSearchResult[] => {
     return records.sort((a: OptionWithSearchResult, b: OptionWithSearchResult) => {
         //Prefer higher rank
-        const byRank = b.rank - a.rank
+        const byRank = a.rank - b.rank
         if(byRank !== 0){
             return byRank
         }
@@ -70,23 +70,29 @@ export class DokkaFuzzyFilterComponent extends Select {
         }
     }
     
-    getListItems(rawFilterString: string, _: Option[]) {
+    getListItems(rawFilterString: string, e: Option[]) {
         const filterPhrase = (rawFilterString ? rawFilterString : '').trim()
         const matchedRecords = this.props.data
             .map((record: Option) => {
-                const bySearchKey = fuzzyHighlight(filterPhrase, record.searchKey, false)
-                if(bySearchKey.matched){
+                const searched = record.searchKeys.map((value, index) => {
                     return {
-                        ...bySearchKey,
+                        ...fuzzyHighlight(filterPhrase, value, false),
                         ...record,
-                        rank: SearchRank.SearchKeyMatch
+                        rank: index
                     }
+                }).filter((e) => e.matched)
+
+                const first = _.head(searched)
+
+                if(first){
+                    return first
                 }
+
                 return {
-                    ...fuzzyHighlight(filterPhrase, record.name, false),
+                    matched: false,
                     ...record,
-                    rank: SearchRank.NameMatch
                 }
+
             })
             .filter((record: OptionWithSearchResult) => record.matched && (hasAnyMatchedPhraseLongerThan(record, 3) || filterPhrase.length < 3))
 
diff --git a/plugins/base/frontend/src/main/components/search/search.tsx b/plugins/base/frontend/src/main/components/search/search.tsx
index ba7f6093..3616a396 100644
--- a/plugins/base/frontend/src/main/components/search/search.tsx
+++ b/plugins/base/frontend/src/main/components/search/search.tsx
@@ -47,7 +47,7 @@ export const WithFuzzySearchFilter = () => {
     if (pages) {
         data = pages.map((page, i) => ({
             ...page,
-            label: page.searchKey,
+            label: page.name,
             key: i + 1,
             type: page.kind,
             rgItemType: List.ListProps.Type.CUSTOM
diff --git a/plugins/base/frontend/src/main/components/search/searchResultRow.tsx b/plugins/base/frontend/src/main/components/search/searchResultRow.tsx
index 5910eec4..b9dbf482 100644
--- a/plugins/base/frontend/src/main/components/search/searchResultRow.tsx
+++ b/plugins/base/frontend/src/main/components/search/searchResultRow.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import {OptionWithSearchResult, SearchProps, SearchRank} from "./types";
+import {OptionWithSearchResult, SearchProps} from "./types";
 import _ from "lodash";
 
 type HighlighterProps = {
@@ -11,10 +11,7 @@ const Highlighter: React.FC<HighlighterProps> = ({label}: HighlighterProps) => {
 }
 
 export const signatureFromSearchResult = (searchResult: OptionWithSearchResult): string => {
-    if(searchResult.rank == SearchRank.SearchKeyMatch){
-        return searchResult.name.replace(searchResult.searchKey, searchResult.highlight)
-    }
-    return searchResult.highlight
+    return searchResult.name.replace(searchResult.searchKeys[searchResult.rank], searchResult.highlight)
 }
 
 export const SearchResultRow: React.FC<SearchProps> = ({searchResult}: SearchProps) => {
diff --git a/plugins/base/frontend/src/main/components/search/types.ts b/plugins/base/frontend/src/main/components/search/types.ts
index 11e2edf8..84e55399 100644
--- a/plugins/base/frontend/src/main/components/search/types.ts
+++ b/plugins/base/frontend/src/main/components/search/types.ts
@@ -4,7 +4,7 @@ export type Page = {
     name: string;
     kind: string;
     location: string;
-    searchKey: string;
+    searchKeys: string[];
     description: string;
 }
 
@@ -24,14 +24,10 @@ export type Props = {
     data: Option[]
 };
 
-export enum SearchRank {
-    SearchKeyMatch = 1,
-    NameMatch = 0
-}
 export type OptionWithSearchResult = Option & {
     matched: boolean,
     highlight: string,
-    rank: SearchRank
+    rank: number
 }
 
 export type OptionWithHighlightComponent = Option & {