<commit_before>import React, { Component } from 'react';
import { Link, navigate } from '@reach/router';
import classNames from 'classnames';
import _ from 'lodash';
import queryString from 'query-string';
import timeago from 'timeago.js';

// Local
import api from '@toiletmap/api-client';
import { createStyled } from '../lib/utils.js';
import LooTable from './table/LooTable';
import LooTablePaginationActions from './table/LooTablePaginationActions';
import SearchAutocomplete from './SearchAutocomplete';

// MUI Core
import RaisedButton from '@material-ui/core/Button';
import ExpansionPanel from '@material-ui/core/ExpansionPanel';
import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails';
import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary';
import FormControl from '@material-ui/core/FormControl';
import Grid from '@material-ui/core/Grid';
import Chip from '@material-ui/core/Chip';
import Input from '@material-ui/core/Input';
import InputLabel from '@material-ui/core/InputLabel';
import MenuItem from '@material-ui/core/MenuItem';
import Select from '@material-ui/core/Select';
import { withStyles } from '@material-ui/core/styles';
import TableCell from '@material-ui/core/TableCell';
import Avatar from '@material-ui/core/Avatar';
import TablePagination from '@material-ui/core/TablePagination';
import TableRow from '@material-ui/core/TableRow';
import TextField from '@material-ui/core/TextField';
import Typography from '@material-ui/core/Typography';

// MUI Icons
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import SearchIcon from '@material-ui/icons/Search';
import PeopleIcon from '@material-ui/icons/People';
import NameIcon from '@material-ui/icons/TextFields';
import CityIcon from '@material-ui/icons/LocationCity';
import ClockIcon from '@material-ui/icons/AccessTime';

const styles = theme => ({
  gridRoot: {
    display: 'flex',
    flexWrap: 'wrap',
    justifyContent: 'space-around',
    overflow: 'hidden',
  },
  gridList: {
    width: '100%',
    height: 500,
  },
  card: {
    margin: '1em',
  },
  input: {
    minWidth: '10em',
  },
  buttons: {
    display: 'flex',
    justifyContent: 'flex-end',
  },
  heading: {
    fontSize: theme.typography.pxToRem(15),
    fontWeight: theme.typography.fontWeightRegular,
  },
  searchForm: {
    marginTop: theme.spacing.unit * 3,
    marginBottom: theme.spacing.unit * 3,
    padding: theme.spacing.unit * 2,
    [theme.breakpoints.up(600 + theme.spacing.unit * 3 * 2)]: {
      marginTop: theme.spacing.unit * 6,
      marginBottom: theme.spacing.unit * 6,
      padding: theme.spacing.unit * 3,
    },
  },
  button: {
    marginTop: theme.spacing.unit * 3,
    marginLeft: theme.spacing.unit,
  },
});

const Styled = createStyled(theme => ({
  textList: {
    whiteSpace: 'pre-line',
  },
  row: {
    '&:nth-of-type(odd)': {
      backgroundColor: theme.palette.background.default,
    },
    height: '5em',
  },
  link: {
    textDecoration: 'none',
  },
  chip: {
    marginTop: theme.spacing.unit * 0.2,
    marginBottom: theme.spacing.unit * 0.2,
    marginLeft: theme.spacing.unit * 0.2,
  },
  chipDetail: {
    verticalAlign: 'bottom',
    marginTop: theme.spacing.unit * 0.2,
    marginBottom: theme.spacing.unit * 0.2,
    marginLeft: theme.spacing.unit * 0.2,
  },
}));

const renderTableRows = props => {
  const MISSING_MESSAGE = 'Not Recorded';
  const { data } = props;
  return (
    <Styled>
      {({ classes }) => (
        <>
          {data.docs.map(loo => {
            const { contributors } = loo;
            const { name, type, opening, area } = loo.properties;
            return (
              <React.Fragment key={loo._id}>
                <TableRow className={classes.row}>
                  <TableCell component="th" scope="row">
                    <Link className={classes.link} to={`../loos/${loo._id}`}>
                      <Chip
                        avatar={
                          <Avatar>
                            <NameIcon />
                          </Avatar>
                        }
                        className={classes.chip}
                        label={name || MISSING_MESSAGE}
                        color={name ? 'primary' : 'secondary'}
                        variant="default"
                        clickable
                      />
                    </Link>
                  </TableCell>
                  <TableCell>
                    {area.map(val => {
                      return (
                        <React.Fragment key={val.name}>
                          <Chip
                            className={classes.chip}
                            avatar={
                              <Avatar>
                                <CityIcon />
                              </Avatar>
                            }
                            label={val.name}
                            color={val.name ? 'primary' : 'secondary'}
                            variant="default"
                            onClick={e => {
                              navigate(`search?area_name=${val.name}`);
                            }}
                            clickable
                          />
                          <Chip
                            className={classes.chipDetail}
                            label={val.type}
                            color={val.type ? 'primary' : 'secondary'}
                            variant="outlined"
                          />
                        </React.Fragment>
                      );
                    })}
                  </TableCell>
                  <TableCell>
                    <Chip
                      className={classes.chip}
                      avatar={
                        <Avatar>
                          <PeopleIcon />
                        </Avatar>
                      }
                      label={type || MISSING_MESSAGE}
                      color={type ? 'primary' : 'secondary'}
                      variant="default"
                      clickable
                    />
                  </TableCell>
                  <TableCell className={classes.textList}>
                    {contributors.map((attr, i) => {
                      return (
                        <Chip
                          key={attr + i}
                          className={classes.chip}
                          avatar={<commit_msg>fix: show unique contributors in search results<commit_after>import React, { Component } from 'react';
import { Link, navigate } from '@reach/router';
import classNames from 'classnames';
import _ from 'lodash';
import queryString from 'query-string';
import timeago from 'timeago.js';

// Local
import api from '@toiletmap/api-client';
import { createStyled } from '../lib/utils.js';
import LooTable from './table/LooTable';
import LooTablePaginationActions from './table/LooTablePaginationActions';
import SearchAutocomplete from './SearchAutocomplete';

// MUI Core
import RaisedButton from '@material-ui/core/Button';
import ExpansionPanel from '@material-ui/core/ExpansionPanel';
import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails';
import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary';
import FormControl from '@material-ui/core/FormControl';
import Grid from '@material-ui/core/Grid';
import Chip from '@material-ui/core/Chip';
import Input from '@material-ui/core/Input';
import InputLabel from '@material-ui/core/InputLabel';
import MenuItem from '@material-ui/core/MenuItem';
import Select from '@material-ui/core/Select';
import { withStyles } from '@material-ui/core/styles';
import TableCell from '@material-ui/core/TableCell';
import Avatar from '@material-ui/core/Avatar';
import TablePagination from '@material-ui/core/TablePagination';
import TableRow from '@material-ui/core/TableRow';
import TextField from '@material-ui/core/TextField';
import Typography from '@material-ui/core/Typography';

// MUI Icons
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import SearchIcon from '@material-ui/icons/Search';
import PeopleIcon from '@material-ui/icons/People';
import NameIcon from '@material-ui/icons/TextFields';
import CityIcon from '@material-ui/icons/LocationCity';
import ClockIcon from '@material-ui/icons/AccessTime';

const styles = theme => ({
  gridRoot: {
    display: 'flex',
    flexWrap: 'wrap',
    justifyContent: 'space-around',
    overflow: 'hidden',
  },
  gridList: {
    width: '100%',
    height: 500,
  },
  card: {
    margin: '1em',
  },
  input: {
    minWidth: '10em',
  },
  buttons: {
    display: 'flex',
    justifyContent: 'flex-end',
  },
  heading: {
    fontSize: theme.typography.pxToRem(15),
    fontWeight: theme.typography.fontWeightRegular,
  },
  searchForm: {
    marginTop: theme.spacing.unit * 3,
    marginBottom: theme.spacing.unit * 3,
    padding: theme.spacing.unit * 2,
    [theme.breakpoints.up(600 + theme.spacing.unit * 3 * 2)]: {
      marginTop: theme.spacing.unit * 6,
      marginBottom: theme.spacing.unit * 6,
      padding: theme.spacing.unit * 3,
    },
  },
  button: {
    marginTop: theme.spacing.unit * 3,
    marginLeft: theme.spacing.unit,
  },
});

const Styled = createStyled(theme => ({
  textList: {
    whiteSpace: 'pre-line',
  },
  row: {
    '&:nth-of-type(odd)': {
      backgroundColor: theme.palette.background.default,
    },
    height: '5em',
  },
  link: {
    textDecoration: 'none',
  },
  chip: {
    marginTop: theme.spacing.unit * 0.2,
    marginBottom: theme.spacing.unit * 0.2,
    marginLeft: theme.spacing.unit * 0.2,
  },
  chipDetail: {
    verticalAlign: 'bottom',
    marginTop: theme.spacing.unit * 0.2,
    marginBottom: theme.spacing.unit * 0.2,
    marginLeft: theme.spacing.unit * 0.2,
  },
}));

const renderTableRows = props => {
  const MISSING_MESSAGE = 'Not Recorded';
  const { data } = props;
  return (
    <Styled>
      {({ classes }) => (
        <>
          {data.docs.map(loo => {
            const { contributors } = loo;
            const { name, type, opening, area } = loo.properties;
            return (
              <React.Fragment key={loo._id}>
                <TableRow className={classes.row}>
                  <TableCell component="th" scope="row">
                    <Link className={classes.link} to={`../loos/${loo._id}`}>
                      <Chip
                        avatar={
                          <Avatar>
                            <NameIcon />
                          </Avatar>
                        }
                        className={classes.chip}
                        label={name || MISSING_MESSAGE}
                        color={name ? 'primary' : 'secondary'}
                        variant="default"
                        clickable
                      />
                    </Link>
                  </TableCell>
                  <TableCell>
                    {area.map(val => {
                      return (
                        <React.Fragment key={val.name}>
                          <Chip
                            className={classes.chip}
                            avatar={
                              <Avatar>
                                <CityIcon />
                              </Avatar>
                            }
                            label={val.name}
                            color={val.name ? 'primary' : 'secondary'}
                            variant="default"
                            onClick={e => {
                              navigate(`search?area_name=${val.name}`);
                            }}
                            clickable
                          />
                          <Chip
                            className={classes.chipDetail}
                            label={val.type}
                            color={val.type ? 'primary' : 'secondary'}
                            variant="outlined"
                          />
                        </React.Fragment>
                      );
                    })}
                  </TableCell>
                  <TableCell>
                    <Chip
                      className={classes.chip}
                      avatar={
                        <Avatar>
                          <PeopleIcon />
                        </Avatar>
                      }
                      label={type || MISSING_MESSAGE}
                      color={type ? 'primary' : 'secondary'}
                      variant="default"
                      clickable
                    />
                  </TableCell>
                  <TableCell className={classes.textList}>
                    {_.uniq(contributors).map((attr, i) => {
                      return (
                        <Chip
                          key={attr + i}
                          className={classes.chip}
                          avatar={
{'fraction_non_alphanumeric': 0.12140426848128673, 'fraction_numerical': 0.005567584287039901, 'mean_word_length': 1.5289401642549862, 'pattern_counts': {'":': 0, '<': 61, '<?xml version=': 0, '>': 75, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3422138', 'n_tokens_mistral': 3540, 'n_tokens_neox': 3357, 'n_words': 699}