Made boards installable

This commit is contained in:
Christian Weichel
2019-05-06 15:48:33 +02:00
parent 201351fea8
commit c48d80b137
10 changed files with 135 additions and 39 deletions

View File

@@ -12,6 +12,10 @@ export class ComponentListItem extends React.Component<ComponentListItem.Props>
}
}
private async install(item: ArduinoComponent) {
await this.props.install(item);
}
render(): React.ReactNode {
const { item } = this.props;
@@ -27,7 +31,8 @@ export class ComponentListItem extends React.Component<ComponentListItem.Props>
const description = !!item.description && <div className={style.DESCRIPTION_CLASS}>{item.description}</div>;
const moreInfo = !!item.moreInfoLink && <a href={item.moreInfoLink} onClick={this.onClick}>More info</a>;
const install = item.installable && !item.installedVersion && <button className={style.INSTALL_BTN_CLASS}>INSTALL</button>;
const install = this.props.install && item.installable && !item.installedVersion &&
<button className={style.INSTALL_BTN_CLASS} onClick={this.install.bind(this, item)}>INSTALL</button>;
return <div className={[style.LIST_ITEM_CLASS, style.NO_SELECT_CLASS].join(' ')}>
<div className={style.HEADER_CLASS}>
@@ -52,6 +57,7 @@ export namespace ComponentListItem {
export interface Props {
readonly item: ArduinoComponent;
readonly windowService: WindowService;
readonly install: (comp: ArduinoComponent) => Promise<void>;
}
export namespace Styles {

View File

@@ -7,7 +7,7 @@ export class ComponentList extends React.Component<ComponentList.Props> {
render(): React.ReactNode {
return <div>
{this.props.items.map(item => <ComponentListItem key={item.name} item={item} windowService={this.props.windowService}/>)}
{this.props.items.map(item => <ComponentListItem key={item.name} item={item} windowService={this.props.windowService} install={this.props.install} />)}
</div>;
}
@@ -18,6 +18,7 @@ export namespace ComponentList {
export interface Props {
readonly items: ArduinoComponent[];
readonly windowService: WindowService;
readonly install: (comp: ArduinoComponent) => Promise<void>;
}
}

View File

@@ -3,6 +3,7 @@ import { WindowService } from '@theia/core/lib/browser/window/window-service';
import { ComponentList } from './component-list';
import { SearchBar } from './search-bar';
import { ArduinoComponent } from '../../../common/protocol/arduino-component';
import { InstallationProgressDialog } from '../installation-progress-dialog';
export class FilterableListContainer extends React.Component<FilterableListContainer.Props, FilterableListContainer.State> {
@@ -27,6 +28,7 @@ export class FilterableListContainer extends React.Component<FilterableListConta
/>
<ComponentList
items={this.state.items}
install={this.install.bind(this)}
windowService={this.props.windowService}
/>
</div>
@@ -42,6 +44,18 @@ export class FilterableListContainer extends React.Component<FilterableListConta
});
}
protected async install(comp: ArduinoComponent): Promise<void> {
const dialog = new InstallationProgressDialog(comp.name);
dialog.open();
try {
await this.props.service.install(comp);
const { items } = await this.props.service.search({ query: this.state.filterText });
this.setState({ items });
} finally {
dialog.close();
}
}
}
export namespace FilterableListContainer {
@@ -62,6 +76,7 @@ export namespace FilterableListContainer {
export interface ComponentSource {
search(req: { query: string }): Promise<{ items: ArduinoComponent[] }>
install(board: ArduinoComponent): Promise<void>;
}
}

View File

@@ -0,0 +1,12 @@
import { AbstractDialog } from "@theia/core/lib/browser";
export class InstallationProgressDialog extends AbstractDialog<string> {
readonly value: "does-not-matter";
constructor(componentName: string) {
super({ title: 'Installation in progress' });
this.contentNode.textContent = `Installing ${componentName}. Please wait.`;
}
}