diff --git a/src/containers/home/home.js b/src/containers/home/home.js index 994186f..38b0f32 100644 --- a/src/containers/home/home.js +++ b/src/containers/home/home.js @@ -19,6 +19,7 @@ import { Select, Tab, Tabs, + TextField, Tooltip, Typography, ExpansionPanel, @@ -91,6 +92,7 @@ class Home extends React.Component { basicInterface: 0, errorDialogMessage: <>>, openErrorDialog: false, + uciDefaults: '', }; confirmingBuild = false; @@ -303,6 +305,12 @@ class Home extends React.Component { } }; + uciDefaultsEdit = event => { + this.setState({ + uciDefaults: event.target.value, + }); + }; + closeConfirmBuildDialog = () => { this.confirmingBuild = false; }; @@ -408,12 +416,15 @@ class Home extends React.Component { buildImage = async () => { try { this.closeConfirmBuildDialog(); - const board = this.state.selection.device.id; - const packages = this.state.packages; - const target = this.state.selection.device['target']; - const version = this.state.data[ - this.state.selection.version - ].name.toLowerCase(); + const { packages, selection, data, uciDefaults } = this.state; + const { + device: { id: board, target }, + version: versionId, + } = selection; + let { + [versionId]: { name: version }, + } = data; + version = version.toLowerCase(); this.setState({ isBuilding: true, builtImages: [], @@ -422,7 +433,8 @@ class Home extends React.Component { board, packages, target, - version + version, + uciDefaults ); if ( buildResponse.status === 202 && @@ -437,6 +449,7 @@ class Home extends React.Component { throw buildResponse.data; } } catch (e) { + console.log(e); if (e.response.status === 409) { this.setState({ isBuilding: false, @@ -483,11 +496,15 @@ class Home extends React.Component { }; render() { - const warning432 = this.state.showDeviceData && + let warning432 = <> >; + if ( + this.state.showDeviceData && this.state.deviceLoaded && parseInt( (this.state.selection.device['image_size'] || '').slice(0, -1) - ) <= 4000 && ( + ) <= 4000 + ) { + warning432 = ( @@ -499,6 +516,63 @@ class Home extends React.Component { ); + } + + let deviceInfoGrid = <>>; + + if (this.state.builtImages.length > 0 && !this.state.configChanged) { + deviceInfoGrid = ( + + + {this.props.t('Model')}:{' '} + {this.state.selection.device['title']} + {this.props.t('Target')}: {this.state.selection.device['target']}{' '} + + {this.props.t('Version')}: {'('} + {this.state.data[this.state.selection.version].name} + {this.state.data[this.state.selection.version].revision} + {')'} + + } + id="packages-manifest" + > + + Installed Packages ({this.state.builtDeviceManifest.length}) + + + + + {this.state.builtDeviceManifest.map(package_name => ( + {package_name} + ))} + + + + + + {this.props.t('Downloads')}: + {this.state.builtImages.map(image => ( + + this.downloadingImageIndicatorShow()} + > + + {image.type} + + + ))} + + {this.state.downloading && } + + + ); + } + const notLoaded = ; const onLoad = ( <> @@ -676,33 +750,48 @@ class Home extends React.Component { ) : ( - - {this.state.packages.map((package_name, i) => ( - this.deletePackage(i)} - label={package_name} - /> - ))} - - Use comma or new line separated array. - Press enter to apply. - - } - > - + + Packages + {this.state.packages.map((package_name, i) => ( + this.deletePackage(i)} + label={package_name} + /> + ))} + + Use comma or new line separated array. + Press enter to apply. + + } + > + + + + + UCI defaults (alpha) + - - + + {this.state.configChanged && !this.state.isBuilding && ( )} - {this.state.builtImages.length > 0 && - !this.state.configChanged && ( - - - {this.props.t('Model')}:{' '} - {this.state.selection.device['title']} - {this.props.t('Target')}:{' '} - {this.state.selection.device['target']} - {this.props.t('Version')}:{' '} - {this.state.data[this.state.selection.version].name} ( - { - this.state.data[this.state.selection.version] - .revision - } - ) - - } - id="packages-manifest" - > - - Installed Packages ( - {this.state.builtDeviceManifest.length}) - - - - - {this.state.builtDeviceManifest.map( - package_name => ( - {package_name} - ) - )} - - - - - - {this.props.t('Downloads')}: - {this.state.builtImages.map(image => ( - - - this.downloadingImageIndicatorShow() - } - > - - {image.type} - - - ))} - - {this.state.downloading && ( - - )} - - - )} + {deviceInfoGrid} )} @@ -815,6 +841,7 @@ class Home extends React.Component { )} > ); + return ( <> + buildImage = (board, packages, target, version, uciDefaults) => axios.post(base_api + 'build-request', { profile: board, board, - defaults: '', + defaults: uciDefaults, distro: 'openwrt', packages, target,