title: Accessing Redux props with TypeScript in React
body: <p>Been struggling to connect the Redux accessed props in a component. This is happening because I was changing a class component to a functional component, so I'm certain is a syntax error on my part:</p>
  <pre><code>imports...
  
  
  interface IVideoDetailHeroInstructorProp extends StateProps, DispatchProps {
      multipart: IMultipart;
    }
  
  export const InstructorProfilePicture  = ({multipart}: IVideoDetailHeroInstructorProp ) =&gt; {
  
      useEffect(() =&gt; {
          if (multipart.videoHolder.instructorId) {
              const instructorQuery: IQuery = { 'styleId.equals': ['2'], 'instructorId.equals': ['' + multipart.videoHolder.instructorId], 'sort': ['publishedAt,desc'], 'publishedAt.specified': ['true'], 'publicationStatus.equals': [MultipartPublicationStatus.Published] };
              getSearchEntities({ query: instructorQuery, outputKey: 'Instructor:' + multipart.videoHolder.instructorId });
          }
      })
  
      // const { instructorList } = props; this was working on class component
  
      return (
          &lt;&gt;
          {instructorList &amp;&amp; instructorList.length &gt; 0 &amp;&amp; (
            &lt;div&gt;
              {instructorList[0].image1 &amp;&amp; (&lt;img className=&quot;profile-img&quot; src={`${process.env.CDN_S3_DOMAIN}${instructorList[0].image1}`}/&gt;)}
            &lt;/div&gt;
          )}
        &lt;/&gt;
      )
  };
  
  const mapStateToProps = ({ multipart, authentication }: IRootState, ownProps) =&gt; ({
      instructorList: multipart['Instructor:' + ownProps.multipart.videoHolder.instructorId] as ReadonlyArray&lt;IMultipart&gt;,
      authorization: authentication.authorization
    });
    
    const mapDispatchToProps = { getSearchEntities, setSearchFilters };
    
    type StateProps = ReturnType&lt;typeof mapStateToProps&gt;;
    type DispatchProps = typeof mapDispatchToProps;
    
    export default connect(
      mapStateToProps,
      mapDispatchToProps
    )(InstructorProfilePicture);
  </code></pre>
  <p>In the implementation of the component:</p>
  <pre><code>&lt;InstructorProfilePicture  multipart={multipart}/&gt;
  </code></pre>
  <p>I get this message (these props are coming from Redux):</p>
  <blockquote>
  <p>Type '{ multipart: IMultipart; }' is missing the following properties
  from type 'IVideoDetailHeroInstructorProp': instructorList,
  authorization, getSearchEntities, setSearchFilters</p>
  </blockquote>
  <p>Thank you!</p>