title: Flow React: Cannot create element because React.Component [1] is not a React component
body: <p>I just started to make use of flow a few weeks ago and from a week ago i've been getting a flow error on which i've no idea how to fix.</p>
  
  <p>The code goes like this:</p>
  
  <pre><code>// @flow
  
  import React, { Component } from "react";
  import { Redirect, Route } from "react-router-dom";
  import CookieStorage from "./../services/CookieStorage";
  import type { Component as ComponentType } from "react";
  
  type Props = {
      component: ComponentType&lt;any, any&gt;
  }
  
  class ProtectedRoute extends Component&lt;Props&gt; {
      render() {
          const isAuthenticated     = this.isAuthenticated();
          const {...props}          = this.props;
          const AuthorizedComponent = this.props.component;
  
          return (
              &lt;Route
                  {...props}
                  render={props =&gt; (
                      isAuthenticated ?
                          &lt;AuthorizedComponent {...props} /&gt; :
                          &lt;Redirect to="/"/&gt;
                  )}
              /&gt;
          );
      }
  
      isAuthenticated(): boolean {
          const data = CookieStorage.get("foobar");
  
          return data !== null;
      }
  }
  
  export default ProtectedRoute;
  </code></pre>
  
  <p>In here flow throws this error:</p>
  
  <pre><code>Error:(23, 8) Cannot create `AuthorizedComponent` element because `React.Component` [1] is not a React component.
  </code></pre>
  
  <p>I don't know if i am doing a wrong import type or a wrong type declaration for the component that is to be rendered when the authentication example is ok.</p>
  
  <p>I've copied this code from a website i don't remember where, but he was making use of this snippet using <code>const {component: Component} = this.props</code> and render it as <code>&lt;Component {...props} /&gt;</code> which for me it seems a little ambiguous, which is why i changed the declaration a bit to make it easy to understand when reading, but still even doing the exact same code like the snipped where i copied this code, flow still throws that error.</p>
  
  <p>I've made a <a href="https://gist.github.com/oscarr-reyes/b965d5c13a095866931b50a4334b8711" rel="noreferrer">gist</a> of this in case someone would knows a solution for this and would like to make a change, if no one is able to help me fix this in here, then i will send a ticket issue to their project using this gist</p>