title: Type '(props: Props) => Element[]' is not assignable to type 'FunctionComponent<Props>'
body: <p>I am trying to add TypeScript in a React app.</p>
  
  <p>Versions:</p>
  
  <pre><code>"react": "16.9.0",
  "typescript": "3.5.3",
  </code></pre>
  
  <p>I have an array like</p>
  
  <pre><code>import aLogo from '../images/a.svg';
  import bLogo from '../images/b.svg';
  
  const websites = [
    {
      name: 'A',
      src: aLogo,
      url: 'https://a.com',
    },
    {
      name: 'B',
      src: bLogo,
      url: 'https://b.com',
    },
  ];
  </code></pre>
  
  <p>I am passing it to a component through props.</p>
  
  <pre><code>interface Website {
    name: string;
    src: string;
    url: string;
  }
  
  interface Props {
    websites: Website[];
  }
  
  const SocialList: React.FC&lt;Props&gt; = (props: Props) =&gt; {
    const { websites } = props;
  
    return websites.map((website) =&gt; {
      const { name, src, url } = website;
  
      return (
        &lt;a key={name} href={url}&gt;
          &lt;img src={src} /&gt;
        &lt;/a&gt;
      );
    });
  };
  </code></pre>
  
  <p>But it gives me error</p>
  
  <pre><code>TypeScript error in /SocialList.tsx(16,7):
  Type '(props: Props) =&gt; Element[]' is not assignable to type 'FunctionComponent&lt;Props&gt;'.
    Type 'Element[]' is missing the following properties from type '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;any, any, any&gt;)&gt;': type, props, key  TS2322
  
      14 | }
      15 | 
    &gt; 16 | const SocialList: React.FC&lt;Props&gt; = (props: Props) =&gt; {
         |       ^
  </code></pre>
  
  <p>I read the answers in <a href="https://stackoverflow.com/questions/53964694/how-do-you-declare-an-array-of-objects-inside-typescript">how do you declare an array of objects inside typescript?</a>, but still cannot figure out how to fix it.</p>