@wordpress/editor/build-module/components/post-publish-panel/postpublish.js

Enhanced block editor for WordPress posts.

import { createElement, Fragment } from "@wordpress/element";

/**
 * External dependencies
 */
import { get } from 'lodash';
/**
 * WordPress dependencies
 */

import { PanelBody, Button, TextControl } from '@wordpress/components';
import { __, sprintf } from '@wordpress/i18n';
import { Component, createRef } from '@wordpress/element';
import { withSelect } from '@wordpress/data';
import { safeDecodeURIComponent } from '@wordpress/url';
import { decodeEntities } from '@wordpress/html-entities';
import { useCopyToClipboard } from '@wordpress/compose';
/**
 * Internal dependencies
 */

import PostScheduleLabel from '../post-schedule/label';
const POSTNAME = '%postname%';
/**
 * Returns URL for a future post.
 *
 * @param {Object} post         Post object.
 *
 * @return {string} PostPublish URL.
 */

const getFuturePostUrl = post => {
  const {
    slug
  } = post;

  if (post.permalink_template.includes(POSTNAME)) {
    return post.permalink_template.replace(POSTNAME, slug);
  }

  return post.permalink_template;
};

function CopyButton({
  text,
  onCopy,
  children
}) {
  const ref = useCopyToClipboard(text, onCopy);
  return createElement(Button, {
    isSecondary: true,
    ref: ref
  }, children);
}

class PostPublishPanelPostpublish extends Component {
  constructor() {
    super(...arguments);
    this.state = {
      showCopyConfirmation: false
    };
    this.onCopy = this.onCopy.bind(this);
    this.onSelectInput = this.onSelectInput.bind(this);
    this.postLink = createRef();
  }

  componentDidMount() {
    if (this.props.focusOnMount) {
      this.postLink.current.focus();
    }
  }

  componentWillUnmount() {
    clearTimeout(this.dismissCopyConfirmation);
  }

  onCopy() {
    this.setState({
      showCopyConfirmation: true
    });
    clearTimeout(this.dismissCopyConfirmation);
    this.dismissCopyConfirmation = setTimeout(() => {
      this.setState({
        showCopyConfirmation: false
      });
    }, 4000);
  }

  onSelectInput(event) {
    event.target.select();
  }

  render() {
    const {
      children,
      isScheduled,
      post,
      postType
    } = this.props;
    const postLabel = get(postType, ['labels', 'singular_name']);
    const viewPostLabel = get(postType, ['labels', 'view_item']);
    const link = post.status === 'future' ? getFuturePostUrl(post) : post.link;
    const postPublishNonLinkHeader = isScheduled ? createElement(Fragment, null, __('is now scheduled. It will go live on'), ' ', createElement(PostScheduleLabel, null), ".") : __('is now live.');
    return createElement("div", {
      className: "post-publish-panel__postpublish"
    }, createElement(PanelBody, {
      className: "post-publish-panel__postpublish-header"
    }, createElement("a", {
      ref: this.postLink,
      href: link
    }, decodeEntities(post.title) || __('(no title)')), ' ', postPublishNonLinkHeader), createElement(PanelBody, null, createElement("p", {
      className: "post-publish-panel__postpublish-subheader"
    }, createElement("strong", null, __('What’s next?'))), createElement(TextControl, {
      className: "post-publish-panel__postpublish-post-address",
      readOnly: true,
      label: sprintf(
      /* translators: %s: post type singular name */
      __('%s address'), postLabel),
      value: safeDecodeURIComponent(link),
      onFocus: this.onSelectInput
    }), createElement("div", {
      className: "post-publish-panel__postpublish-buttons"
    }, !isScheduled && createElement(Button, {
      isSecondary: true,
      href: link
    }, viewPostLabel), createElement(CopyButton, {
      text: link,
      onCopy: this.onCopy
    }, this.state.showCopyConfirmation ? __('Copied!') : __('Copy Link')))), children);
  }

}

export default withSelect(select => {
  const {
    getEditedPostAttribute,
    getCurrentPost,
    isCurrentPostScheduled
  } = select('core/editor');
  const {
    getPostType
  } = select('core');
  return {
    post: getCurrentPost(),
    postType: getPostType(getEditedPostAttribute('type')),
    isScheduled: isCurrentPostScheduled()
  };
})(PostPublishPanelPostpublish);
//# sourceMappingURL=postpublish.js.map