Map-From-Id component getting bloated; refactor

[allthesignals]

1. Find abstract cases and move into utilities (breaks, buildPaint)
2. Move POJOs into top of component file or environment.js (highlightedFeatureLayer)
3. Use array destructuring where possible (see line 73)

[allthesignals]

Also please change the buildPaint to this:

function buildPaint({ colors, breaks, opacity }) {
  const paint = {
    'fill-color': [
      'curve',
      ['step'],
      [
        'number',
        ['get', 'value'],
        1,
      ],
    ],
    'fill-opacity': opacity,
  };
  const colorArray = paint['fill-color'];

  colors.forEach((color, i) => {
    colorArray.push(colors[i]);
    colorArray.push(breaks[i]);
  });

  colorArray.push('#FFF');

  return paint;
}

[allthesignals]

in the original soruce "break" is a reserved word

[allthesignals]

It'd be better to separate out the legend stuff and make it more composable so that it's easier to test. So, you might have {{#map-from-id as |breaks|}} {{legend-component breaks=breaks}} {{/map-from-id}}

[allthesignals]

We can work on this t ogether chris

[allthesignals]

Moving builtLayers upstream breaks the legends because there is a "builtLayers" format of the layer configurations which is used for the layers, and there is a legend format of the configuration that depends on the format of the layers configuration before it was changed