title: how use props.children with ts
body: <p>I am new in typescript and I try to use correctly props.children with typescript but i get an error. </p>
  
  <pre><code>interface IFetcher {
    url: string;
  }
  
  const Fetcher: React.FC&lt;IFetcher&gt; = props =&gt; {
    const [data, setData] = useState&lt;Array&lt;{}&gt;&gt;();
    const [isLoading, setLoading] = useState&lt;boolean&gt;(false);
    const [error, setError] = useState&lt;string&gt;("");
  
    useEffect(() =&gt; {...})
  
    return props.children(data, error, isLoading);
  };
  </code></pre>
  
  <p>this is the erreur on props.children : <strong><em>Cannot invoke an object which is possibly 'null' or 'undefined'.</em></strong></p>
  
  <p>i use this trick for resolv it : </p>
  
  <pre><code>interface IFetcher {
    url: string;
  }
  
  const Fetcher: React.FC&lt;IFetcher&gt; = props =&gt; {
    const [data, setData] = useState&lt;Array&lt;{}&gt;&gt;();
    const [isLoading, setLoading] = useState&lt;boolean&gt;(false);
    const [error, setError] = useState&lt;string&gt;("");
  
    useEffect(() =&gt; {...})
  
    return props.children &amp;&amp; props.children(data, error, isLoading);
  };
  </code></pre>
  
  <p>but i have another erreur : </p>
  
  <p><strong><em>this expression is not callable.
    No constituent of type 'string | number | true | {} | ReactElement ReactElement Component)> | null) | (new (props: any) => Component)> | ReactNodeArray | ReactPortal' is callable.</em></strong></p>
  
  <p>I need help for use the good way plz. </p>
  
  <p><strong>EDIT</strong>
  I found this solution : </p>
  
  <pre><code>interface IFetcher {
    url: string;
    children(data: Array&lt;{}&gt;, error: string, isLoading: boolean): ReactElement;
  }
  
  const Fetcher: React.FC&lt;IFetcher&gt; = props =&gt; {
    const [data, setData] = useState&lt;Array&lt;{}&gt;&gt;([]);
    const [isLoading, setLoading] = useState&lt;boolean&gt;(false);
    const [error, setError] = useState&lt;string&gt;("");
  
    useEffect(() =&gt; {...});
  
    return props.children(data, error, isLoading);
  };
  </code></pre>
  
  <p>When i define children i have no erreur now but is this the right solution ?</p>