retropilot
/
cabana
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

disable load dbc button if nothing is selected

main
Joost Wooning 2022-03-21 17:20:44 +01:00
parent ca1318cc33
commit 9ca2e4ee2f
2 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/LoadDbcModal.js
View File

@ -46,9 +46,7 @@ export default class LoadDbcModal extends Component {
handleSave() { handleSave() {
const { dbc, dbcSource } = this.state; const { dbc, dbcSource } = this.state;
if (dbc !== null) { this.props.onDbcSelected(dbcSource, dbc);
this.props.onDbcSelected(dbcSource, dbc);
}
} }
renderTabNavigation() { renderTabNavigation() {
@ -58,7 +56,11 @@ export default class LoadDbcModal extends Component {
<button <button
className={cx({ 'is-active': this.state.tab === tab })} className={cx({ 'is-active': this.state.tab === tab })}
onClick={() => { onClick={() => {
this.setState({ tab }); this.setState({
tab,
dbc: null,
dbcSource: null,
});
}} }}
key={tab} key={tab}
> >
@ -100,13 +102,13 @@ export default class LoadDbcModal extends Component {
} }
} }
renderActions() { renderActions(disabled) {
return ( return (
<div> <div>
<button className="button--inverted" onClick={this.props.handleClose}> <button className="button--inverted" onClick={this.props.handleClose}>
<span>Cancel</span> <span>Cancel</span>
</button> </button>
<button className="button--primary" onClick={this.handleSave}> <button className="button--primary" disabled={ disabled } onClick={ this.handleSave }>
<span>Load DBC</span> <span>Load DBC</span>
</button> </button>
</div> </div>
@ -120,7 +122,7 @@ export default class LoadDbcModal extends Component {
subtitle="Modify an existing DBC file with Cabana" subtitle="Modify an existing DBC file with Cabana"
handleClose={this.props.handleClose} handleClose={this.props.handleClose}
navigation={this.renderTabNavigation()} navigation={this.renderTabNavigation()}
actions={this.renderActions()} actions={this.renderActions(Boolean(this.state.dbc === null))}
> >
{this.renderTabContent()} {this.renderTabContent()}
</Modal> </Modal>

4
src/styles/base/forms.scss
View File

@ -180,6 +180,10 @@ a.button {
&.button--primary { &.button--primary {
background: $button-background--primary; background: $button-background--primary;
border-color: darken($button-background--primary, 8%); border-color: darken($button-background--primary, 8%);
&[disabled] {
background: $button-background--disabled;
border-color: $button-border--disabled;
}
&:hover { &:hover {
background: darken($button-background--primary, 2%); background: darken($button-background--primary, 2%);
} }