diff --git a/src/app/components/Modification.jsx b/src/app/components/Modification.jsx
index 8dafdfe0..17938d0f 100644
--- a/src/app/components/Modification.jsx
+++ b/src/app/components/Modification.jsx
@@ -46,7 +46,7 @@ export default class Modification extends TranslatedComponent {
* @return {React.Component} modification
*/
render() {
- const { translate, formats } = this.context.language;
+ const { formats } = this.context.language;
const { highlight, m, property } = this.props;
const { beneficial, unit, value, inputValue } = this.state;
@@ -58,44 +58,40 @@ export default class Modification extends TranslatedComponent {
}
return (
-
-
{translate(property)}
-
-
-
-
- |
-
- {
- if (event.key == 'Enter') {
- this._updateFinished();
- event.stopPropagation();
- }
- }}
- onValueChange={(inputValue) => {
- if (inputValue.length <= 15) {
- this.setState({ inputValue });
- }
- }} />
- {unit}
-
- |
- {formats.pct(m.getModifier(property))} |
-
-
-
-
+
+ |
+
+ {}}/>
+
+ |
+
+
+ {
+ if (event.key == 'Enter') {
+ this._updateFinished();
+ event.stopPropagation();
+ }
+ }}
+ onValueChange={(inputValue) => {
+ if (inputValue.length <= 15) {
+ this.setState({ inputValue });
+ }
+ }} />
+
+ |
+
+ {unit}
+ |
+ {formats.pct(m.getModifier(property))} |
+
);
}
}
diff --git a/src/app/components/ModificationsMenu.jsx b/src/app/components/ModificationsMenu.jsx
index 0a28f2f5..31ea22d0 100644
--- a/src/app/components/ModificationsMenu.jsx
+++ b/src/app/components/ModificationsMenu.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
-import * as _ from 'lodash';
+import { chain, keys } from 'lodash';
import TranslatedComponent from './TranslatedComponent';
import { stopCtxPropagation } from '../utils/UtilityFunctions';
import cn from 'classnames';
@@ -161,21 +161,39 @@ export default class ModificationsMenu extends TranslatedComponent {
/**
* Render the modifications
- * @param {Object} props React Component properties
* @return {Array} Array of React Components
*/
- _renderModifications(props) {
- const { m } = props;
+ _renderModifications() {
+ const { m } = this.props;
+ const { translate } = this.context.language;
const blueprintFeatures = getBlueprintInfo(m.getBlueprint()).features[
m.getBlueprintGrade()
];
- const blueprintModifications = Object.keys(blueprintFeatures)
- .map((feature) => this._mkModification(feature, true))
- .filter(Boolean);
- const moduleModifications = Object.keys(getModuleInfo(m.getItem()).props)
+ const blueprintModifications = chain(keys(blueprintFeatures))
+ .map((feature) => [
+
+ |
+ {translate(feature)}
+ |
+
,
+ this._mkModification(feature, true),
+ ])
+ .filter(([_, mod]) => Boolean(mod))
+ .flatMap()
+ .value();
+ const moduleModifications = chain(keys(getModuleInfo(m.getItem()).props))
.filter((prop) => !blueprintFeatures[prop])
- .map((prop) => this._mkModification(prop, false));
+ .map((prop) => [
+
+ |
+ {translate(prop)}
+ |
+
,
+ this._mkModification(prop, false),
+ ])
+ .flatMap()
+ .value();
return blueprintModifications.concat(moduleModifications);
}
@@ -362,7 +380,13 @@ export default class ModificationsMenu extends TranslatedComponent {
{this._renderModifications(this.props)}
+ >
+
+
+ {this._renderModifications()}
+
+
+
);
}