title: React component children error with typecript
body: <p>I started learning react with typescript a few days ago and I am getting this error</p>
  <pre><code>    /home/sotiris/Github/ecommerce-merng-platform/admin/src/components/DashboardHOC/DashboardHOC.tsx
  TypeScript error in /home/sotiris/Github/ecommerce-merng-platform/admin/src/components/DashboardHOC/DashboardHOC.tsx(118,22):
  No overload matches this call.
    Overload 1 of 2, '(props: { component: ElementType&lt;any&gt;; } &amp; { children: string | number | boolean | {} | ReactElement&lt;any, string | ((props: any) =&gt; ReactElement&lt;any, string | ... | (new (props: any) =&gt; Component&lt;any, any, any&gt;)&gt; | null) | (new (props: any) =&gt; Component&lt;...&gt;)&gt; | ReactNodeArray | ReactPortal; disableGutters?: boolean | undefined; fixed?: boolean | undefined; maxWidth?: false | ... 5 more ... | undefined; } &amp; CommonProps&lt;...&gt; &amp; Pick&lt;...&gt;): Element', gave the following error.
      Type 'ReactNode' is not assignable to type 'string | number | boolean | {} | ReactElement&lt;any, string | ((props: any) =&gt; ReactElement&lt;any, string | ... | (new (props: any) =&gt; Component&lt;any, any, any&gt;)&gt; | null) | (new (props: any) =&gt; Component&lt;...&gt;)&gt; | ReactNodeArray | ReactPortal'.
        Type 'undefined' is not assignable to type 'string | number | boolean | {} | ReactElement&lt;any, string | ((props: any) =&gt; ReactElement&lt;any, string | ... | (new (props: any) =&gt; Component&lt;any, any, any&gt;)&gt; | null) | (new (props: any) =&gt; Component&lt;...&gt;)&gt; | ReactNodeArray | ReactPortal'.
    Overload 2 of 2, '(props: DefaultComponentProps&lt;ContainerTypeMap&lt;{}, &quot;div&quot;&gt;&gt;): Element', gave the following error.
      Type 'ReactNode' is not assignable to type 'string | number | boolean | {} | ReactElement&lt;any, string | ((props: any) =&gt; ReactElement&lt;any, string | ... | (new (props: any) =&gt; Component&lt;any, any, any&gt;)&gt; | null) | (new (props: any) =&gt; Component&lt;...&gt;)&gt; | ReactNodeArray | ReactPortal'.
        Type 'undefined' is not assignable to type 'string | number | boolean | {} | ReactElement&lt;any, string | ((props: any) =&gt; ReactElement&lt;any, string | ... | (new (props: any) =&gt; Component&lt;any, any, any&gt;)&gt; | null) | (new (props: any) =&gt; Component&lt;...&gt;)&gt; | ReactNodeArray | ReactPortal'.  TS2769
  
      116 |       &lt;main className={classes.content}&gt;
      117 |         &lt;ErrorAlert&gt;
    &gt; 118 |           &lt;Container&gt;{children}&lt;/Container&gt;
          |                      ^
      119 |         &lt;/ErrorAlert&gt;
      120 |       &lt;/main&gt;
      121 |     &lt;/div&gt;
  </code></pre>
  <p>Dashboard.tsx</p>
  <pre><code>const DashboardHOC: React.FC&lt;React.ReactNode&gt; = ({ children }) =&gt; {
     ...
      {children}
     ...
  }
  </code></pre>
  <p>Error.tsx</p>
  <pre><code>const Error: React.FC&lt;React.ReactNode&gt; = ({ children }) =&gt; {
     ...
      {children}
     ...
  }
  </code></pre>
  <p>What Am i doing wrong ?</p>