[QuickOpen] show indicator if symbols are still being parsed (firefox-devtools#5371)

Author: atwalg2

src/components/QuickOpenModal.css

@@ -11,3 +11,8 @@
 .theme-dark .result-item .subtitle .highlight {
   color: white;
 }
+
+.loading-indicator {
+  padding: 5px 0 5px 0;
+  text-align: center;
+}

src/components/QuickOpenModal.js

@@ -357,10 +357,8 @@ export class QuickOpenModal extends Component<Props, State> {
     return !this.getResultCount() && !!query;
   }
 
-  hasPrefix = () => /^[:#@]/.test(this.props.query);
-
   render() {
-    const { enabled, query } = this.props;
+    const { enabled, query, symbols } = this.props;
     const { selectedIndex, results } = this.state;
 
     if (!enabled) {
@@ -380,12 +378,17 @@ export class QuickOpenModal extends Component<Props, State> {
           onChange={this.onChange}
           onKeyDown={this.onKeyDown}
           handleClose={this.closeModal}
-          hasPrefix={this.hasPrefix()}
           expanded={expanded}
           selectedItemId={
             expanded && items[selectedIndex] ? items[selectedIndex].id : ""
           }
         />
+        {!symbols ||
+          (symbols.functions.length == 0 && (
+            <div className="loading-indicator">
+              {L10N.getStr("loadingText")}
+            </div>
+          ))}
         {newResults && (
           <ResultList
             key="results"

src/components/tests/__snapshots__/QuickOpenModal.spec.js.snap

@@ -54,7 +54,7 @@ exports[`QuickOpenModal Basic render with mount & searchType = functions 1`] = `
               count={0}
               expanded={false}
               handleClose={[Function]}
-              hasPrefix={true}
+              hasPrefix={false}
               onChange={[Function]}
               onKeyDown={[Function]}
               placeholder="Search sources…"
@@ -117,6 +117,11 @@ exports[`QuickOpenModal Basic render with mount & searchType = functions 1`] = `
                 </CloseButton>
               </div>
             </SearchInput>
+            <div
+              className="loading-indicator"
+            >
+              Loading…
+            </div>
             <ResultList
               expanded={false}
               items={Array []}
@@ -195,7 +200,7 @@ exports[`QuickOpenModal Basic render with mount & searchType = variables 1`] = `
               count={0}
               expanded={false}
               handleClose={[Function]}
-              hasPrefix={true}
+              hasPrefix={false}
               onChange={[Function]}
               onKeyDown={[Function]}
               placeholder="Search sources…"
@@ -258,6 +263,11 @@ exports[`QuickOpenModal Basic render with mount & searchType = variables 1`] = `
                 </CloseButton>
               </div>
             </SearchInput>
+            <div
+              className="loading-indicator"
+            >
+              Loading…
+            </div>
             <ResultList
               expanded={false}
               items={Array []}
@@ -504,7 +514,7 @@ exports[`QuickOpenModal Simple goto search query = :abc & searchType = goto 1`]
               count={0}
               expanded={false}
               handleClose={[Function]}
-              hasPrefix={true}
+              hasPrefix={false}
               onChange={[Function]}
               onKeyDown={[Function]}
               placeholder="Search sources…"
@@ -567,6 +577,11 @@ exports[`QuickOpenModal Simple goto search query = :abc & searchType = goto 1`]
                 </CloseButton>
               </div>
             </SearchInput>
+            <div
+              className="loading-indicator"
+            >
+              Loading…
+            </div>
           </div>
         </div>
       </Modal>
@@ -965,7 +980,7 @@ exports[`QuickOpenModal showErrorEmoji false when goto numeric ':2222' 1`] = `
               count={0}
               expanded={false}
               handleClose={[Function]}
-              hasPrefix={true}
+              hasPrefix={false}
               onChange={[Function]}
               onKeyDown={[Function]}
               placeholder="Search sources…"
@@ -1219,7 +1234,7 @@ exports[`QuickOpenModal showErrorEmoji true when goto not numeric ':22k22' 1`] =
               count={0}
               expanded={false}
               handleClose={[Function]}
-              hasPrefix={true}
+              hasPrefix={false}
               onChange={[Function]}
               onKeyDown={[Function]}
               placeholder="Search sources…"