ConfigView Empty Area

[apeling]

For the purposes of layout flow it would be helpful to implement a new static type to create an Empty area / column.

This can currently be done by using a custom component via a layout like below. This will render an empty column between "Permit Name" and "Type".

import React from 'react';
import { ConfigView } from '@timmons-group/shared-react-components';
import { parseViewLayout } from '@timmons-group/shared-react-components/helpers';

const layout = {
  'layoutKey': 'details',
  'sections': [
    {
      'editable': true,
      'enabled': true,
      'name': 'Summary',
      'description': null,
      'order': 1,
      'columns': true,
      'layout': [
        [
          {
            'label': 'Permit Name',
            'path': 'permitName',
            'type': 0
          },
          {
            type: 'component',
            component: 'SomeEmptyComponent',
          },
          {
            'label': 'Type',
            'path': 'encumbranceType',
            'type': 10
          },
        ]
      ]
    }
  ]
};

const dynamicComponents = {
  SomeEmptyComponent: () => {} // return an empty component to create a blank column
}

const ConfigWithEmptyComponent = ({data}) => {
  const theSections = parseViewLayout(layout, data);
  return (
    <ConfigView sections={theSections} dynamicComponents={dynamicComponents} />
  );
}

Proposed solution is to add a static type to constants.js in the STATIC_TYPES object called "EMPTY". https://github.com/timmonsgroup/shared-react-components/blob/388562cd02fccaae015798d6e8103561013a99a9/src/src/constants.js#L50 Then modify the rendering logic in ConfigView/ViewField to automatically insert the empty column.

https://github.com/timmonsgroup/shared-react-components/blob/388562cd02fccaae015798d6e8103561013a99a9/src/src/stories/ConfigView/ConfigView.jsx#L252