lnked

Просто нужно еще чтобы компонент `SortableElement ` принял все пропсы.

const SortableItem = SortableElement((props) => (
  <ElementItem {...props} />
));

const withSort = WrappedComponent => props => {
  return WrappedComponent ? <WrappedComponent {...props} /> : null;
});

const withSort = (...params) => WrappedComponent => props => {
  // params usage
  return WrappedComponent ? <WrappedComponent {...props} /> : null;
});

export default withSort(param1, param2)(Component);

componentDidMount() {
   
      document.documentElement.addEventListener('scroll', this.handleScroll);
    
  }

  componentWillUnmount() {
    document.documentElement.removeEventListener('scroll', this.handleScroll);
  }

 
  handleScroll() {
   this.props.fetchData(url);
}

const Wrapper = styled.div`
  // some styles
`;

const ChildElement = styled.div`
  // some styles
`;

class MyComponent extends React.Component {
  static ChildElement = ChildElement;
  
  render() {
    const { className } = this.props;

    return (
      <Wrapper className={className}>
        <ChildElement>Some text</ChildElement>
      </Wrapper>
    )
  }
}

export default MyComponent;

const SyledMyComponent = styled(MyComponent)`
  // some styles

  ${MyComponent.ChildElement} {
    // some styles for ChildElement
  }
`;

const AbstractElement = styled.div`
  // some styles
`;

const ConcreteElement = AbstractElement.extend`
  // some styles
`;

class Welcome extends React.Component {
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}

const Welcome ({ name }) => <h1>Hello, {name}</h1>;

это короткий вариант записи, который можно использовать только с babel. Конкретно плагин transform-class-properties. Он входит в прессеты stage-2, stage-1, stage-0. Так, что если используете один из них смело используйте.
Запись:

class Parent extends Component {
  constructor(props) {
    super(props);

    this.state = {
      data: []
    };

    this.handler = this.handler.bind(this);
  }

  handler(e) {
    // do something
  }
}

Аналогична:

class Parent extends Component {
  state = {
    data: [],
  };

  handler = e => {
    // do something
  };
}

В React разработке это один стандартов.

export const handleError = error => ({ type: 'NEW_ERROR', payload: error });
export const doSomething = data => ({ type: 'DO_SOMETHING', payload: data });

import { apiCall } from './api';
import { handleError, doSomething } from './actionCreators';

export const asyncAction = () => dispatch => {
  try {
    const result = await apiCall();
    dispatch(doSomething(result));
    
    return result;
  } catch (e) {
    dispatch(hanldeError(e));
  }
};

export const handleError = error => ({ type: 'NEW_ERROR', payload: error });
export const doSomething = data => ({ type: 'DO_SOMETHING', payload: data });

import { connect } from 'react-redux';
import { apiCall } from './api';
import { handleError, doSomething } from './actionCreators';

class ExampleComponent extends React.Component {
  componentDidMount() {
    const { dispatch } = this.props;

    apiCall().then(
      res => dispatch(doSomething(res)),
      err => dispatch(handleError(err)),
    );
  }
  
  render() { /* ... */ }
}

export default connect()(ExampleComponent);

import { connect } from 'react-redux';
import { apiCall } from './api';
import { handleError, doSomething } from './actionCreators';

class ExampleComponent extends React.Component {
  componentDidMount() {
    const { doSomething, handleError } = this.props;

    apiCall().then(
      res => doSomething(res),
      err => handleError(err),
    );
  }
  
  render() { /* ... */ }
}

mapDispatchToProps = {
  handleError,
  doSomething,
};

export default connect(null, mapDispatchToProps)(ExampleComponent);

Component A

state = {
  fromSuperComponent: '123',
}

callMeHandle = (e) => {
  this.setState({
    fromSuperComponent: e.currentTarget.value,
  })
}

render() {
  return (
    <form>
      <input type='text' value='test'/>
      <SuperComponent callMeWhenDataChanged={this.callMeHandle} value={this.state.fromSuperComponent} />
    </form>
  )
}

SuperComponent

render() {
  <input type='text' value={this.props.value} onChange={this.props.callMeWhenDataChanged} />
}

addGroup = () => {
  this.setState(prevState => ({ items : [ ...prevState.items, undefined ] }));
};

shouldComponentUpdate( nextProps, nextState ) {
   return nextState.items !== this.state.Items;
}

shouldComponentUpdate( nextProps, nextState ) {
   return nextState.items !== this.state.Items &&
     JSON.stringify(nextState.items.sort()) !== JSON.stringify(this.state.items.sort());
}

в shouldComponentUpdate nextState.items почему-то равно всегда this.state.items

let items = this.state.items;
items.push( undefined );