react-native-navigation: navigation handler HOC

withNavigationHandlers.js

/* Usage
const navigationHandlers = [
  {
    predicate: props => props.currentUser.isAuthenticated === false,
    handler: navigator => {
      navigator.resetTo({
        screen: LOGIN_SCREEN,
        animationType: 'fade'
      });
    }
  }
];

export defualt withNavigationHandlers(navigationHandlers)(Home)
*/

// @flow
import * as React from 'react';
import hoistStatics from 'hoist-non-react-statics';
import get from 'lodash.get';

type WrappedProps = {
  navigator: Object,
  [propKey: string]: any
};

type Definition = {
  predicate: (props: WrappedProps) => boolean | string,
  handler: (navigator: Object) => void
};

export function handleNavigateForPredicate(props: WrappedProps) {
  return function handle(definition: Definition) {
    const { handler, predicate } = definition;

    const getFromProps = typeof predicate === 'string';
    const usePredicate = !getFromProps;

    let shouldNavigate;

    if (getFromProps) {
      shouldNavigate = get(props, predicate) === true;
    }

    if (usePredicate) {
      shouldNavigate = predicate(props);
    }

    if (shouldNavigate) {
      handler(props.navigator);
    }
  };
}

export default function withNavigationHandlers(allHandlers: Array<Definition>) {
  return (WrappedComponent: React.ComponentType<WrappedProps>) => {
    class EnhancedComponent extends React.Component<WrappedProps> {
      props: WrappedProps;
      static displayName = `withNavigationHandler(${WrappedComponent.displayName})`;

      componentDidMount() {
        allHandlers.forEach(handleNavigateForPredicate(this.props));
      }

      componentWillReceiveProps(nextProps) {
        allHandlers.forEach(handleNavigateForPredicate(nextProps));
      }

      render() {
        return <WrappedComponent {...this.props} />;
      }
    }

    return hoistStatics(EnhancedComponent, WrappedComponent);
  };
}