Customize legend labels in Stream component

Hello, I’ve read the docs for Stream and Legend but did not find anything regarding how to customize legend labels.

I’ve a situation like this:

const data = [
  {
    JD: 10500,
    PC: 6700,
	date: '2018-09'
  },
  {
    JD: 7860,
    PC: 5430,
    date: '2018-08'
  }
];

const sellers = [
  {
    id: 'JD',
    name: 'John Dorian'
  },
  {
    id: 'PC',
    name: 'Percival Cox'
  }
];

const keys = sellers.map(s => s.id);

There is a way to display the name of each seller inside the legend instead of their id apart from mapping the data array and change it to use seller’s name as keys instead of their id?

[plouc]

I decided to use keys for legends for the sake of simplicity, I don’t see why it’s ridiculous as it’s totally fine to have a key named 'With Something'. And if your data storage doesn’t allow to use such keys, you can easily map the data prior to passing it to the chart:

const mapped = useMemo(() => data.map(d => ({
    ...d,
    'With Something': d.withSomething,
    'Without Something': d.withoutSomething,
})), [data])

useMemo is optional, but it should be used to prevent unnecessary renderings.

That being said, I admit it could be nice to override the labels/legends… but using a simple mapping can be limiting, for example you won’t be able to compute those depending on the values, maybe the lib could support a get(Label|Legend) property which receive the whole datum.

[WeHateNick]

@plouc I think a pattern like get(label|legend) is necessary.

For instance, I have am using a very large dataset with two letter states for keys like so:

const data = [
  nv: '300',
  al: '200',
  az: '700',
...
]

const keys = ['nv', 'al', 'az',]

Now if I want my labels to show as “Nevada, Alabama, Arizona” it’s not as simple as just mapping over my keys that I pass into the keys prop of BarChart. I would now have to change the keys of my whole dataset in data so that they match keys. This is untenable for very large datasets and seems like a really bad pattern to be manipulating my actual dataset for something that is purely presentational.