add no result hint

Author: belka09

src/app/core/components/search/search.component.html

@@ -33,6 +33,10 @@
   </div>
   <div id="results_area" *ngIf="app.showSearchResults">
     <div class="results_header" translate="COMPONENTS.SEARCH.HEADING_SEARCH_RESULTS"></div>
+    <div class="results_no_results_wrap" *ngIf="noResults">
+      <span class="results_no_results_text" translate="COMPONENTS.SEARCH.TXT_NO_RESULTS_FOUND"></span>
+      <span class="results_no_results_link" (click)="toggleHelp()" translate="COMPONENTS.SEARCH.LNK_HELP_PANEL"></span>
+    </div>
     <ng-container *ngFor="let context of contexts">
       <ng-container *ngFor="let model of models">
         <ng-container

src/app/core/components/search/search.component.scss

@@ -114,6 +114,24 @@
       padding: 16px;
     }
 
+    .results_no_results_wrap {
+      display: flex;
+      flex-direction: column;
+      gap: 4px;
+    }
+
+    .results_no_results_text {
+      font-size: 13px;
+      font-style: normal;
+      font-weight: 400;
+    }
+
+    .results_no_results_link {
+      @extend .results_no_results_text;
+      cursor: pointer;
+      text-decoration: underline;
+    }
+
     .line_separator {
       background-color: var(--color-blue-200);
     }

src/app/core/components/search/search.component.ts

@@ -186,4 +186,9 @@ export class SearchComponent implements OnInit {
         });
     }
   };
+
+  toggleHelp() {
+    const curStatus = this.app.showHelp.getValue();
+    this.app.showHelp.next(!curStatus);
+  }
 }

src/assets/i18n/en.json

@@ -761,7 +761,9 @@
       "HEADING_SEARCH_RESULTS": "Global search results",
       "HEADING_RESULTS_IN": "Search results in: <b>{{context}}</b>",
       "LNK_VIEW_MORE_RESULTS": "View more results",
+      "LNK_HELP_PANEL": "Try here.",
       "TXT_OOPS_NO_RESULTS": "We couldn’t find any results matching your search :(",
+      "TXT_NO_RESULTS_FOUND": "No results found. Looking for help?",
       "TXT_MAYBE_TYPO": "Maybe there's a typo in your search?"
     },
     "TOPIC_IDEATION": {