Ensure custom plots legend matches plot values

[julieg18]

• our custom plot legend will always show all experiments/commits even if they are not in the plot values. This pr ensures that the legend only shows experiments/commits that are in the plot

main

PR

Related to #4725

[mattseddon]

[Q] Is there a reason to do this after collecting completeColorScale? Would be good to have all of the transformation/collection in the same place.

[julieg18]

Originally, I was trying to avoid looping over all the experiments for each plot, but I now see we're still looping over completeColorScale anyway 😄. I'll update the code to create a single color scale per plot.

[julieg18]

We need to filter through the original color scale values first so they retain their order in the legend. Maybe there's a simpler way of doing this though 🤔

[mattseddon]

something like

const removeSelectedExperiment = (
  orderedColorScale: ColorScale,
  hasValues: boolean,
  idx: number
) => {
  const isSelectedExperiment = idx !== -1
  if (!isSelectedExperiment || hasValues) {
    return
  }

  orderedColorScale.domain.splice(idx, 1)
  orderedColorScale.range.splice(idx, 1)
}

const fillColorScale = (
  experiments: Experiment[],
  colorScale: ColorScale | undefined,
  valueIds: string[]
) => {
  const orderedColorScale = {
    domain: [...(colorScale?.domain || [])],
    range: [...(colorScale?.range || [])]
  }

  for (const experiment of experiments) {
    const { id } = experiment
    const idx = orderedColorScale.domain.indexOf(id)
    const isSelectedExperiment = idx !== -1
    const hasValues = valueIds.includes(id)

    if (!hasValues || isSelectedExperiment) {
      removeSelectedExperiment(orderedColorScale, hasValues, idx)
      continue
    }

    orderedColorScale.domain.push(id)
    orderedColorScale.range.push('#4c78a8' as Color)
  }

  return orderedColorScale
}

[julieg18]

Works great, thanks!

[codeclimate]

Code Climate has analyzed commit 12739c0 and detected 0 issues on this pull request.

The test coverage on the diff in this pull request is 100.0% (85% is the threshold).

This pull request will bring the total coverage in the repository to 95.0% (0.0% change).

View more on Code Climate.