renderPlotControls()

in frontend/src/Leaderboard.tsx [216:302]
87 lines of code
5 McCabe index (conditional complexity)

  renderPlotControls() {
    const plot_options = [];
    for (let plot in PlotType) {
      const plot_typed = plot as keyof typeof PlotType;
      plot_options.push(
        <FormControlLabel
          key={plot}
          value={PlotType[plot_typed]}
          control={<Radio />}
          label={PlotType[plot_typed]}
        />
      );
    }
    const submission_ids = Array.from(this.state.selected_submissions.values());
    const selected_submissions = [];
    for (let sub_id of submission_ids) {
      console.log(sub_id);
      const sub = this.props.submission_lookup.get(sub_id);
      if (sub != undefined) {
        selected_submissions.push(
          <TableRow key={sub_id}>
            <TableCell component="th" scope="row">
              {sub.name}
            </TableCell>
          </TableRow>
        );
      }
    }
    if (selected_submissions.length === 0) {
      selected_submissions.push(
        <TableRow key="no-models">
          <TableCell component="th" scope="row">
            No Model Submissions Selected
          </TableCell>
        </TableRow>
      );
    }
    return (
      <Card variant="outlined" style={{ marginTop: "30px" }}>
        <CardContent>
          <Typography variant="body1" component="p">
            Instructions: Select models in the table, choose a plot type, and
            click "Plot"
          </Typography>
          <Grid container spacing={3}>
            <Grid item xs={5}>
              <FormControl component="fieldset" style={{ marginTop: "20px" }}>
                <FormLabel component="legend">Choose Plot Type</FormLabel>
                <RadioGroup
                  aria-label="plot_type"
                  name="plot_type"
                  value={this.state.selected_plot}
                  onChange={(e) =>
                    this.updateSelectedPlot(e.target.value as PlotType)
                  }
                >
                  {plot_options}
                </RadioGroup>
              </FormControl>
            </Grid>
            <Grid item xs={7}>
              <TableContainer component={Paper}>
                <Table aria-label="model table">
                  <TableHead>
                    <TableRow>
                      <TableCell>Selected Models</TableCell>
                    </TableRow>
                  </TableHead>
                  <TableBody>{selected_submissions}</TableBody>
                </Table>
              </TableContainer>
            </Grid>
            <Grid item xs={12}>
              <Button
                variant="contained"
                color="primary"
                onClick={(_) => this.updateGeneratedPlot()}
              >
                Create Plot
              </Button>
            </Grid>
            <Box>{this.state.generated_plot}</Box>
          </Grid>
        </CardContent>
      </Card>
    );
  }