Adjust to simpler result mapping, add some initial result data

src/components/ResultMarker.js

@@ -6,21 +6,21 @@ const ResultMarker = ({ label, lat, long }) => {
   if (typeof lat === 'undefined' || typeof long === 'undefined') {
     return(null);
   } else {
-    const pos = [+lat[0].value, +long[0].value];
+    const pos = [+lat, +long];
     return (
       <Marker position={pos}>
         <Popup>
-          <p>{label[0].value}</p>
+          <p>{label}</p>
         </Popup>
       </Marker>
     );
-  }  
+  }
 };
 
 ResultMarker.propTypes = {
-  label: PropTypes.array.isRequired,
-  lat: PropTypes.array.isRequired,
-  long: PropTypes.array.isRequired,
+  label: PropTypes.string.isRequired,
+  lat: PropTypes.string.isRequired,
+  long: PropTypes.string.isRequired,
 };
 
 export default ResultMarker;

src/components/ResultTable.js

@@ -6,6 +6,7 @@ import Table from '@material-ui/core/Table';
 import TableBody from '@material-ui/core/TableBody';
 import TableCell from '@material-ui/core/TableCell';
 import TableHead from '@material-ui/core/TableHead';
+import TablePagination from '@material-ui/core/TablePagination';
 import TableRow from '@material-ui/core/TableRow';
 import TableSortLabel from '@material-ui/core/TableSortLabel';
 import Toolbar from '@material-ui/core/Toolbar';
@@ -18,18 +19,11 @@ import DeleteIcon from '@material-ui/icons/Delete';
 import FilterListIcon from '@material-ui/icons/FilterList';
 import { lighten } from '@material-ui/core/styles/colorManipulator';
 
-let counter = 0;
-function createData(name, calories, fat, carbs, protein) {
-  counter += 1;
-  return { id: counter, name, calories, fat, carbs, protein };
-}
-
 const columnData = [
-  { id: 'name', numeric: false, disablePadding: true, label: 'Name' },
-  { id: 'calories', numeric: true, disablePadding: false, label: 'Type' },
-  { id: 'fat', numeric: true, disablePadding: false, label: 'Area' },
-  { id: 'carbs', numeric: true, disablePadding: false, label: 'Carbs (g)' },
-  { id: 'protein', numeric: true, disablePadding: false, label: 'Protein (g)' },
+  { id: 'name', numeric: false, disablePadding: false, label: 'Name' },
+  { id: 'type', numeric: false, disablePadding: false, label: 'Type' },
+  { id: 'area', numeric: false, disablePadding: false, label: 'Area' },
+  { id: 'source', numeric: false, disablePadding: false, label: 'Source' },
 ];
 
 class EnhancedTableHead extends React.Component {
@@ -130,7 +124,7 @@ let EnhancedTableToolbar = props => {
           </Typography>
         ) : (
           <Typography variant="title" id="tableTitle">
-            Search results
+            Nutrition
           </Typography>
         )}
       </div>
@@ -164,8 +158,7 @@ EnhancedTableToolbar = withStyles(toolbarStyles)(EnhancedTableToolbar);
 const styles = theme => ({
   root: {
     width: '100%',
-    height: '100%',
-    marginTop: theme.spacing.unit * 2,
+    marginTop: theme.spacing.unit * 3,
   },
   table: {
     minWidth: 700,
@@ -183,21 +176,7 @@ class EnhancedTable extends React.Component {
       order: 'asc',
       orderBy: 'calories',
       selected: [],
-      data: [
-        createData('Cupcake', 305, 3.7, 67, 4.3),
-        createData('Donut', 452, 25.0, 51, 4.9),
-        createData('Eclair', 262, 16.0, 24, 6.0),
-        createData('Frozen yoghurt', 159, 6.0, 24, 4.0),
-        createData('Gingerbread', 356, 16.0, 49, 3.9),
-        createData('Honeycomb', 408, 3.2, 87, 6.5),
-        createData('Ice cream sandwich', 237, 9.0, 37, 4.3),
-        createData('Jelly Bean', 375, 0.0, 94, 0.0),
-        createData('KitKat', 518, 26.0, 65, 7.0),
-        createData('Lollipop', 392, 0.2, 98, 0.0),
-        createData('Marshmallow', 318, 0, 81, 2.0),
-        createData('Nougat', 360, 19.0, 9, 37.0),
-        createData('Oreo', 437, 18.0, 63, 4.0),
-      ].sort((a, b) => (a.calories < b.calories ? -1 : 1)),
+      data: this.props.data,
       page: 0,
       rowsPerPage: 5,
     };
@@ -221,7 +200,7 @@ class EnhancedTable extends React.Component {
 
   handleSelectAllClick = (event, checked) => {
     if (checked) {
-      this.setState({ selected: this.state.data.map(n => n.id) });
+      this.setState({ selected: this.state.data.map(n => n.s) });
       return;
     }
     this.setState({ selected: [] });
@@ -248,20 +227,11 @@ class EnhancedTable extends React.Component {
     this.setState({ selected: newSelected });
   };
 
-  handleChangePage = (event, page) => {
-    this.setState({ page });
-  };
-
-  handleChangeRowsPerPage = event => {
-    this.setState({ rowsPerPage: event.target.value });
-  };
-
   isSelected = id => this.state.selected.indexOf(id) !== -1;
 
   render() {
     const { classes } = this.props;
-    const { data, order, orderBy, selected, rowsPerPage, page } = this.state;
-    const emptyRows = rowsPerPage - Math.min(rowsPerPage, data.length - page * rowsPerPage);
+    const { data, order, orderBy, selected } = this.state;
 
     return (
       <Paper className={classes.root}>
@@ -277,36 +247,30 @@ class EnhancedTable extends React.Component {
               rowCount={data.length}
             />
             <TableBody>
-              {data.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map(n => {
-                const isSelected = this.isSelected(n.id);
+              {data.map(n => {
+                const isSelected = this.isSelected(n.s);
                 return (
                   <TableRow
                     hover
-                    onClick={event => this.handleClick(event, n.id)}
+                    onClick={event => this.handleClick(event, n.s)}
                     role="checkbox"
                     aria-checked={isSelected}
                     tabIndex={-1}
-                    key={n.id}
+                    key={n.s}
                     selected={isSelected}
                   >
                     <TableCell padding="checkbox">
                       <Checkbox checked={isSelected} />
                     </TableCell>
-                    <TableCell component="th" scope="row" padding="none">
-                      {n.name}
+                    <TableCell component="th" scope="row">
+                      {n.label}
                     </TableCell>
-                    <TableCell numeric>{n.calories}</TableCell>
-                    <TableCell numeric>{n.fat}</TableCell>
-                    <TableCell numeric>{n.carbs}</TableCell>
-                    <TableCell numeric>{n.protein}</TableCell>
+                    <TableCell>{n.typeLabel}</TableCell>
+                    <TableCell>{n.broaderAreaLabel}</TableCell>
+                    <TableCell>{n.source}</TableCell>
                   </TableRow>
                 );
               })}
-              {emptyRows > 0 && (
-                <TableRow style={{ height: 49 * emptyRows }}>
-                  <TableCell colSpan={6} />
-                </TableRow>
-              )}
             </TableBody>
           </Table>
         </div>
@@ -317,6 +281,7 @@ class EnhancedTable extends React.Component {
 
 EnhancedTable.propTypes = {
   classes: PropTypes.object.isRequired,
+  data: PropTypes.array
 };
 
 export default withStyles(styles)(EnhancedTable);

src/components/SimpleTable.js

@@ -15,16 +15,16 @@ const styles = theme => ({
     overflowX: 'auto',
   },
   table: {
-    minWidth: 700,
+    minWidth: 750,
   },
 });
 
 const SimpleTable = (props) => {
-  const { classes, search } = props;
-  
+  const { classes, data } = props;
+
   return (
     <Paper className={classes.root}>
-      {search.results.length > 0 &&
+      {data.length > 0 &&
         <Table className={classes.table}>
           <TableHead>
             <TableRow>
@@ -35,15 +35,15 @@ const SimpleTable = (props) => {
             </TableRow>
           </TableHead>
           <TableBody>
-            {search.results.map(result => {
+            {data.map(result => {
               return (
                 <TableRow key={result.s}>
                   <TableCell component="th" scope="row">
-                    {result.label[0].value}
+                    {result.label}
                   </TableCell>
-                  <TableCell>{result.typeLabel[0].value}</TableCell>
-                  <TableCell>{result.broaderAreaLabel[0].value}</TableCell>
-                  <TableCell>{result.source[0].value}</TableCell>
+                  <TableCell>{result.typeLabel}</TableCell>
+                  <TableCell>{result.broaderAreaLabel}</TableCell>
+                  <TableCell>{result.source}</TableCell>
                 </TableRow>
               );
             })}
@@ -56,7 +56,7 @@ const SimpleTable = (props) => {
 
 SimpleTable.propTypes = {
   classes: PropTypes.object.isRequired,
-  search: PropTypes.object.isRequired,
+  data: PropTypes.array.isRequired,
 };
 
 export default withStyles(styles)(SimpleTable);

src/containers/MapApp.js

@@ -15,7 +15,7 @@ import ChevronRightIcon from '@material-ui/icons/ChevronRight';
 import IntegrationAutosuggest from '../components/IntegrationAutosuggest';
 import LeafletMap from '../components/LeafletMap';
 import Message from '../components/Message';
-// import ResultTable from '../components/ResultTable';
+//import ResultTable from '../components/ResultTable';
 import SimpleTable from '../components/SimpleTable';
 
 import {
@@ -28,7 +28,7 @@ import {
   closeDrawer
 } from '../actions';
 
-const drawerWidth = 700;
+const drawerWidth = 800;
 
 const styles = theme => ({
   root: {
@@ -141,7 +141,9 @@ let MapApp = (props) => {
           {theme.direction === 'rtl' ? <ChevronRightIcon /> : <ChevronLeftIcon />}
         </IconButton>
       </div>
-      <SimpleTable search={props.search} />
+      {props.search.results.length > 0 &&
+        <SimpleTable data={props.search.results} />
+      }
     </Drawer>
   );
 

src/reducers/search.js

@@ -10,10 +10,212 @@ import suggestions from './suggestions';
 import results from './results';
 
 export const INITIAL_STATE = {
-  query: '',
+  query: 'kive',
   datasets: ['warsa_karelian_places', 'warsa_municipalities'],
   suggestions: [],
-  results: []
+  results: [ { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_20949',
+    label: 'Kiveksienkennäs',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Lumivaara',
+    lat: '61.470031',
+    long: '30.12829',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_19450',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Jääski',
+    lat: '60.998066',
+    long: '28.795745',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_26729',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Uukuniemi',
+    lat: '61.703397',
+    long: '30.03475',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_31110',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Uukuniemi',
+    lat: '61.784059',
+    long: '30.167493',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_15730',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Hiitola',
+    lat: '61.182671',
+    long: '29.736767',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_22715',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Kanneljärvi',
+    lat: '60.401013',
+    long: '29.452854',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_14516',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Kurkijoki',
+    lat: '61.478766',
+    long: '29.715502',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_21873',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Käkisalmen mlk',
+    lat: '60.958474',
+    long: '30.163148',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_26423',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Käkisalmen mlk',
+    lat: '61.048316',
+    long: '29.99702',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_26573',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Rautu',
+    lat: '60.527514',
+    long: '30.270254',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_27354',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Räisälä',
+    lat: '60.940371',
+    long: '29.738772',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_18419',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Suojärvi',
+    lat: '62.113113',
+    long: '32.410906',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_25949',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Valkjärvi',
+    lat: '60.518527',
+    long: '29.723975',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_29974',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Viipurin mlk',
+    lat: '60.594928',
+    long: '28.883801',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_30290',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Viipurin mlk',
+    lat: '60.708614',
+    long: '28.568478',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_19637',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Viipurin mlk',
+    lat: '60.863643',
+    long: '28.819216',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_19068',
+    label: 'Kivelä',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Vuoksenranta',
+    lat: '60.796359',
+    long: '29.574668',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_38361',
+    label: 'Kivenjoki',
+    typeLabel: 'Vesimuodostuma',
+    broaderAreaLabel: 'Sortavalan mlk',
+    lat: '61.69327',
+    long: '30.563798',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_13448',
+    label: 'Kivenjuuri',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Kurkijoki',
+    lat: '61.407188',
+    long: '29.847207',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_28671',
+    label: 'Kivenkaivanto',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Lumivaara',
+    lat: '61.416124',
+    long: '30.184251',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_30183',
+    label: 'Kivenkolkka',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Metsäpirtti',
+    lat: '60.589715',
+    long: '30.489737',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_26220',
+    label: 'Kivenkorva',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Kesälahti',
+    lat: '61.829013',
+    long: '29.939999',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_14191',
+    label: 'Kivenkorva',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Antrea',
+    lat: '60.875455',
+    long: '29.205412',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_30481',
+    label: 'Kivenkulma',
+    typeLabel: 'Rakennettu kohde',
+    broaderAreaLabel: 'Sortavalan mlk',
+    lat: '61.710203',
+    long: '30.772071',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_38957',
+    label: 'Kivenkulmankoski',
+    typeLabel: 'Vesimuodostuma',
+    broaderAreaLabel: 'Salmi',
+    lat: '61.550062',
+    long: '31.633363',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_14',
+    label: 'Kivennapa',
+    typeLabel: 'Kirkonkylä , kaupunki',
+    broaderAreaLabel: 'Kivennapa',
+    lat: '60.348002',
+    long: '29.72542',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_9242',
+    label: 'Kivennavanmäki',
+    typeLabel: 'Maastokohde',
+    broaderAreaLabel: 'Impilahti',
+    lat: '61.623947',
+    long: '31.448691',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/karelian_places/k_place_10136',
+    label: 'Kivennavansaari',
+    typeLabel: 'Maastokohde',
+    broaderAreaLabel: 'Äyräpää',
+    lat: '60.741968',
+    long: '29.428721',
+    source: 'KMN' },
+  { s: 'http://ldf.fi/warsa/places/municipalities/m_place_568',
+    label: 'Kivennapa',
+    typeLabel: 'Kunta',
+    broaderAreaLabel: 'Viipurin lääni',
+    lat: '60.365334',
+    long: '29.820196',
+    source: 'FWM' } ]
 };
 
 const search = (state = INITIAL_STATE, action) => {
@@ -29,7 +231,7 @@ const search = (state = INITIAL_STATE, action) => {
     case UPDATE_RESULTS:
       return {
         ...state,
-        suggestions: [], 
+        suggestions: [],
         results: results(state.results, action)
 
       };