feat: support updates in lib/boards widget

 - can show badge with updates count,
 - better hover for libraries and platforms,
 - save/restore widget state (Closes #1398),
 - fixed `sentence` and `paragraph` order (Ref #1611)

Signed-off-by: Akos Kitta <a.kitta@arduino.cc>

Author: Akos Kitta

arduino-ide-extension/src/browser/arduino-ide-frontend-module.ts

@@ -9,7 +9,10 @@ import {
   FrontendApplicationContribution,
   FrontendApplication as TheiaFrontendApplication,
 } from '@theia/core/lib/browser/frontend-application';
-import { LibraryListWidget } from './library/library-list-widget';
+import {
+  LibraryListWidget,
+  LibraryListWidgetSearchOptions,
+} from './library/library-list-widget';
 import { ArduinoFrontendContribution } from './arduino-frontend-contribution';
 import {
   LibraryService,
@@ -25,7 +28,10 @@ import {
 } from '../common/protocol/sketches-service';
 import { SketchesServiceClientImpl } from './sketches-service-client-impl';
 import { CoreService, CoreServicePath } from '../common/protocol/core-service';
-import { BoardsListWidget } from './boards/boards-list-widget';
+import {
+  BoardsListWidget,
+  BoardsListWidgetSearchOptions,
+} from './boards/boards-list-widget';
 import { BoardsListWidgetFrontendContribution } from './boards/boards-widget-frontend-contribution';
 import { BoardsServiceProvider } from './boards/boards-service-provider';
 import { WorkspaceService as TheiaWorkspaceService } from '@theia/workspace/lib/browser/workspace-service';
@@ -73,7 +79,10 @@ import {
 } from '../common/protocol/config-service';
 import { MonitorWidget } from './serial/monitor/monitor-widget';
 import { MonitorViewContribution } from './serial/monitor/monitor-view-contribution';
-import { TabBarDecoratorService as TheiaTabBarDecoratorService } from '@theia/core/lib/browser/shell/tab-bar-decorator';
+import {
+  TabBarDecorator,
+  TabBarDecoratorService as TheiaTabBarDecoratorService,
+} from '@theia/core/lib/browser/shell/tab-bar-decorator';
 import { TabBarDecoratorService } from './theia/core/tab-bar-decorator';
 import { ProblemManager as TheiaProblemManager } from '@theia/markers/lib/browser';
 import { ProblemManager } from './theia/markers/problem-manager';
@@ -313,10 +322,10 @@ import { PreferencesEditorWidget } from './theia/preferences/preference-editor-w
 import { PreferencesWidget } from '@theia/preferences/lib/browser/views/preference-widget';
 import { createPreferencesWidgetContainer } from '@theia/preferences/lib/browser/views/preference-widget-bindings';
 import {
-  BoardsFilterRenderer,
-  LibraryFilterRenderer,
-} from './widgets/component-list/filter-renderer';
-import { CheckForUpdates } from './contributions/check-for-updates';
+  CheckForUpdates,
+  BoardsUpdates,
+  LibraryUpdates,
+} from './contributions/check-for-updates';
 import { OutputEditorFactory } from './theia/output/output-editor-factory';
 import { StartupTaskProvider } from '../electron-common/startup-task';
 import { DeleteSketch } from './contributions/delete-sketch';
@@ -356,6 +365,11 @@ import { Account } from './contributions/account';
 import { SidebarBottomMenuWidget } from './theia/core/sidebar-bottom-menu-widget';
 import { SidebarBottomMenuWidget as TheiaSidebarBottomMenuWidget } from '@theia/core/lib/browser/shell/sidebar-bottom-menu-widget';
 import { CreateCloudCopy } from './contributions/create-cloud-copy';
+import {
+  BoardsListWidgetTabBarDecorator,
+  LibraryListWidgetTabBarDecorator,
+} from './widgets/component-list/list-widget-tabbar-decorator';
+import { HoverService } from './theia/core/hover-service';
 
 export default new ContainerModule((bind, unbind, isBound, rebind) => {
   // Commands and toolbar items
@@ -371,8 +385,6 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
 
   // Renderer for both the library and the core widgets.
   bind(ListItemRenderer).toSelf().inSingletonScope();
-  bind(LibraryFilterRenderer).toSelf().inSingletonScope();
-  bind(BoardsFilterRenderer).toSelf().inSingletonScope();
 
   // Library service
   bind(LibraryService)
@@ -395,6 +407,11 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
     LibraryListWidgetFrontendContribution
   );
   bind(OpenHandler).toService(LibraryListWidgetFrontendContribution);
+  bind(TabBarToolbarContribution).toService(
+    LibraryListWidgetFrontendContribution
+  );
+  bind(CommandContribution).toService(LibraryListWidgetFrontendContribution);
+  bind(LibraryListWidgetSearchOptions).toSelf().inSingletonScope();
 
   // Sketch list service
   bind(SketchesService)
@@ -464,6 +481,11 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
     BoardsListWidgetFrontendContribution
   );
   bind(OpenHandler).toService(BoardsListWidgetFrontendContribution);
+  bind(TabBarToolbarContribution).toService(
+    BoardsListWidgetFrontendContribution
+  );
+  bind(CommandContribution).toService(BoardsListWidgetFrontendContribution);
+  bind(BoardsListWidgetSearchOptions).toSelf().inSingletonScope();
 
   // Board select dialog
   bind(BoardsConfigDialogWidget).toSelf().inSingletonScope();
@@ -1034,4 +1056,20 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
   bind(FrontendApplicationContribution).toService(DaemonPort);
   bind(IsOnline).toSelf().inSingletonScope();
   bind(FrontendApplicationContribution).toService(IsOnline);
+
+  bind(HoverService).toSelf().inSingletonScope();
+  bind(LibraryUpdates).toSelf().inSingletonScope();
+  bind(FrontendApplicationContribution).toService(LibraryUpdates);
+  bind(LibraryListWidgetTabBarDecorator).toSelf().inSingletonScope();
+  bind(TabBarDecorator).toService(LibraryListWidgetTabBarDecorator);
+  bind(FrontendApplicationContribution).toService(
+    LibraryListWidgetTabBarDecorator
+  );
+  bind(BoardsUpdates).toSelf().inSingletonScope();
+  bind(FrontendApplicationContribution).toService(BoardsUpdates);
+  bind(BoardsListWidgetTabBarDecorator).toSelf().inSingletonScope();
+  bind(TabBarDecorator).toService(BoardsListWidgetTabBarDecorator);
+  bind(FrontendApplicationContribution).toService(
+    BoardsListWidgetTabBarDecorator
+  );
 });

arduino-ide-extension/src/browser/boards/boards-list-widget.ts

@@ -1,3 +1,4 @@
+import { nls } from '@theia/core/lib/common';
 import {
   inject,
   injectable,
@@ -8,10 +9,18 @@ import {
   BoardsPackage,
   BoardsService,
 } from '../../common/protocol/boards-service';
-import { ListWidget } from '../widgets/component-list/list-widget';
 import { ListItemRenderer } from '../widgets/component-list/list-item-renderer';
-import { nls } from '@theia/core/lib/common';
-import { BoardsFilterRenderer } from '../widgets/component-list/filter-renderer';
+import {
+  ListWidget,
+  ListWidgetSearchOptions,
+} from '../widgets/component-list/list-widget';
+
+@injectable()
+export class BoardsListWidgetSearchOptions extends ListWidgetSearchOptions<BoardSearch> {
+  get defaultOptions(): Required<BoardSearch> {
+    return { query: '', type: 'All' };
+  }
+}
 
 @injectable()
 export class BoardsListWidget extends ListWidget<BoardsPackage, BoardSearch> {
@@ -21,7 +30,8 @@ export class BoardsListWidget extends ListWidget<BoardsPackage, BoardSearch> {
   constructor(
     @inject(BoardsService) service: BoardsService,
     @inject(ListItemRenderer) itemRenderer: ListItemRenderer<BoardsPackage>,
-    @inject(BoardsFilterRenderer) filterRenderer: BoardsFilterRenderer
+    @inject(BoardsListWidgetSearchOptions)
+    searchOptions: BoardsListWidgetSearchOptions
   ) {
     super({
       id: BoardsListWidget.WIDGET_ID,
@@ -31,8 +41,7 @@ export class BoardsListWidget extends ListWidget<BoardsPackage, BoardSearch> {
       installable: service,
       itemLabel: (item: BoardsPackage) => item.name,
       itemRenderer,
-      filterRenderer,
-      defaultSearchOptions: { query: '', type: 'All' },
+      searchOptions,
     });
   }
 

arduino-ide-extension/src/browser/boards/boards-widget-frontend-contribution.ts

@@ -1,17 +1,28 @@
-import { injectable } from '@theia/core/shared/inversify';
+import { MenuPath } from '@theia/core';
+import { Command } from '@theia/core/lib/common/command';
+import { nls } from '@theia/core/lib/common/nls';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { Type as TypeLabel } from '../../common/nls';
 import {
   BoardSearch,
   BoardsPackage,
 } from '../../common/protocol/boards-service';
 import { URI } from '../contributions/contribution';
+import { MenuActionTemplate, SubmenuTemplate } from '../menu/register-menu';
 import { ListWidgetFrontendContribution } from '../widgets/component-list/list-widget-frontend-contribution';
-import { BoardsListWidget } from './boards-list-widget';
+import {
+  BoardsListWidget,
+  BoardsListWidgetSearchOptions,
+} from './boards-list-widget';
 
 @injectable()
 export class BoardsListWidgetFrontendContribution extends ListWidgetFrontendContribution<
   BoardsPackage,
   BoardSearch
 > {
+  @inject(BoardsListWidgetSearchOptions)
+  protected readonly searchOptions: BoardsListWidgetSearchOptions;
+
   constructor() {
     super({
       widgetId: BoardsListWidget.WIDGET_ID,
@@ -37,4 +48,51 @@ export class BoardsListWidgetFrontendContribution extends ListWidgetFrontendCont
   protected parse(uri: URI): BoardSearch | undefined {
     return BoardSearch.UriParser.parse(uri);
   }
+
+  protected buildFilterMenuGroup(
+    menuPath: MenuPath
+  ): Array<MenuActionTemplate | SubmenuTemplate> {
+    const typeSubmenuPath = [...menuPath, TypeLabel];
+    return [
+      {
+        submenuPath: typeSubmenuPath,
+        menuLabel: `${TypeLabel}: "${
+          BoardSearch.TypeLabels[this.searchOptions.options.type]
+        }"`,
+        options: { order: String(0) },
+      },
+      ...this.buildMenuActions<BoardSearch.Type>(
+        typeSubmenuPath,
+        BoardSearch.TypeLiterals.slice(),
+        (type) => this.searchOptions.options.type === type,
+        (type) => this.searchOptions.update({ type }),
+        (type) => BoardSearch.TypeLabels[type]
+      ),
+    ];
+  }
+
+  protected get showViewFilterContextMenuCommand(): Command & {
+    label: string;
+  } {
+    return BoardsListWidgetFrontendContribution.Commands
+      .SHOW_BOARDS_LIST_WIDGET_FILTER_CONTEXT_MENU;
+  }
+
+  protected get showInstalledCommandId(): string {
+    return 'arduino-show-installed-boards';
+  }
+
+  protected get showUpdatesCommandId(): string {
+    return 'arduino-show-boards-updates';
+  }
+}
+export namespace BoardsListWidgetFrontendContribution {
+  export namespace Commands {
+    export const SHOW_BOARDS_LIST_WIDGET_FILTER_CONTEXT_MENU: Command & {
+      label: string;
+    } = {
+      id: 'arduino-boards-list-widget-show-filter-context-menu',
+      label: nls.localize('arduino/boards/filterBoards', 'Filter Boards...'),
+    };
+  }
 }