title: Renders too much components
body: <p>I have a columns and cards in it. When i click on card it should expand. At first i wanted to watch how it looks. But instead one card modal window it rendered four. By the number of columns.</p>
  <p>So for the test i have an array with data:</p>
  <pre><code>const dataSource = [
      {
        title: 'TODO',
        cards: [
          {
            title: 'card1',
            data: 'data1',
            author: 'ABOBA',
            comments: 10
          }, {
            title: 'card2',
            data: 'data2',
            author: 'ABOBA',
            comments: 10
          }, {
            title: 'card3',
            data: 'data3',
            author: 'ABOBA',
            comments: 10
          },
        ]
      },
  ...
  ]
  </code></pre>
  <p>It is how i render cards:</p>
  <pre><code>return (
      &lt;StyledContentBlock&gt;
        {dataSource.map((item, index) =&gt;
          &lt;Column title={item.title} key={index}&gt;
            {item.cards.map((card, index) =&gt; &lt;Card dataSource={card} key={index}/&gt;)}
          &lt;/Column&gt;)}
      &lt;/StyledContentBlock&gt;
    )
  </code></pre>
  <p>It is code for card:</p>
  <pre><code>import React, {FunctionComponent} from 'react';
  import {ICardProps} from &quot;./interfaces&quot;;
  import {StyledCard} from &quot;./styles&quot;;
  import ModalCard from &quot;../ModalCard&quot;;
  
  const Card: FunctionComponent&lt;ICardProps&gt; = (props) =&gt; {
    const {dataSource} = props
    const {title, data, comments, author} = dataSource
  
    return (
      &lt;StyledCard onClick={() =&gt; &lt;ModalCard dataSource={dataSource}/&gt;}&gt;
        {title}
      &lt;/StyledCard&gt;
    )
  };
  
  export default Card;
  
  </code></pre>
  <p>And modal card code:</p>
  <pre><code>import React, {FunctionComponent} from 'react';
  import {CardExpandedBlock, StyledModalCard} from &quot;./styles&quot;;
  import {ICardProps} from &quot;../Card/interfaces&quot;;
  
  const ModalCard: FunctionComponent&lt;ICardProps&gt; = (props) =&gt; {
  
    const {dataSource} = props
    const {title, data, author, comments} = dataSource
  
    return (
      &lt;&gt;
        &lt;CardExpandedBlock/&gt;
        &lt;StyledModalCard&gt;
  
        &lt;/StyledModalCard&gt;
      &lt;/&gt;
    )
  };
  
  export default ModalCard;
  
  </code></pre>
  <p>So I cant understand why it renders 4 times modal window, and how to solve this.</p>