rgl.jsx

const gridView = (
  rowHeight,
  numCols,
  deleteTile,
  updateLayout,
  setDrilldown,
  isSidebarOpen,
  tiles,
) => (
  <AutoSizedReactGridLayout
    className="layout"
    cols={numCols}
    isDraggable={isSidebarOpen}
    isResizable={isSidebarOpen}
    layout={null}
    margin={[16, 16]}
    onDragStop={(layout, { x, y }, { x: newX, y: newY }) => {
      if (newX !== x || newY !== y) {
        updateLayout(layout);
        setTimeout(resize, 50);
      }
    }}
    onResizeStop={(layout, { w, h }, { w: newW, h: newH }) => {
      if (newW !== w || newH !== h) {
        updateLayout(layout);
        setTimeout(resize, 50);
      }
    }}
    onResize={() => {
      setTimeout(resize, 250);
    }}
    rowHeight={rowHeight || 400}
  >
    {tiles.map(tile => (
      <div
        key={tile.get('chart_id').toString()}
        data-grid={tile.get('layout').toJS()}
        styleName="grid-item"
      >
        {tileView(deleteTile, setDrilldown, isSidebarOpen, tile)}
      </div>
    ))}
  </AutoSizedReactGridLayout>
);