fix(waffle): use descend sortPredicate by default

[markov00]

Summary

I've added to the Waffle story the sortPredicate configuration and removed an unnecessary layer configuration.

Checklist

• The proper chart type label has been added (e.g. :xy, :partition)
• The proper documentation and/or storybook story has been added or updated
• Visual changes have been tested with all available themes including dark, light, eui-dark & eui-light

[monfera]

What's the sort predicate doing? It'd be nice to lock in the effect with a new eg. URL based image test so it's caught if there's regression.

One thing I remember waffle still needed is a tooltip approach where the entire color block, rather than just a single square is highlighted on hover, though I'm not too sure about how it should go with the tooltip. Ideally the entirety of a block of a given color would be perceived by the tooltip as one unit, so the tooltip location not jump as the user moves the mouse across multiple cells in a row. Same with events.

One option for that is to treat the unison of cells of a category as one thing, but render it to make it appear cell by cell.

Another option is to, at least, virtually overlay the visuals with invisible, unrendered, larger geoms.

One challenge is that cells of a color don't necessarily form a contiguous block, they can split in a way to form two disjunct areas. For example, consider the O:

XXXXXXXXXX
XXXXXXXXXX
XXXXXXXXXX
XXXXXXXXXX
XXXXXXXXXX
XXXXXXXXXX
XXXXXXXXXX
XXXXXXXXXX
XXXXXXXXOO
OOOOOYYYYY

Sometimes it's contiguous but still a rectilinear hexagon/octogon

[markov00]

@monfera you are right, I will add a knob for that so we can control and test this.

I've found anyway something that we can probably fix on the current implementation, but please tell me if that was wanted:
in the legend.ts file you put the comment: // waffle has inherent top to bottom descending order applying a descending order to the legend items.
But the same is not applied for the data itself as for other partition charts. If I randomize the data order then I can achieve this:

I think the we are missing the right sorting option for the waffle in the sorter used to create the partitionTree in hierarchy_of_arrays.ts

const sorter = (layout: PartitionLayout) => ({ sortPredicate }: Layer, i: number) =>
  sortPredicate ||
  (isTreemap(layout) || isSunburst(layout)
    ? descendingValueNodes
    : isMosaic(layout)
    ? i === 2
      ? ascendingValueNodes
      : descendingValueNodes
    : null);

Applying the descendingValueNodes sortPredicate by default with isWaffle(layout) should probably be desired. What do you think?

[monfera]

Applying the descendingValueNodes sortPredicate by default with isWaffle(layout) should probably be desired. What do you think?

@markov00 yes as we discussed it's the sensible approach