Почему HOC со стилями выдает ошибку?

Функциональные компоненты return всегда должны быть такими, как render function, возвращаемое значение находится в class components.

Следующие изменения в вашем коде должны исправить вашу ошибку.

class LoadIndicator extends Component {
  render() {
    return <h1>hello world</h1>
  }
}

const withLoader = (loadingProp) => (WrappedComponent) => {
  return <LoadIndicator />
}

export default withStyles(styles)(withLoader(loadingProp))

Этот HOC загрузчика должен быть создан с именем реквизита флага загрузки.

Я собираюсь предположить, что стили HOC предназначены для LoadIndicator:

const withLoader = (loadingProp) => (WrappedComponent) => {
  class LoadIndicator extends Component {

    render() {
      // Todo: render WrappedComponent and/or a loading element.
      return <h1>hello world</h1>
    }
  }

  return withStyles(styles)(LoadIndicator);
}

export default withLoader;

Теперь, когда вы используете этот HOC, вам все равно нужно указать, как называется свойство загрузки:

Вы должны обернуть возвращаемый компонент вместо функции HOC:

const withLoader = (loadingProp) => (WrappedComponent) => {
  return withStyles(styles)(class LoadIndicator extends Component {

    render() {

      return <h1>hello world</h1>
    }
  }}
}

export default (withLoader)