function CampaignsSidebar()

in public/src/components/channelManagement/campaigns/CampaignsSidebar.tsx [37:79]

41 lines of code
4 McCabe index (conditional complexity)


function CampaignsSidebar({
  campaigns,
  createCampaign,
  selectedCampaign,
  onCampaignSelected,
}: CampaignsSidebarProps): React.ReactElement {
  const classes = useStyles();
  const [campaignSearch, setCampaignSearch] = useState('');

  const searchInput = (e: React.ChangeEvent<HTMLInputElement>) => {
    if (e && e.target) {
      setCampaignSearch(e.target.value.toUpperCase());
    }
  };

  return (
    <div className={classes.root}>
      <div className={classes.buttonsContainer}>
        <NewCampaignButton
          existingNames={campaigns.map(c => c.name)}
          existingNicknames={campaigns.map(c => c.nickname || '')}
          createCampaign={createCampaign}
        />
        <TextField
          className={classes.searchField}
          label="Filter campaigns"
          type="search"
          variant="outlined"
          onInput={searchInput}
          onChange={searchInput}
        />
      </div>
      <div className={classes.listsContainer}>
        <CampaignsList
          campaigns={campaigns}
          campaignSearch={campaignSearch}
          selectedCampaign={selectedCampaign}
          onCampaignSelected={onCampaignSelected}
        />
      </div>
    </div>
  );
}