diff --git a/arduino-ide-extension/src/browser/boards/boards-config-component.tsx b/arduino-ide-extension/src/browser/boards/boards-config-component.tsx index acf2c7d4..f14b8f39 100644 --- a/arduino-ide-extension/src/browser/boards/boards-config-component.tsx +++ b/arduino-ide-extension/src/browser/boards/boards-config-component.tsx @@ -48,16 +48,17 @@ namespace BoardsConfigComponent { } } -export abstract class Item extends React.Component<{ +class Item extends React.Component<{ item: T; label: string; selected: boolean; onClick: (item: T) => void; missing?: boolean; details?: string; + title?: string | ((item: T) => string); }> { override render(): React.ReactNode { - const { selected, label, missing, details } = this.props; + const { selected, label, missing, details, item } = this.props; const classNames = ['item']; if (selected) { classNames.push('selected'); @@ -65,11 +66,15 @@ export abstract class Item extends React.Component<{ if (missing === true) { classNames.push('missing'); } + let title = this.props.title ?? `${label}${!details ? '' : details}`; + if (typeof title === 'function') { + title = title(item); + } return (
{label}
{!details ? '' :
{details}
} @@ -234,9 +239,20 @@ export class BoardsConfigComponent extends React.Component< distinctBoards.set(key, board); } } + const title = (board: Board.Detailed): string => { + const { details, manuallyInstalled } = board; + let label = board.name; + if (details) { + label += details; + } + if (manuallyInstalled) { + label += nls.localize('arduino/board/inSketchbook', ' (in Sketchbook)'); + } + return label; + }; const boardsList = Array.from(distinctBoards.values()).map((board) => ( - + key={toKey(board)} item={board} label={board.name} @@ -244,6 +260,7 @@ export class BoardsConfigComponent extends React.Component< selected={board.selected} onClick={this.selectBoard} missing={board.missing} + title={title} /> ));