From 4342e85c881b84296a8deb6556b5f95f5b885928 Mon Sep 17 00:00:00 2001 From: vikasrohit Date: Fri, 7 Oct 2016 11:37:21 +0530 Subject: [PATCH 1/4] Github issue #125 Feature picker || Custom feature is shown as form even after adding the feature -- Moved change handler to the form's onChange --- .../components/FeatureSelector/CustomFeatureForm.jsx | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx b/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx index 533e47b34..b65dd2565 100644 --- a/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx +++ b/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx @@ -73,14 +73,14 @@ class CustomFeatureForm extends Component { this.setState({ editMode : false }) } - onChange(fieldName, value) { + onChange(data){//fieldName, value) { const { featureData } = this.props // following check is needed to prevent adding the feature again after removing // because forms' onChange event gets fire with only form data when we lose focus from the form // alternative to this check is to put the change handler on textarea instead of form if (featureData) {// feature is already added - const data = {} - data[fieldName] = value + // const data = {} + // data[fieldName] = value this.props.updateFeature(_.merge({}, featureData, data)) } } @@ -114,7 +114,7 @@ class CustomFeatureForm extends Component { }
- + { (!isAdded || editMode) && : null } From 28e182b4a04be6a0a88606099a4b7e753763e944 Mon Sep 17 00:00:00 2001 From: vikasrohit Date: Fri, 7 Oct 2016 11:41:06 +0530 Subject: [PATCH 2/4] Github issue #224 Enabling Project Feature fails and crashes app, requiring browser refresh -- Removed debounced method --- .../detail/components/FeatureSelector/CustomFeatureForm.jsx | 4 +--- .../detail/components/FeatureSelector/DefaultFeatureForm.jsx | 4 ++-- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx b/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx index b65dd2565..4bc0d70ca 100644 --- a/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx +++ b/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx @@ -73,14 +73,12 @@ class CustomFeatureForm extends Component { this.setState({ editMode : false }) } - onChange(data){//fieldName, value) { + onChange(data){ const { featureData } = this.props // following check is needed to prevent adding the feature again after removing // because forms' onChange event gets fire with only form data when we lose focus from the form // alternative to this check is to put the change handler on textarea instead of form if (featureData) {// feature is already added - // const data = {} - // data[fieldName] = value this.props.updateFeature(_.merge({}, featureData, data)) } } diff --git a/src/projects/detail/components/FeatureSelector/DefaultFeatureForm.jsx b/src/projects/detail/components/FeatureSelector/DefaultFeatureForm.jsx index bb7fc0908..a33eff587 100644 --- a/src/projects/detail/components/FeatureSelector/DefaultFeatureForm.jsx +++ b/src/projects/detail/components/FeatureSelector/DefaultFeatureForm.jsx @@ -56,7 +56,7 @@ class DefaultFeatureForm extends Component { render() { const { featureDesc, featureData, isEdittable } = this.props const { isActive } = this.state - const _debouncedOnChange = _.debounce(this.onChange, 2000, { trailing: true, maxWait: 10000 }) + // const _debouncedOnChange = _.debounce(this.onChange, 2000, { trailing: true, maxWait: 10000 }) return (
@@ -72,7 +72,7 @@ class DefaultFeatureForm extends Component {

{ featureDesc.description }

{ isActive ? - + Date: Fri, 7 Oct 2016 12:02:43 +0530 Subject: [PATCH 3/4] Github issue #448 Dashboard/Feature picker: Deselecting feature moves user out of feature view -- Fixed with restructuring the addFeature method --- .../FeatureSelector/CustomFeatureForm.jsx | 4 +- .../FeatureSelector/DefaultFeatureForm.jsx | 4 +- .../FeatureSelector/FeaturePicker.jsx | 42 +++++++++++++------ 3 files changed, 33 insertions(+), 17 deletions(-) diff --git a/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx b/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx index 4bc0d70ca..9dc0e2a02 100644 --- a/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx +++ b/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx @@ -35,9 +35,9 @@ class CustomFeatureForm extends Component { } toggleFeature() { - const { addFeature, isEdittable } = this.props + const { toggleFeature, isEdittable } = this.props if (isEdittable) { - addFeature({ ...this.state.data, disabled: !!this.state.isActive }) + toggleFeature(this.state.data.id, !!this.state.isActive) } } diff --git a/src/projects/detail/components/FeatureSelector/DefaultFeatureForm.jsx b/src/projects/detail/components/FeatureSelector/DefaultFeatureForm.jsx index a33eff587..419f6cb46 100644 --- a/src/projects/detail/components/FeatureSelector/DefaultFeatureForm.jsx +++ b/src/projects/detail/components/FeatureSelector/DefaultFeatureForm.jsx @@ -32,11 +32,11 @@ class DefaultFeatureForm extends Component { } toggleFeature() { - const { removeFeature, addFeature, featureDesc, isEdittable } = this.props + const { toggleFeature, addFeature, featureDesc, isEdittable } = this.props if (isEdittable) { if (this.state.isActive) { // remove feature - removeFeature(featureDesc.id) + toggleFeature(featureDesc.id, true) } else { // add feature addFeature({ diff --git a/src/projects/detail/components/FeatureSelector/FeaturePicker.jsx b/src/projects/detail/components/FeatureSelector/FeaturePicker.jsx index 2d1c7b502..84ea044fe 100644 --- a/src/projects/detail/components/FeatureSelector/FeaturePicker.jsx +++ b/src/projects/detail/components/FeatureSelector/FeaturePicker.jsx @@ -212,6 +212,7 @@ class FeaturePicker extends Component { } this.addFeature = this.addFeature.bind(this) this.removeFeature = this.removeFeature.bind(this) + this.toggleFeature = this.toggleFeature.bind(this) this.selectFeature = this.selectFeature.bind(this) this.toggleFeature = this.toggleFeature.bind(this) this.updateSelectedFeature = this.updateSelectedFeature.bind(this) @@ -262,27 +263,40 @@ class FeaturePicker extends Component { this.props.onSave(newState.activeFeatureList) } - addFeature(feature) { - let newState - const featureIndex = _.findIndex(this.state.activeFeatureList, (f) => f.id === feature.id ) - // if feature is already added and is custom feature, update feature - if (feature.categoryId === 'custom' && featureIndex >= 0) { - newState = update(this.state, { + toggleFeature(featureId, disable) { + const featureIndex = _.findIndex(this.state.activeFeatureList, (f) => f.id === featureId ) + if (featureIndex >= 0) { + const feature = this.state.activeFeatureList[featureIndex] + let featureListQuery + // separate update query for custom and standard features + // when disabling, we remove standard feature from the list while update custom feature with disabled flag + if (feature.categoryId === 'custom') { + feature.disabled = disable + featureListQuery = { $splice : [[featureIndex, 1, feature]] } + } else { + featureListQuery = { $splice: [[featureIndex, 1]] } + } + const newState = update(this.state, { activeFeatureCount: { $set: this.state.activeFeatureCount - 1 }, - activeFeatureList: { $splice : [[featureIndex, 1, feature]] }, - selectedFeatureId: { $set : feature.id } - }) - } else {// add standard feature - newState = update(this.state, { - activeFeatureCount: {$set: this.state.activeFeatureCount + 1}, - activeFeatureList: { $push : [feature] }, + activeFeatureList: featureListQuery, selectedFeatureId: { $set : feature.id } }) + this.setState(newState) + this.props.onSave(newState.activeFeatureList) } + } + + addFeature(feature) { + const newState = update(this.state, { + activeFeatureCount: {$set: this.state.activeFeatureCount + 1}, + activeFeatureList: { $push : [feature] }, + selectedFeatureId: { $set : feature.id } + }) this.setState(newState) this.props.onSave(newState.activeFeatureList) } + // removeFeature is only called for custom feature removeFeature(featureId) { // lookup index const idx = _.findIndex(this.state.activeFeatureList, f => f.id === featureId ) @@ -328,6 +342,7 @@ class FeaturePicker extends Component { featureDesc={selectedFeature} featureData={selectedFeatureData} updateFeature={this.updateSelectedFeature} + toggleFeature={ this.toggleFeature } addFeature={this.addFeature} removeFeature={this.removeFeature} />) @@ -360,6 +375,7 @@ class FeaturePicker extends Component { isEdittable={isEdittable} featureData={selectedFeatureData} updateFeature={this.updateSelectedFeature} + toggleFeature={ this. toggleFeature } addFeature={this.addFeature} removeFeature={this.removeFeature} onCancel={this.renderDefaultFeatureForm} From 7c50f20f52bfe4a229ad8363c707b46d81c05949 Mon Sep 17 00:00:00 2001 From: vikasrohit Date: Fri, 7 Oct 2016 12:14:58 +0530 Subject: [PATCH 4/4] Github issue #225 Must validate the white spaces (Blank spaces) -- fixed along with lint error fixes --- .../detail/components/FeatureSelector/CustomFeatureForm.jsx | 6 ++++-- .../components/FeatureSelector/DefaultFeatureForm.jsx | 2 ++ .../detail/components/FeatureSelector/FeaturePicker.jsx | 6 ------ 3 files changed, 6 insertions(+), 8 deletions(-) diff --git a/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx b/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx index 9dc0e2a02..4997a60c2 100644 --- a/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx +++ b/src/projects/detail/components/FeatureSelector/CustomFeatureForm.jsx @@ -65,7 +65,7 @@ class CustomFeatureForm extends Component { id: data.title.toLowerCase().replace(/\s/g, '_'), categoryId: 'custom', notes: '' - }, featureData, data)) + }, featureData, { title : data.title.trim() })) // assumes addFeature to be a synchronous call, otherwise it could lead to inconsistent UI state // e.g. if async addFeature fails, it would close the edit mode // this call is needed here because debounce call (for notes change) is closing the edit mode if @@ -79,6 +79,8 @@ class CustomFeatureForm extends Component { // because forms' onChange event gets fire with only form data when we lose focus from the form // alternative to this check is to put the change handler on textarea instead of form if (featureData) {// feature is already added + // trim the notes (as of now only notes field is auto updated) + data.notes = data.notes.trim() this.props.updateFeature(_.merge({}, featureData, data)) } } @@ -117,7 +119,7 @@ class CustomFeatureForm extends Component { f.id === featureId) - idx > -1 ? this.removeFeature(featureId) : this.addFeature(featureId) - } - renderCustomFeatureForm() { this.setState({ selectedFeatureId: null,