department-of-veterans-affairs/vets-website

View on GitHub
src/applications/representative-search/components/results/MapLink.jsx

Summary

Maintainability
A
1 hr
Test Coverage
import React from 'react';
import PropTypes from 'prop-types';

const MapLink = props => {
  const { name, address, city, state, postalCode } = props;
  const locationInputString = `${name} ${
    address ? `${address} ` : ''
  }${city}, ${state} ${postalCode}`;

  const googleMapsUrl = `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent(
    `${locationInputString}`,
  )}`;

  return (
    <a href={googleMapsUrl} target="_blank" rel="noopener noreferrer">
      Get directions on Google Maps
    </a>
  );
};

MapLink.propTypes = {
  city: PropTypes.string.isRequired,
  name: PropTypes.string.isRequired,
  postalCode: PropTypes.string.isRequired,
  state: PropTypes.string.isRequired,
  address: PropTypes.string,
};

export default MapLink;