AuthorizedRoute Component

AuthorizedRoute.ts

class AuthorizedRoute extends Component<StateProps & DispatchProps & RouteProps, {}> {

  public componentWillMount() {
    if (!this.props.token) {
      this.props.dispatchLogin();
    }
  }

  public render() {
    const { component: RouteComponent, render, token, ...rest } = this.props;

    if (!this.props.token) {
      return <Route { ...rest } render={ this.renderFalse } />;
    }

    if (render) {
      return <Route { ...rest } render={ render } />;
    }

    return <Route { ...rest } component={ RouteComponent } />;
  }

  private renderFalse = () => false;
}

interface StateProps {
  token?: string;
}

const mapStateToProps = (state: AppState): StateProps => ({
  token: tokenSelector(state),
});

interface DispatchProps {
  dispatchLogin: () => LoginPromise;
  push: (location: LocationDescriptor, state?: LocationState) => void;
}

const mapDispatchToProps = (dispatch: Dispatch) => ({
  dispatchLogin: () => dispatch(login()),
});

export default connect<StateProps, DispatchProps, RouteProps>(mapStateToProps, mapDispatchToProps)(AuthorizedRoute);