diff --git a/app/src/configure-activity.css b/app/src/configure-activity.css index 82a89ad..19da474 100644 --- a/app/src/configure-activity.css +++ b/app/src/configure-activity.css @@ -4,7 +4,6 @@ display: flex; flex-direction: column; justify-content: space-between; - padding: 0 10px; } .configure-upper { diff --git a/app/src/configure-activity.js b/app/src/configure-activity.js index 8f74ad7..8a6e5d2 100644 --- a/app/src/configure-activity.js +++ b/app/src/configure-activity.js @@ -15,23 +15,28 @@ class ConfigureActivity extends Component { height: props.height, width: props.width, }, + editorConfig: { ...this.props.editorOptions }, }; props.editorConfig(api.editorConfigResource()); } updateConfiguration(key, val) { - const newEditorConfig = { ...this.props.editorOptions, [key]: val }; + this.setState({ + editorConfig: { ...this.state.editorConfig, [key]: val }, + }); + } - this.props.updateEditorConfig(api.editorConfigResource(), newEditorConfig); + save() { + this.props.updateEditorConfig(api.editorConfigResource(), this.state.editorConfig); } renderEditorOption(key, val, label) { const editorOptionClasses = (key, val) => { if (val) { - return cx('configure-option', { 'is-selected': this.props.editorOptions[key] === val }); + return cx('configure-option', { 'is-selected': this.state.editorConfig[key] === val }); } - return cx('configure-option', { 'is-selected': !this.props.editorOptions[key] }); + return cx('configure-option', { 'is-selected': !this.state.editorConfig[key] }); }; return ( @@ -76,6 +81,8 @@ class ConfigureActivity extends Component { maiden version: {VERSION} ({COMMIT}) + {/* TODO: instead of onclick, I need the other TODO statement to call this.save() as defined in this file */} +
this.save()}>save
); } diff --git a/app/src/workspace.js b/app/src/workspace.js index 3d7297c..d2cce19 100644 --- a/app/src/workspace.js +++ b/app/src/workspace.js @@ -1,5 +1,6 @@ import React, { Component } from 'react'; import ReactModal from 'react-modal'; +import ModalContent from './modal-content'; import BoundConfigureActivity from './bound-configure-activity'; import ActivityBar from './activity-bar'; import activities from './activities'; @@ -108,6 +109,13 @@ class Workspace extends Component { this.props.toggleComponent('config'); } + handleConfigModalAction = (choice) => { + if (choice === 'ok') { + // TODO: this needs to call the ConfigActivity's save method + } + this.handleCloseConfigModal(); + } + render() { const selectedActivity = this.props.activities.find(a => { return this.props.selected === a.selector @@ -136,23 +144,15 @@ class Workspace extends Component { -
- this.props.toggleComponent('config')} - tooltipMessage="cancel" - tooltipPosition="left" - icon={ICONS.cross} - color="hsl(0, 0%, 59%)" - size="12" - /> -
- + + +
)