import React from 'react';
import Delete from 'material-ui/svg-icons/action/delete';
import Create from 'material-ui/svg-icons/content/create';
import Call from 'material-ui/svg-icons/communication/call';
import TextSms from 'material-ui/svg-icons/communication/textsms';
import Mail from 'material-ui/svg-icons/content/mail';
import IconButton from 'material-ui/IconButton';
import PropTypes from 'prop-types';
import Instance from '../../../components/Connection';

const RoadTripLink = (props) => {
  const onClick = (e, r) => {
    let url = `/v1/nemt/rides/${r.ride_uuid}`;
    if (props.isOpened) {
      url = `/v1/ext/${r.ride_uuid}/${r.user.useruuid}`;
    }

    Instance.getRawConn().get(url).then(res => {
      if (props.onRideClick) {
        props.onRideClick(res.data);
      } else {
        console.log(res.data);
      }
    }).catch(console.error);

    return false;
  }

  let rideList = [];
  if (props.rides) {
    console.log(props.rides)
    rideList = props.rides.map((r, i) => {
      let separator = '|';
      if (props.rides.length === 1 || props.rides.length === i + 1) {
        separator = '';
      }
      if (props.isLink == true) {
        return (<span> <a href={location.href} onTouchTap={(e) => onClick(e, r)}>{r.trip_type.value}</a> {separator}</span>)
      } else {
        return (<span> {r.trip_type.value} {separator}</span>)
      }
    });
  }

  return (
    <div>
      {rideList}
    </div>
  )
}

RoadTripLink.propTypes = {
  visit: PropTypes.object.isRequired,
  rides: PropTypes.array.isRequired,
  currentRide: PropTypes.object,
  isOpened: PropTypes.bool,
  isLink: PropTypes.bool,
  onRideClick: PropTypes.func,
};

RoadTripLink.defaultProps = {
  visit: {},
  rides: [],
  currentRide: {},
  isOpened: false,
  isLink: false,
  onRideClick: (ride) => { console.log(ride); },
};

module.exports = RoadTripLink;