// Sorry about the name
import React from "react";
import { TrackingLinkView } from "./tracking-link-types";
import { toQueryString } from "./utils";

interface TrackingLinkLink {
  view: TrackingLinkView;
  id?: number;
  goToView: (view: TrackingLinkView, id?: string) => void;
}

const TrackingLinkLink: React.SFC<TrackingLinkLink> = props => {
  let id;

  const { view, goToView } = props;

  if (props.id) {
    id = props.id.toString();
  }

  const query = {
    id,
    view
  };
  const path = `${location.pathname}?${toQueryString(query)}`;
  const handleClick = evt => {
    evt.preventDefault();

    goToView(view, id);
  };

  return (
    <a href={path} onClick={handleClick}>
      {props.children}
    </a>
  );
};

export default TrackingLinkLink;