function renderColumnHeader()

in src/components/CompareResults/TableHeader.tsx [322:392]
68 lines of code
9 McCabe index (conditional complexity)

  function renderColumnHeader(header: CompareResultsTableColumn) {
    let content: ReactNode = header.name;

    if ('sortFunction' in header && 'filter' in header) {
      content = (
        <ButtonGroup
          variant='contained'
          color='tableHeaderButton'
          disableElevation
        >
          <SortableColumnHeader
            name={header.name}
            displayLabel={false}
            sortDirection={header.key === sortColumn ? sortDirection : null}
            onToggle={(newSortDirection) =>
              onToggleSort(header.key, newSortDirection)
            }
          />
          <FilterableColumnHeader
            possibleValues={header.possibleValues}
            name={header.name}
            columnId={header.key}
            checkedValues={filters.get(header.key)}
            onClearFilter={() => onClearFilter(header.key)}
            onToggleFilter={(checkedValues) =>
              onToggleFilter(header.key, checkedValues)
            }
            tooltip={header.tooltip}
          />
        </ButtonGroup>
      );
    } else if ('sortFunction' in header) {
      content = (
        <SortableColumnHeader
          name={header.name}
          displayLabel={true}
          sortDirection={header.key === sortColumn ? sortDirection : null}
          onToggle={(newSortDirection) =>
            onToggleSort(header.key, newSortDirection)
          }
        />
      );
    } else if ('filter' in header) {
      content = (
        <FilterableColumnHeader
          possibleValues={header.possibleValues}
          name={header.name}
          columnId={header.key}
          checkedValues={filters.get(header.key)}
          onClearFilter={() => onClearFilter(header.key)}
          onToggleFilter={(checkedValues) =>
            onToggleFilter(header.key, checkedValues)
          }
          tooltip={header.tooltip}
        />
      );
    }
    // we don't want to show tooltip in filterable columns again
    if (header.tooltip && !('filter' in header)) {
      return (
        <Tooltip title={header.tooltip} placement='top' arrow>
          {/* Box is used because tooltip expects a single valid element but sometimes content is a string */}
          <Box component='span' sx={{ cursor: 'pointer' }}>
            {content}
          </Box>
        </Tooltip>
      );
    }

    return content;
  }