ATL-750: Handle board name change after install.

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

Author: Akos Kitta

Diff for: .vscode/launch.json

@@ -34,6 +34,7 @@
       "args": [
         "--log-level=debug",
         "--hostname=localhost",
+        "--no-cluster",
         "--remote-debugging-port=9222",
         "--no-app-auto-install",
         "--plugins=local-dir:plugins"
@@ -60,6 +61,7 @@
       "args": [
         "--hostname=0.0.0.0",
         "--port=3000",
+        "--no-cluster",
         "--no-app-auto-install",
         "--plugins=local-dir:plugins"
       ],

Diff for: arduino-ide-extension/package.json

@@ -120,7 +120,7 @@
   ],
   "arduino": {
     "cli": {
-      "version": "20201112"
+      "version": "20201201"
     }
   }
 }

Diff for: arduino-ide-extension/src/browser/arduino-frontend-contribution.tsx

@@ -272,8 +272,8 @@ export class ArduinoFrontendContribution implements FrontendApplicationContribut
             }
         });
         registry.registerCommand(ArduinoCommands.OPEN_BOARDS_DIALOG, {
-            execute: async () => {
-                const boardsConfig = await this.boardsConfigDialog.open();
+            execute: async (query?: string | undefined) => {
+                const boardsConfig = await this.boardsConfigDialog.open(query);
                 if (boardsConfig) {
                     this.boardsServiceClientImpl.boardsConfig = boardsConfig;
                 }

Diff for: arduino-ide-extension/src/browser/boards/boards-config-dialog-widget.tsx

@@ -19,6 +19,7 @@ export class BoardsConfigDialogWidget extends ReactWidget {
     @inject(NotificationCenter)
     protected readonly notificationCenter: NotificationCenter;
 
+    protected readonly onFilterTextDidChangeEmitter = new Emitter<string>();
     protected readonly onBoardConfigChangedEmitter = new Emitter<BoardsConfig.Config>();
     readonly onBoardConfigChanged = this.onBoardConfigChangedEmitter.event;
 
@@ -27,6 +28,14 @@ export class BoardsConfigDialogWidget extends ReactWidget {
     constructor() {
         super();
         this.id = 'select-board-dialog';
+        this.toDispose.pushAll([
+            this.onBoardConfigChangedEmitter,
+            this.onFilterTextDidChangeEmitter
+        ]);
+    }
+
+    search(query: string): void {
+        this.onFilterTextDidChangeEmitter.fire(query);
     }
 
     protected fireConfigChanged = (config: BoardsConfig.Config) => {
@@ -43,7 +52,8 @@ export class BoardsConfigDialogWidget extends ReactWidget {
                 boardsServiceProvider={this.boardsServiceClient}
                 notificationCenter={this.notificationCenter}
                 onConfigChange={this.fireConfigChanged}
-                onFocusNodeSet={this.setFocusNode} />
+                onFocusNodeSet={this.setFocusNode}
+                onFilteredTextDidChangeEvent={this.onFilterTextDidChangeEmitter.event} />
         </div>;
     }
 

Diff for: arduino-ide-extension/src/browser/boards/boards-config-dialog.ts

@@ -1,10 +1,10 @@
 import { injectable, inject, postConstruct } from 'inversify';
 import { Message } from '@phosphor/messaging';
 import { AbstractDialog, DialogProps, Widget, DialogError } from '@theia/core/lib/browser';
-import { BoardsService } from '../../common/protocol/boards-service';
 import { BoardsConfig } from './boards-config';
-import { BoardsConfigDialogWidget } from './boards-config-dialog-widget';
+import { BoardsService } from '../../common/protocol/boards-service';
 import { BoardsServiceProvider } from './boards-service-provider';
+import { BoardsConfigDialogWidget } from './boards-config-dialog-widget';
 
 @injectable()
 export class BoardsConfigDialogProps extends DialogProps {
@@ -42,6 +42,16 @@ export class BoardsConfigDialog extends AbstractDialog<BoardsConfig.Config> {
         }));
     }
 
+    /**
+     * Pass in an empty string if you want to reset the search term. Using `undefined` has no effect.
+     */
+    async open(query: string | undefined = undefined): Promise<BoardsConfig.Config | undefined> {
+        if (typeof query === 'string') {
+            this.widget.search(query);
+        }
+        return super.open();
+    }
+
     protected createDescription(): HTMLElement {
         const head = document.createElement('div');
         head.classList.add('head');

Diff for: arduino-ide-extension/src/browser/boards/boards-config.tsx

@@ -1,10 +1,11 @@
 import * as React from 'react';
+import { Event } from '@theia/core/lib/common/event';
 import { notEmpty } from '@theia/core/lib/common/objects';
+import { MaybePromise } from '@theia/core/lib/common/types';
 import { DisposableCollection } from '@theia/core/lib/common/disposable';
-import { Board, Port, AttachedBoardsChangeEvent } from '../../common/protocol/boards-service';
-import { BoardsServiceProvider } from './boards-service-provider';
+import { Board, Port, AttachedBoardsChangeEvent, BoardWithPackage } from '../../common/protocol/boards-service';
 import { NotificationCenter } from '../notification-center';
-import { MaybePromise } from '@theia/core';
+import { BoardsServiceProvider } from './boards-service-provider';
 
 export namespace BoardsConfig {
 
@@ -18,10 +19,11 @@ export namespace BoardsConfig {
         readonly notificationCenter: NotificationCenter;
         readonly onConfigChange: (config: Config) => void;
         readonly onFocusNodeSet: (element: HTMLElement | undefined) => void;
+        readonly onFilteredTextDidChangeEvent: Event<string>;
     }
 
     export interface State extends Config {
-        searchResults: Array<Board & { packageName: string }>;
+        searchResults: Array<BoardWithPackage>;
         knownPorts: Port[];
         showAllPorts: boolean;
         query: string;
@@ -91,7 +93,8 @@ export class BoardsConfig extends React.Component<BoardsConfig.Props, BoardsConf
             this.props.notificationCenter.onPlatformUninstalled(() => this.updateBoards(this.state.query)),
             this.props.notificationCenter.onIndexUpdated(() => this.updateBoards(this.state.query)),
             this.props.notificationCenter.onDaemonStarted(() => this.updateBoards(this.state.query)),
-            this.props.notificationCenter.onDaemonStopped(() => this.setState({ searchResults: [] }))
+            this.props.notificationCenter.onDaemonStopped(() => this.setState({ searchResults: [] })),
+            this.props.onFilteredTextDidChangeEvent(query => this.setState({ query }, () => this.updateBoards(this.state.query)))
         ]);
     }
 
@@ -105,10 +108,9 @@ export class BoardsConfig extends React.Component<BoardsConfig.Props, BoardsConf
     }
 
     protected updateBoards = (eventOrQuery: React.ChangeEvent<HTMLInputElement> | string = '') => {
-        const query = (typeof eventOrQuery === 'string'
+        const query = typeof eventOrQuery === 'string'
             ? eventOrQuery
-            : eventOrQuery.target.value.toLowerCase()
-        ).trim();
+            : eventOrQuery.target.value.toLowerCase();
         this.setState({ query });
         this.queryBoards({ query }).then(searchResults => this.setState({ searchResults }));
     }
@@ -124,7 +126,7 @@ export class BoardsConfig extends React.Component<BoardsConfig.Props, BoardsConf
         });
     }
 
-    protected queryBoards = (options: { query?: string } = {}): Promise<Array<Board & { packageName: string }>> => {
+    protected queryBoards = (options: { query?: string } = {}): Promise<Array<BoardWithPackage>> => {
         return this.props.boardsServiceProvider.searchBoards(options);
     }
 
@@ -145,7 +147,7 @@ export class BoardsConfig extends React.Component<BoardsConfig.Props, BoardsConf
         this.setState({ selectedPort }, () => this.fireConfigChanged());
     }
 
-    protected selectBoard = (selectedBoard: Board & { packageName: string } | undefined) => {
+    protected selectBoard = (selectedBoard: BoardWithPackage | undefined) => {
         this.setState({ selectedBoard }, () => this.fireConfigChanged());
     }
 
@@ -175,7 +177,7 @@ export class BoardsConfig extends React.Component<BoardsConfig.Props, BoardsConf
     }
 
     protected renderBoards(): React.ReactNode {
-        const { selectedBoard, searchResults } = this.state;
+        const { selectedBoard, searchResults, query } = this.state;
         // Board names are not unique per core https://github.com/arduino/arduino-pro-ide/issues/262#issuecomment-661019560
         // It is tricky when the core is not yet installed, no FQBNs are available.
         const distinctBoards = new Map<string, Board.Detailed>();
@@ -189,11 +191,18 @@ export class BoardsConfig extends React.Component<BoardsConfig.Props, BoardsConf
 
         return <React.Fragment>
             <div className='search'>
-                <input type='search' className='theia-input' placeholder='SEARCH BOARD' onChange={this.updateBoards} ref={this.focusNodeSet} />
+                <input
+                    type='search'
+                    value={query}
+                    className='theia-input'
+                    placeholder='SEARCH BOARD'
+                    onChange={this.updateBoards}
+                    ref={this.focusNodeSet}
+                />
                 <i className='fa fa-search'></i>
             </div>
             <div className='boards list'>
-                {Array.from(distinctBoards.values()).map(board => <Item<Board & { packageName: string }>
+                {Array.from(distinctBoards.values()).map(board => <Item<BoardWithPackage>
                     key={`${board.name}-${board.packageName}`}
                     item={board}
                     label={board.name}

Diff for: arduino-ide-extension/src/browser/boards/boards-data-store.ts

@@ -83,7 +83,7 @@ export class BoardsDataStore implements FrontendApplicationContribution {
         }
         const key = this.getStorageKey(fqbn, version);
         let data = await this.storageService.getData<BoardsDataStore.Data | undefined>(key, undefined);
-        if (data) {
+        if (BoardsDataStore.Data.is(data)) {
             return data;
         }
 
@@ -202,5 +202,10 @@ export namespace BoardsDataStore {
             configOptions: [],
             programmers: []
         };
+        export function is(arg: any): arg is Data {
+            return !!arg
+                && 'configOptions' in arg && Array.isArray(arg['configOptions'])
+                && 'programmers' in arg && Array.isArray(arg['programmers'])
+        }
     }
 }

Diff for: arduino-ide-extension/src/browser/boards/boards-service-provider.ts

@@ -10,15 +10,18 @@ import {
     Board,
     BoardsService,
     BoardsPackage,
-    AttachedBoardsChangeEvent
+    AttachedBoardsChangeEvent,
+    BoardWithPackage
 } from '../../common/protocol';
 import { BoardsConfig } from './boards-config';
 import { naturalCompare } from '../../common/utils';
 import { compareAnything } from '../theia/monaco/comparers';
 import { NotificationCenter } from '../notification-center';
+import { CommandService } from '@theia/core';
+import { ArduinoCommands } from '../arduino-commands';
 
 interface BoardMatch {
-    readonly board: Board & Readonly<{ packageName: string }>;
+    readonly board: BoardWithPackage;
     readonly matches: monaco.filters.IMatch[] | undefined;
 }
 
@@ -37,6 +40,9 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
     @inject(BoardsService)
     protected boardsService: BoardsService;
 
+    @inject(CommandService)
+    protected commandService: CommandService;
+
     @inject(NotificationCenter)
     protected notificationCenter: NotificationCenter;
 
@@ -107,6 +113,19 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
                 };
                 return;
             }
+            // The board name can change after install.
+            // This logic handles it "gracefully" by unselecting the board, so that we can avoid no FQBN is set error.
+            // https://github.com/arduino/arduino-cli/issues/620
+            // https://github.com/arduino/arduino-pro-ide/issues/374
+            if (BoardWithPackage.is(selectedBoard) && selectedBoard.packageId === event.item.id && !installedBoard) {
+                this.messageService.warn(`Could not find previously selected board '${selectedBoard.name}' in installed platform '${event.item.name}'. Please manually reselect the board you want to use. Do you want to reselect it now?`, 'Reselect later', 'Yes').then(async answer => {
+                    if (answer === 'Yes') {
+                        this.commandService.executeCommand(ArduinoCommands.OPEN_BOARDS_DIALOG.id, selectedBoard.name);
+                    }
+                });
+                this.boardsConfig = {}
+                return;
+            }
             // Trigger a board re-set. See: https://github.com/arduino/arduino-cli/issues/954
             // E.g: install `adafruit:avr`, then select `adafruit:avr:adafruit32u4` board, and finally install the required `arduino:avr`
             this.boardsConfig = this.boardsConfig;
@@ -173,15 +192,15 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
         }
     }
 
-    async searchBoards({ query, cores }: { query?: string, cores?: string[] }): Promise<Array<Board & { packageName: string }>> {
+    async searchBoards({ query, cores }: { query?: string, cores?: string[] }): Promise<Array<BoardWithPackage>> {
         const boards = await this.boardsService.allBoards({});
         const coresFilter = !!cores && cores.length
-            ? ((toFilter: { packageName: string }) => cores.some(core => core === toFilter.packageName))
+            ? ((toFilter: BoardWithPackage) => cores.some(core => core === toFilter.packageName || core === toFilter.packageId))
             : () => true;
         if (!query) {
             return boards.filter(coresFilter).sort(Board.compare);
         }
-        const toMatch = ((toFilter: Board & { packageName: string }) => (({ board: toFilter, matches: monaco.filters.matchesFuzzy(query, toFilter.name, true) })));
+        const toMatch = ((toFilter: BoardWithPackage) => (({ board: toFilter, matches: monaco.filters.matchesFuzzy(query, toFilter.name, true) })));
         const compareEntries = (left: BoardMatch, right: BoardMatch, lookFor: string) => {
             const leftMatches = left.matches || [];
             const rightMatches = right.matches || [];

Diff for: arduino-ide-extension/src/common/protocol/boards-service.ts

@@ -104,7 +104,7 @@ export interface BoardsService extends Installable<BoardsPackage>, Searchable<Bo
     getContainerBoardPackage(options: { fqbn: string }): Promise<BoardsPackage | undefined>;
     // The CLI cannot do fuzzy search. This method provides all boards and we do the fuzzy search (with monaco) on the frontend.
     // https://github.com/arduino/arduino-cli/issues/629
-    allBoards(options: {}): Promise<Array<Board & { packageName: string }>>;
+    allBoards(options: {}): Promise<Array<BoardWithPackage>>;
 }
 
 export interface Port {
@@ -255,6 +255,18 @@ export interface Board {
     readonly port?: Port;
 }
 
+export interface BoardWithPackage extends Board {
+    readonly packageName: string;
+    readonly packageId: string;
+}
+export namespace BoardWithPackage {
+
+    export function is(board: Board & Partial<{ packageName: string, packageId: string }>): board is BoardWithPackage {
+        return !!board.packageId && !!board.packageName;
+    }
+
+}
+
 export interface BoardDetails {
     readonly fqbn: string;
     readonly requiredTools: Tool[];
@@ -381,10 +393,10 @@ export namespace Board {
         return `${board.name}${fqbn}`;
     }
 
-    export type Detailed = Board & Readonly<{ selected: boolean, missing: boolean, packageName: string, details?: string }>;
+    export type Detailed = Board & Readonly<{ selected: boolean, missing: boolean, packageName: string, packageId: string, details?: string }>;
     export function decorateBoards(
         selectedBoard: Board | undefined,
-        boards: Array<Board & { packageName: string }>): Array<Detailed> {
+        boards: Array<BoardWithPackage>): Array<Detailed> {
         // Board names are not unique. We show the corresponding core name as a detail.
         // https://github.com/arduino/arduino-cli/pull/294#issuecomment-513764948
         const distinctBoardNames = new Map<string, number>();
@@ -394,12 +406,15 @@ export namespace Board {
         }
 
         // Due to the non-unique board names, we have to check the package name as well.
-        const selected = (board: Board & { packageName: string }) => {
+        const selected = (board: BoardWithPackage) => {
             if (!!selectedBoard) {
                 if (Board.equals(board, selectedBoard)) {
                     if ('packageName' in selectedBoard) {
                         return board.packageName === (selectedBoard as any).packageName;
                     }
+                    if ('packageId' in selectedBoard) {
+                        return board.packageId === (selectedBoard as any).packageId;
+                    }
                     return true;
                 }
             }

Diff for: arduino-ide-extension/src/node/boards-service-impl.ts

@@ -3,7 +3,7 @@ import { ILogger } from '@theia/core/lib/common/logger';
 import {
     BoardsService,
     Installable,
-    BoardsPackage, Board, Port, BoardDetails, Tool, ConfigOption, ConfigValue, Programmer, OutputService, NotificationServiceServer, AvailablePorts
+    BoardsPackage, Board, Port, BoardDetails, Tool, ConfigOption, ConfigValue, Programmer, OutputService, NotificationServiceServer, AvailablePorts, BoardWithPackage
 } from '../common/protocol';
 import {
     PlatformSearchReq, PlatformSearchResp, PlatformInstallReq, PlatformInstallResp, PlatformListReq,
@@ -155,9 +155,9 @@ export class BoardsServiceImpl implements BoardsService {
         return packages.find(({ boards }) => boards.some(({ fqbn }) => fqbn === expectedFqbn));
     }
 
-    async allBoards(options: {}): Promise<Array<Board & { packageName: string }>> {
+    async allBoards(options: {}): Promise<Array<BoardWithPackage>> {
         const results = await this.search(options);
-        return results.map(item => item.boards.map(board => ({ ...board, packageName: item.name })))
+        return results.map(item => item.boards.map(board => ({ ...board, packageName: item.name, packageId: item.id })))
             .reduce((acc, curr) => acc.concat(curr), []);
     }