import * as React from 'react';
import {SFC} from 'react';

import {Datagrid, DatagridMapView, DatagridFilter, DatagridFiltersSlot} from './../../../components';
import {ColumnHeaderProperty, Query, ViewMode} from './../../../components/Datagrid/models';

export const MapDatagrid: SFC<{}> = () => (
  <Datagrid
    noDefaultFilter
    noFiltersHeader
    noHeader
    noPagination
    viewMode={ViewMode.Map}
  >
    <DatagridMapView>
      Map here
    </DatagridMapView>

    <DatagridFiltersSlot>
      <DatagridFilter label="Layers" noResetButton>
        <select className="custom-select w-100">
          <option>States</option>
          <option>Counties</option>
        </select>
      </DatagridFilter>
    </DatagridFiltersSlot>
  </Datagrid>
);

MapDatagrid.displayName = 'MapDatagrid';