Add filtering to References Autocomplete - Fix Radio Select

src/components/input/autocomplete-select-ref/index.js

@@ -14,13 +14,15 @@ const propTypes = {
     referenceName: PropTypes.string.isRequired,
     keyName: PropTypes.string,
     labelName: PropTypes.string,
-    multiple: PropTypes.bool
+    multiple: PropTypes.bool,
+    predicate: PropTypes.func
 }
 
 const defaultProps = {
     keyName: 'key',
     labelName: 'label',
-    multiple: false
+    multiple: false,
+    predicate: (x) => true
 }
 
 const AutocompleteReference = createReactClass({
@@ -33,7 +35,9 @@ const AutocompleteReference = createReactClass({
         const { referenceName, labelName, keyName } = this.props;
         //We use this normalizedList in order not to normalize the list for every query
         if (!this.normalizedList && this.state.reference[referenceName]) {
-            this.normalizedList = this.state.reference[referenceName].map(x => ({ [keyName]: x[keyName], [labelName]: toNormalizedLowerString(x[labelName]) }));
+            this.normalizedList = this.state.reference[referenceName]
+                .filter(predicate)
+                .map(x => ({ [keyName]: x[keyName], [labelName]: toNormalizedLowerString(x[labelName]) }));
         }
 
         let data = (this.normalizedList || []).filter(x => x[labelName].indexOf(normalizedQuery) !== -1);

src/components/input/radio/__tests__/index.js

@@ -5,7 +5,7 @@ import ReactDOM from 'react-dom';
 
 import Radio from '../';
 
-const { renderIntoDocument, scryRenderedDOMComponentsWithTag, findRenderedDOMComponentWithTag, Simulate } = TestUtils;
+const { renderIntoDocument, Simulate } = TestUtils;
 
 describe('Input Radio Component', () => {
     describe('Rendering', () => {
@@ -17,9 +17,6 @@ describe('Input Radio Component', () => {
             it.skip('should have its default props', () => { //FIXME problem outside the component, inside render props are good
                 expect(renderedRadio.props.value).toBe(false);
             });
-            it('should have its default state', () => {
-                expect(renderedRadio.state.isChecked).toBe(false);
-            });
             describe('The function getValue', () => {
                 let renderedRadio;
                 beforeEach(() => {
@@ -35,12 +32,24 @@ describe('Input Radio Component', () => {
         });
         describe('When the radio is selected', () => {
             let renderedRadio;
+            let radio;
+            const onChangeSpy = jest.fn();
             beforeEach(() => {
-                renderedRadio = renderIntoDocument(<Radio label='My value' />);
-                Simulate.change(renderedRadio.refs.inputRadio);
+                renderedRadio = renderIntoDocument(
+                    <Radio
+                        label='My value'
+                        onChange={onChangeSpy}
+                        value={true}
+                    />);
             });
-            it('should change the state', () => {
-                expect(renderedRadio.state.isChecked).toBe(true);
+            it('should call the _onChange prop', () => {
+                radio = ReactDOM.findDOMNode(renderedRadio.refs.inputRadio);
+                Simulate.change(radio, { target: { checked: true } });
+                expect(onChangeSpy).toHaveBeenCalledTimes(1);
+            });
+
+            it('the returned value should be equals to this.props.value', () => {
+                expect(renderedRadio.getValue()).toBe(true);
             });
         })
     });

src/components/input/radio/index.js

@@ -22,14 +22,6 @@ class Radio extends Component {
         onChange: PropTypes.func
     };
 
-    state = {
-        isChecked: isUndefined(this.props.value) ? false : this.props.value
-    };
-
-    componentWillReceiveProps(newProps) {
-        this.setState({ isChecked: newProps.value });
-    }
-
     componentDidMount() {
         this.updateCheckedClass();
     }
@@ -40,7 +32,7 @@ class Radio extends Component {
 
     updateCheckedClass() {
         const { inputMdl } = this.refs;
-        const { isChecked } = this.state;
+        const isChecked = this.getValue();
         if (inputMdl) {
             const { classList } = inputMdl;
             if (isChecked === true) classList.add('is-checked');
@@ -53,27 +45,25 @@ class Radio extends Component {
     * @param  {event} event
     */
     _onChange = () => {
-        this.setState({ isChecked: !this.state.isChecked }, () => {
-            if (this.props.onChange) {
-                this.props.onChange(this.state.isChecked);
-            }
-        });
+        if (this.props.onChange) {
+            this.props.onChange();
+        }
     }
 
     /**
     * Get the value from the input in  the DOM.
     * @returns The DOM node value.
     */
     getValue() {
-        return this.state.isChecked;
+        return isUndefined(this.props.value) ? false : this.props.value
     }
 
     /**
     * Render the Checkbox HTML.
     * @return {VirtualDOM} - The virtual DOM of the checkbox.
     */
     render() {
-        const { isChecked } = this.state;
+        const isChecked = this.getValue();
         const { label } = this.props;
         const validInputProps = filterProps(this.props);
 
@@ -92,4 +82,4 @@ class Radio extends Component {
 
 Radio.displayName = 'InputRadio';
 
-export default Radio;
+export default Radio;