Move isOnlyResult out of component state

src/containers/contextContainer.js

@@ -1,29 +1,13 @@
-import {head, pick} from 'lodash';
+import {pick} from 'lodash';
 import React from 'react';
 import {polyfill} from 'react-lifecycles-compat';
 
 import TypeaheadContext from '../TypeaheadContext';
-import {getHintText} from '../utils';
+import {getHintText, getIsOnlyResult} from '../utils';
 import {RETURN} from '../constants';
 
 function contextContainer(Typeahead) {
   class WrappedTypeahead extends React.Component {
-    state = {
-      isOnlyResult: false,
-    };
-
-    static getDerivedStateFromProps(props, state) {
-      const {allowNew, highlightOnlyResult, results} = props;
-
-      if (!highlightOnlyResult || allowNew) {
-        return null;
-      }
-
-      return {
-        isOnlyResult: results.length === 1 && !head(results).disabled,
-      };
-    }
-
     componentDidUpdate(prevProps, prevState) {
       const {allowNew, onInitialItemChange, results} = this.props;
 
@@ -49,7 +33,7 @@ function contextContainer(Typeahead) {
           value={{
             ...contextValues,
             hintText: getHintText(this.props),
-            isOnlyResult: this.state.isOnlyResult,
+            isOnlyResult: getIsOnlyResult(this.props),
           }}>
           <Typeahead
             {...this.props}
@@ -64,7 +48,7 @@ function contextContainer(Typeahead) {
 
       switch (e.keyCode) {
         case RETURN:
-          if (this.state.isOnlyResult) {
+          if (getIsOnlyResult(this.props)) {
             onAdd(initialItem);
           }
           break;

src/utils/getIsOnlyResult.js

@@ -0,0 +1,11 @@
+import {head} from 'lodash';
+
+function getIsOnlyResult({allowNew, highlightOnlyResult, results}) {
+  if (!highlightOnlyResult || allowNew) {
+    return false;
+  }
+
+  return results.length === 1 && !head(results).disabled;
+}
+
+export default getIsOnlyResult;

src/utils/index.js

@@ -5,6 +5,7 @@ export getAccessibilityStatus from './getAccessibilityStatus';
 export getDisplayName from './getDisplayName';
 export getHintText from './getHintText';
 export getInputText from './getInputText';
+export getIsOnlyResult from './getIsOnlyResult';
 export getMatchBounds from './getMatchBounds';
 export getMenuItemId from './getMenuItemId';
 export getOptionLabel from './getOptionLabel';

test/utils/getIsOnlyResultSpec.js

@@ -0,0 +1,42 @@
+import {expect} from 'chai';
+
+import getIsOnlyResult from '../../src/utils/getIsOnlyResult';
+
+describe('getIsOnlyResult', () => {
+  let props;
+
+  beforeEach(() => {
+    props = {
+      allowNew: false,
+      highlightOnlyResult: true,
+      results: ['The only result!'],
+    };
+  });
+
+  it('returns true', () => {
+    expect(getIsOnlyResult(props)).to.equal(true);
+  });
+
+  it('returns false when `highlightOnlyResult` is disabled', () => {
+    props.highlightOnlyResult = false;
+    expect(getIsOnlyResult(props)).to.equal(false);
+  });
+
+  it('returns false when custom options are allowed', () => {
+    props.allowNew = true;
+    expect(getIsOnlyResult(props)).to.equal(false);
+  });
+
+  it('returns false when there are more or less than one result', () => {
+    props.results = ['One', 'Two'];
+    expect(getIsOnlyResult(props)).to.equal(false);
+
+    props.results = [];
+    expect(getIsOnlyResult(props)).to.equal(false);
+  });
+
+  it('returns false when the only result is disabled', () => {
+    props.results = [{disabled: true}];
+    expect(getIsOnlyResult(props)).to.equal(false);
+  });
+});