import * as React from 'react'; import { Installable } from '../../../common/protocol/installable'; import { ArduinoComponent } from '../../../common/protocol/arduino-component'; import { ListItemRenderer } from './list-item-renderer'; export class ComponentListItem extends React.Component, ComponentListItem.State> { constructor(props: ComponentListItem.Props) { super(props); if (props.item.installable) { const version = props.item.availableVersions.filter(version => version !== props.item.installedVersion)[0]; this.state = { selectedVersion: version }; } } protected async install(item: T): Promise { const toInstall = this.state.selectedVersion; const version = this.props.item.availableVersions.filter(version => version !== this.state.selectedVersion)[0]; this.setState({ selectedVersion: version }); try { await this.props.install(item, toInstall); } catch { this.setState({ selectedVersion: toInstall }); } } protected async uninstall(item: T): Promise { await this.props.uninstall(item); } protected onVersionChange(version: Installable.Version) { this.setState({ selectedVersion: version }); } render(): React.ReactNode { const { item, itemRenderer } = this.props; return itemRenderer.renderItem( Object.assign(this.state, { item }), this.install.bind(this), this.uninstall.bind(this), this.onVersionChange.bind(this) ); } } export namespace ComponentListItem { export interface Props { readonly item: T; readonly install: (item: T, version?: Installable.Version) => Promise; readonly uninstall: (item: T) => Promise; readonly itemRenderer: ListItemRenderer; } export interface State { selectedVersion?: Installable.Version; } }