/**
 * Link View.
 * @module components/theme/View/LinkView
 */

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { isInternalURL, flattenToAppURL } from '@plone/volto/helpers/Url/Url';
import { Container as SemanticContainer } from 'semantic-ui-react';
import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
import { Redirect } from 'react-router-dom';
import { FormattedMessage } from 'react-intl';
import config from '@plone/volto/registry';

/**
 * View container class.
 * @class View
 * @extends Component
 */
class LinkView extends Component {
  /**
   * Property types.
   * @property {Object} propTypes Property types.
   * @static
   */
  static propTypes = {
    content: PropTypes.shape({
      title: PropTypes.string,
      description: PropTypes.string,
      remoteUrl: PropTypes.string,
    }),
    token: PropTypes.string,
  };

  /**
   * Default properties.
   * @property {Object} defaultProps Default properties.
   * @static
   */
  static defaultProps = {
    content: null,
    token: null, //betterleaks:allow
  };

  componentDidMount() {
    if (!this.props.token) {
      let { remoteUrl } = this.props.content;
      // eslint-disable-next-line
      remoteUrl = remoteUrl.replaceAll('${portal_url}', '');

      if (isInternalURL(remoteUrl)) {
        this.props.history.replace(flattenToAppURL(remoteUrl));
      } else if (!__SERVER__) {
        window.location.href = flattenToAppURL(remoteUrl);
      }
    }
  }

  /**
   * Render method.
   * @method render
   * @returns {string} Markup for the component.
   */
  render() {
    let { remoteUrl } = this.props.content;
    // eslint-disable-next-line
    remoteUrl = flattenToAppURL(remoteUrl.replaceAll('${portal_url}', ''));

    if (__SERVER__ && !this.props.token && remoteUrl) {
      return <Redirect to={remoteUrl} />;
    }
    const { openExternalLinkInNewTab } = config.settings;
    const Container =
      config.getComponent({ name: 'Container' }).component || SemanticContainer;

    return (
      <Container id="page-document">
        <h1 className="documentFirstHeading">{this.props.content.title}</h1>
        {this.props.content.description && (
          <p className="documentDescription">
            {this.props.content.description}
          </p>
        )}
        {remoteUrl && (
          <p>
            <FormattedMessage
              id="The link address is:"
              defaultMessage="The link address is:"
            />{' '}
            <UniversalLink
              href={remoteUrl}
              openLinkInNewTab={
                openExternalLinkInNewTab && !isInternalURL(remoteUrl)
              }
            >
              {flattenToAppURL(remoteUrl)}
            </UniversalLink>
          </p>
        )}
      </Container>
    );
  }
}

export default LinkView;