Merge branch 'master' into sophie-ai-images

2 files changed, 25 insertions, 20 deletions

diff --git a/src/client/views/search/SearchBox.scss b/src/client/views/search/SearchBox.scss
index 09e459f7d..94e64b952 100644
--- a/src/client/views/search/SearchBox.scss
+++ b/src/client/views/search/SearchBox.scss
@@ -8,6 +8,7 @@
     background: none;
     z-index: 1000;
     padding: 0px;
+    overflow: auto;
     cursor: default;
 
     .searchBox-bar {
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 5dc4f5550..9f153e86d 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -55,9 +55,6 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
     @observable _deletedDocsStatus: boolean = false;
     @observable _onlyEmbeddings: boolean = true;
 
-    /**
-     * This is the constructor for the SearchBox class.
-     */
     constructor(props: SearchBoxProps) {
         super(props);
         makeObservable(this);
@@ -69,11 +66,11 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
      * the search panel, the search input box is automatically selected. This allows the user to
      * type in the search input box immediately, without needing clicking on it first.
      */
-    componentDidMount = action(() => {
+    componentDidMount() {
         if (this._inputRef.current) {
             this._inputRef.current.focus();
         }
-    });
+    }
 
     /**
      * This method is called when the SearchBox component is about to be unmounted. When the user
@@ -91,9 +88,11 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
      * (Note: There is no longer a need to press enter to submit a search. Any update to the input
      * causes a search to be submitted automatically.)
      */
+    _timeout: any = undefined;
     onInputChange = action((e: React.ChangeEvent<HTMLInputElement>) => {
         this._searchString = e.target.value;
-        this.submitSearch();
+        this._timeout && clearTimeout(this._timeout);
+        this._timeout = setTimeout(() => this.submitSearch(), 300);
     });
 
     /**
@@ -165,12 +164,13 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
      * which the first letter is capitalized. This is used when displaying the type on the
      * right side of each search result.
      */
-    static formatType(type: String): String {
-        if (type === 'pdf') {
-            return 'PDF';
-        } else if (type === 'image') {
-            return 'Img';
-        }
+    static formatType(type: string, colType: string): String {
+        switch (type) {
+            case DocumentType.PDF : return 'PDF';
+            case DocumentType.IMG : return 'Img';
+            case DocumentType.RTF : return 'Rtf';
+            case DocumentType.COL : return 'Col:'+colType.substring(0,3);
+        } // prettier-ignore
 
         return type.charAt(0).toUpperCase() + type.substring(1, 3);
     }
@@ -186,7 +186,7 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
     @action
     searchCollection(query: string) {
         this._selectedResult = undefined;
-        this._results = SearchUtil.SearchCollection(CollectionDockingView.Instance?.Document, query);
+        this._results = SearchUtil.SearchCollection(CollectionDockingView.Instance?.Document, query, this._docTypeString === 'keys');
 
         this.computePageRanks();
     }
@@ -336,6 +336,8 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
      * brushes and highlights. All search matches are cleared as well.
      */
     resetSearch = action(() => {
+        this._timeout && clearTimeout(this._timeout);
+        this._timeout = undefined;
         this._results.forEach((_, doc) => {
             DocumentManager.Instance.getFirstDocumentView(doc)?.ComponentView?.search?.('', undefined, true);
             Doc.UnBrushDoc(doc);
@@ -360,11 +362,11 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
      */
     @computed
     public get selectOptions() {
-        const selectValues = ['all', DocumentType.RTF, DocumentType.IMG, DocumentType.PDF, DocumentType.WEB, DocumentType.VID, DocumentType.AUDIO, DocumentType.COL];
+        const selectValues = ['all', DocumentType.RTF, DocumentType.IMG, DocumentType.PDF, DocumentType.WEB, DocumentType.VID, DocumentType.AUDIO, DocumentType.COL, 'keys'];
 
         return selectValues.map(value => (
             <option key={value} value={value}>
-                {SearchBox.formatType(value)}
+                {SearchBox.formatType(value, '')}
             </option>
         ));
     }
@@ -390,10 +392,10 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
                 className += ' searchBox-results-scroll-view-result-selected';
             }
 
-            const formattedType = SearchBox.formatType(StrCast(result[0].type));
+            const formattedType = SearchBox.formatType(StrCast(result[0].type), StrCast(result[0].type_collection));
             const title = result[0].title;
 
-            if (this._docTypeString === 'all' || this._docTypeString === result[0].type) {
+            if (this._docTypeString === 'keys' || this._docTypeString === 'all' || this._docTypeString === result[0].type) {
                 validResults++;
                 resultsJSX.push(
                     <Tooltip key={result[0][Id]} placement={'right'} title={<div className="dash-tooltip">{title as string}</div>}>
@@ -415,7 +417,9 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
                             }}
                             className={className}>
                             <div className="searchBox-result-title">{title as string}</div>
-                            <div className="searchBox-result-type">{formattedType}</div>
+                            <div className="searchBox-result-type" style={{ color: SettingsManager.userVariantColor }}>
+                                {formattedType}
+                            </div>
                             <div className="searchBox-result-keys" style={{ color: SettingsManager.userVariantColor }}>
                                 {result[1].join(', ')}
                             </div>
@@ -436,10 +440,10 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() {
                         </select>
                     )}
                     <input
-                        defaultValue={''}
+                        defaultValue=""
                         autoComplete="off"
                         onChange={this.onInputChange}
-                        onKeyPress={e => {
+                        onKeyDown={e => {
                             e.key === 'Enter' ? this.submitSearch() : null;
                             e.stopPropagation();
                         }}