import React from 'react';
import { useSelector } from 'react-redux';
import InvestigationTable from '../components/Investigation/InvestigationTable';
import Loader from '../components/Loader';

function InvestigationsContainer(props) {
  const {
    investigations,
    showInvestigationStats = false,
    withProposalLinks = false,
    inPanel = false,
  } = props;
  const user = useSelector((state) => state.user);

  if (!investigations) {
    return null;
  }

  if (investigations.fetching) {
    return <Loader inPanel={inPanel} message="Loading investigations..." />;
  }

  if (investigations.data.length === 0) {
    return (
      <p style={{ marginBottom: 0, fontStyle: 'italic' }}>Nothing to display</p>
    );
  }

  return (
    <InvestigationTable
      user={user}
      investigations={investigations.data}
      showInvestigationStats={showInvestigationStats}
      withProposalLinks={withProposalLinks}
    />
  );
}

export default InvestigationsContainer;
