12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758 |
- import {actionCreators as ac, actionTypes as at} from "common/Actions.jsm";
- import React from "react";
- export class SafeAnchor extends React.PureComponent {
- constructor(props) {
- super(props);
- this.onClick = this.onClick.bind(this);
- }
- onClick(event) {
- // Use dispatch instead of normal link click behavior to include referrer
- if (this.props.dispatch) {
- event.preventDefault();
- const {altKey, button, ctrlKey, metaKey, shiftKey} = event;
- this.props.dispatch(ac.OnlyToMain({
- type: at.OPEN_LINK,
- data: {
- event: {altKey, button, ctrlKey, metaKey, shiftKey},
- referrer: "https://getpocket.com/recommendations",
- // Use the anchor's url, which could have been cleaned up
- url: event.currentTarget.href,
- },
- }));
- }
- // Propagate event if there's a handler
- if (this.props.onLinkClick) {
- this.props.onLinkClick(event);
- }
- }
- safeURI(url) {
- let protocol = null;
- try {
- protocol = new URL(url).protocol;
- } catch (e) { return ""; }
- const isAllowed = [
- "http:",
- "https:",
- ].includes(protocol);
- if (!isAllowed) {
- console.warn(`${url} is not allowed for anchor targets.`); // eslint-disable-line no-console
- return "";
- }
- return url;
- }
- render() {
- const {url, className} = this.props;
- return (
- <a href={this.safeURI(url)} className={className} onClick={this.onClick}>
- {this.props.children}
- </a>
- );
- }
- }
|