fix: naive search restriction for ambiguous boards

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

Author: Akos Kitta

arduino-ide-extension/src/browser/boards/boards-config-component.tsx

@@ -23,6 +23,7 @@ namespace BoardsConfigComponent {
      * This is not the real config, it's only living in the dialog. Users can change it without update and can cancel any modifications.
      */
     readonly boardsConfig: BoardsConfigDialogState;
+    readonly searchSet: BoardIdentifier[] | undefined;
     readonly notificationCenter: NotificationCenter;
     readonly appState: FrontendApplicationState;
     readonly onFocusNodeSet: (element: HTMLElement | undefined) => void;
@@ -130,13 +131,6 @@ export class BoardsConfigComponent extends React.Component<
       this.props.onFilteredTextDidChangeEvent((query) => {
         if (typeof query === 'string') {
           this.setState({ query }, () => this.updateBoards(this.state.query));
-        } else {
-          const action = query?.action;
-          if (action === 'clear') {
-            this.setState({ query: '' }, () =>
-              this.updateBoards(this.state.query)
-            );
-          }
         }
       }),
     ]);
@@ -159,10 +153,20 @@ export class BoardsConfigComponent extends React.Component<
     );
   };
 
-  private readonly queryBoards = (
+  private readonly queryBoards = async (
     options: { query?: string } = {}
   ): Promise<Array<BoardWithPackage>> => {
-    return this.props.searchBoards(options);
+    const result = await this.props.searchBoards(options);
+    const { searchSet } = this.props;
+    if (searchSet) {
+      return result.filter((board) =>
+        searchSet.some(
+          (restriction) =>
+            restriction.fqbn === board.fqbn || restriction.name === board.fqbn
+        )
+      );
+    }
+    return result;
   };
 
   private readonly toggleFilterPorts = () => {

arduino-ide-extension/src/browser/boards/boards-config-dialog.tsx

@@ -13,6 +13,7 @@ import React from '@theia/core/shared/react';
 import type { ReactNode } from '@theia/core/shared/react/index';
 import { EditBoardsConfigActionParams } from '../../common/protocol/board-list';
 import {
+  BoardIdentifier,
   BoardsConfig,
   BoardWithPackage,
   DetectedPort,
@@ -66,6 +67,10 @@ export class BoardsConfigDialog extends ReactDialog<BoardsConfigDialogState> {
     return this.boardsServiceProvider.boardList.ports(predicate);
   };
   private _boardsConfig: BoardsConfigDialogState;
+  /**
+   * When the dialog's boards result set is limited to a subset of boards when searching, this field is set.
+   */
+  private _searchSet: BoardIdentifier[] | undefined;
   private focusNode: HTMLElement | undefined;
 
   constructor(
@@ -88,15 +93,20 @@ export class BoardsConfigDialog extends ReactDialog<BoardsConfigDialogState> {
     this.boardsServiceProvider.onBoardListDidChange(() => {
       this._boardsConfig = deepClone(this.boardsServiceProvider.boardsConfig);
       this.update();
-    }); // Do not add to `toDispose`!
+    });
     this._boardsConfig = deepClone(this.boardsServiceProvider.boardsConfig);
   }
 
   override async open(
     params?: EditBoardsConfigActionParams
   ): Promise<BoardsConfig | undefined> {
+    this._searchSet = undefined;
+    this._boardsConfig.selectedBoard =
+      this.boardsServiceProvider.boardsConfig.selectedBoard;
+    this._boardsConfig.selectedPort =
+      this.boardsServiceProvider.boardsConfig.selectedPort;
     if (params) {
-      if (params.query || typeof params.query === 'string') {
+      if (typeof params.query === 'string') {
         this.onFilterTextDidChangeEmitter.fire(params.query);
       }
       if (params.portToSelect) {
@@ -105,6 +115,9 @@ export class BoardsConfigDialog extends ReactDialog<BoardsConfigDialogState> {
       if (params.boardToSelect) {
         this._boardsConfig.selectedBoard = params.boardToSelect;
       }
+      if (params.searchSet) {
+        this._searchSet = params.searchSet.slice();
+      }
     }
     return super.open();
   }
@@ -137,6 +150,7 @@ export class BoardsConfigDialog extends ReactDialog<BoardsConfigDialogState> {
           <div className="selectBoardContainer">
             <BoardsConfigComponent
               boardsConfig={this._boardsConfig}
+              searchSet={this._searchSet}
               onBoardSelected={this.onBoardSelected}
               onPortSelected={this.onPortSelected}
               notificationCenter={this.notificationCenter}

arduino-ide-extension/src/browser/boards/boards-toolbar-item.tsx

@@ -343,7 +343,7 @@ export class BoardsToolBarItem extends React.Component<
         <BoardListDropDown
           coords={coords}
           boardList={boardList}
-          openBoardsConfig={() => boardList.onEdit()}
+          openBoardsConfig={() => boardList.onEdit({ query: '' })}
         />
       </React.Fragment>
     );

arduino-ide-extension/src/common/protocol/board-list.ts

@@ -242,38 +242,31 @@ export function createBoardListItemLabels(
   item: BoardListItem
 ): BoardListItemLabels {
   const { port } = item;
-  let boardIdentifier: BoardIdentifier = {
-    name: unknownBoard,
-    fqbn: undefined,
-  };
-  if (item.board) {
-    boardIdentifier = item.board;
-  }
+  const portLabel = port.address;
+  const portProtocol = port.protocol;
+  let board = item.board; // use default board label if any
   if (isInferredBoardListItem(item)) {
-    boardIdentifier = item.inferredBoard;
+    board = item.inferredBoard; // inferred board overrides any discovered boards
   }
-  if (!item.board && isMultiBoardsBoardListItem(item)) {
-    const name = findUniqueBoardName(item);
-    if (name) {
-      boardIdentifier = { name, fqbn: undefined };
-    } else {
-      boardIdentifier = { name: unconfirmedBoard, fqbn: undefined };
-    }
+  // if the board is still missing, maybe it's ambiguous
+  if (!board && isMultiBoardsBoardListItem(item)) {
+    const name =
+      // get a unique board name
+      findUniqueBoardName(item) ??
+      // or fall back to something else than unknown board
+      unconfirmedBoard;
+    board = { name, fqbn: undefined };
   }
-  const portLabel = port.address;
-  let boardLabel = unknownBoard;
-  let boardLabelWithFqbn = unknownBoard;
-  if (boardIdentifier) {
-    boardLabel = boardIdentifier.name;
-    if (boardIdentifier.fqbn) {
-      boardLabelWithFqbn = `${boardLabel} (${boardIdentifier.fqbn})`;
-    }
+  const boardLabel = board?.name ?? unknownBoard;
+  let boardLabelWithFqbn = boardLabel;
+  if (board?.fqbn) {
+    boardLabelWithFqbn += ` (${board.fqbn})`;
   }
   return {
     boardLabel,
     boardLabelWithFqbn,
     portLabel,
-    portProtocol: port.protocol,
+    portProtocol,
     tooltip: `${boardLabelWithFqbn}\n${portLabel}`,
   };
 }
@@ -347,7 +340,7 @@ export interface SelectBoardsConfigAction {
 export interface EditBoardsConfigActionParams {
   readonly portToSelect?: PortIdentifier;
   readonly boardToSelect?: BoardIdentifier;
-  readonly query?: string | undefined | { action: 'clear' };
+  readonly query?: string;
   readonly searchSet?: readonly BoardIdentifier[];
 }
 export interface EditBoardsConfigAction {
@@ -575,17 +568,14 @@ export function createBoardList(
           },
         };
       }
-      const params: Mutable<EditBoardsConfigActionParams> = {};
+      const params: Mutable<EditBoardsConfigActionParams> = {
+        portToSelect: item.port,
+      };
       if (isMultiBoardsBoardListItem(item)) {
         const uniqueBoardName = findUniqueBoardName(item);
-        if (uniqueBoardName) {
-          params.query = uniqueBoardName;
-        } else {
-          params.query = '';
-        }
+        params.query = uniqueBoardName ?? '';
         params.searchSet = item.boards;
       } else {
-        params.portToSelect = item.port;
         params.query = '';
       }
       return {