Fix code styles

src/js/components/Select.js

@@ -13,8 +13,7 @@ import {
   pathEq
 } from "lodash/fp"
 
-const hasOptionGroups = options =>
+const hasOptionGroups = options => options.some(option => Boolean(option.options))
-  options.some(option => Boolean(option.options))
 
 const customTheme = theme => ({
   ...theme,
@@ -22,30 +21,30 @@ const customTheme = theme => ({
   spacing: {
     ...theme.spacing,
     baseUnit: 3,
-    controlHeight: 32
+    controlHeight: 32,
   },
   colors: {
     ...theme.colors,
     primary: "#38b5eb",
     primary75: "rgba(56, 181, 235, 0.25)",
     primary50: "#38b5eb",
-    primary25: "#38b5eb"
+    primary25: "#38b5eb",
-  }
+  },
 })
 
 const customStyles = props => ({
   control: (base, _state) => ({
     ...base,
-    borderColor: props.hasError ? "#FB3A2F" : base.borderColor
+    borderColor: props.hasError ? "#FB3A2F" : base.borderColor,
   }),
   valueContainer: base => ({
     ...base,
-    padding: "4px 12px"
+    padding: "4px 12px",
   }),
   input: base => ({
     ...base,
     border: "0 !important",
-    boxShadow: "0 !important"
+    boxShadow: "0 !important",
   }),
   groupHeading: (base, _state) => ({
     ...base,
@@ -53,16 +52,14 @@ const customStyles = props => ({
     textTransform: "none",
     fontWeight: "bold",
     fontSize: "100%",
-    padding: "2px 7px 4px"
+    padding: "2px 7px 4px",
   }),
   option: (base, state) => ({
     ...base,
-    padding: hasOptionGroups(state.options)
+    padding: hasOptionGroups(state.options) ? "4px 7px 4px 20px" : "4px 7px 4px",
-      ? "4px 7px 4px 20px"
-      : "4px 7px 4px",
     backgroundColor: state.isFocused ? "#38b5eb" : "none",
-    color: state.isFocused ? "white" : "hsl(0, 0%, 20%)"
+    color: state.isFocused ? "white" : "hsl(0, 0%, 20%)",
-  })
+  }),
 })
 
 const filterOption = createFilter({
@@ -70,8 +67,8 @@ const filterOption = createFilter({
     join(" "),
     filter(value => isString(value) || isNumber(value)),
     values,
-    property("data")
+    property("data"),
-  )
+  ),
 })
 
 export default class Select extends Component {
@@ -80,17 +77,14 @@ export default class Select extends Component {
     value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     options: PropTypes.array,
     hasError: PropTypes.bool,
-    onChange: PropTypes.func.isRequired
+    onChange: PropTypes.func.isRequired,
-  };
+  }
 
   static findOptionByValue = (selectOptions, value) => {
-    const options = flatMap(
+    const options = flatMap(option => (option.options ? option.options : option), selectOptions)
-      option => (option.options ? option.options : option),
-      selectOptions
-    )
 
     return options.find(pathEq("value", value)) || null
-  };
+  }
 
   constructor(props) {
     super(props)
@@ -101,7 +95,7 @@ export default class Select extends Component {
     const { name, onChange } = this.props
     const { value } = option
     onChange({ target: { name, value } })
-  };
+  }
 
   handleKeyDown = event => {
     if (!this.select.current) {
@@ -111,7 +105,7 @@ export default class Select extends Component {
     if (!this.select.current.state.menuIsOpen && event.key === "Enter") {
       this.select.current.setState({ menuIsOpen: true })
     }
-  };
+  }
 
   render() {
     const { value, ...passThroughProps } = this.props
@@ -121,11 +115,11 @@ export default class Select extends Component {
         {...passThroughProps}
         ref={this.select}
         value={Select.findOptionByValue(this.props.options, value)}
-        onChange={this.handleChange}
-        onKeyDown={this.handleKeyDown}
         filterOption={filterOption}
         theme={customTheme}
         styles={customStyles(this.props)}
+        onChange={this.handleChange}
+        onKeyDown={this.handleKeyDown}
       />
     )
   }