Show no match.

Signed-off-by: Akos Kitta <[email protected]>

Author: Akos Kitta

arduino-ide-extension/src/browser/style/list-widget.css

@@ -59,6 +59,13 @@
     filter: contrast(90%);
 }
 
+.filterable-list-container .no-match {
+    font-weight: bold;
+    color: var(--theia-panelTitle-inactiveForeground);
+    align-items: center;
+    margin-top: 10px;
+}
+
 .component-list-item {
     padding: 10px 10px 10px 15px;
     font-size: var(--theia-ui-font-size1);

arduino-ide-extension/src/browser/widgets/component-list/component-list.tsx

@@ -1,3 +1,4 @@
+import { nls } from '@theia/core/lib/common/nls';
 import * as React from '@theia/core/shared/react';
 import AutoSizer from 'react-virtualized/dist/commonjs/AutoSizer';
 import {
@@ -67,6 +68,7 @@ export class ComponentList<T extends ArduinoComponent> extends React.Component<
               rowHeight={this.cache.rowHeight}
               deferredMeasurementCache={this.cache}
               ref={this.setListRef}
+              noRowsRenderer={this.renderNoMatch}
             />
           );
         }}
@@ -136,6 +138,14 @@ export class ComponentList<T extends ArduinoComponent> extends React.Component<
       </CellMeasurer>
     );
   };
+
+  private renderNoMatch = (): JSX.Element => {
+    return (
+      <div className="no-match">
+        {nls.localize('arduino/listWidget/noMatch', 'No match')}
+      </div>
+    );
+  };
 }
 
 export namespace ComponentList {

i18n/en.json

@@ -272,6 +272,9 @@
     "libraryType": {
       "installed": "Installed"
     },
+    "listWidget": {
+      "noMatch": "No match"
+    },
     "menu": {
       "advanced": "Advanced",
       "sketch": "Sketch",