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

Enhanced block editor for WordPress posts.

/**
 * WordPress dependencies
 */
import { PanelBody, Button, TextControl } from '@wordpress/components';
import { __, sprintf } from '@wordpress/i18n';
import { useCallback, useEffect, useState, useRef } from '@wordpress/element';
import { useSelect } from '@wordpress/data';
import { addQueryArgs, safeDecodeURIComponent } from '@wordpress/url';
import { decodeEntities } from '@wordpress/html-entities';
import { useCopyToClipboard } from '@wordpress/compose';
import { store as coreStore } from '@wordpress/core-data';

/**
 * Internal dependencies
 */
import PostScheduleLabel from '../post-schedule/label';
import { store as editorStore } from '../../store';
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
const POSTNAME = '%postname%';
const PAGENAME = '%pagename%';

/**
 * 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);
  }
  if (post.permalink_template.includes(PAGENAME)) {
    return post.permalink_template.replace(PAGENAME, slug);
  }
  return post.permalink_template;
};
function CopyButton({
  text
}) {
  const [showCopyConfirmation, setShowCopyConfirmation] = useState(false);
  const timeoutIdRef = useRef();
  const ref = useCopyToClipboard(text, () => {
    setShowCopyConfirmation(true);
    if (timeoutIdRef.current) {
      clearTimeout(timeoutIdRef.current);
    }
    timeoutIdRef.current = setTimeout(() => {
      setShowCopyConfirmation(false);
    }, 4000);
  });
  useEffect(() => {
    return () => {
      if (timeoutIdRef.current) {
        clearTimeout(timeoutIdRef.current);
      }
    };
  }, []);
  return /*#__PURE__*/_jsx(Button, {
    __next40pxDefaultSize: true,
    variant: "secondary",
    ref: ref,
    children: showCopyConfirmation ? __('Copied!') : __('Copy')
  });
}
export default function PostPublishPanelPostpublish({
  focusOnMount,
  children
}) {
  const {
    post,
    postType,
    isScheduled
  } = useSelect(select => {
    const {
      getEditedPostAttribute,
      getCurrentPost,
      isCurrentPostScheduled
    } = select(editorStore);
    const {
      getPostType
    } = select(coreStore);
    return {
      post: getCurrentPost(),
      postType: getPostType(getEditedPostAttribute('type')),
      isScheduled: isCurrentPostScheduled()
    };
  }, []);
  const postLabel = postType?.labels?.singular_name;
  const viewPostLabel = postType?.labels?.view_item;
  const addNewPostLabel = postType?.labels?.add_new_item;
  const link = post.status === 'future' ? getFuturePostUrl(post) : post.link;
  const addLink = addQueryArgs('post-new.php', {
    post_type: post.type
  });
  const postLinkRef = useCallback(node => {
    if (focusOnMount && node) {
      node.focus();
    }
  }, [focusOnMount]);
  const postPublishNonLinkHeader = isScheduled ? /*#__PURE__*/_jsxs(_Fragment, {
    children: [__('is now scheduled. It will go live on'), ' ', /*#__PURE__*/_jsx(PostScheduleLabel, {}), "."]
  }) : __('is now live.');
  return /*#__PURE__*/_jsxs("div", {
    className: "post-publish-panel__postpublish",
    children: [/*#__PURE__*/_jsxs(PanelBody, {
      className: "post-publish-panel__postpublish-header",
      children: [/*#__PURE__*/_jsx("a", {
        ref: postLinkRef,
        href: link,
        children: decodeEntities(post.title) || __('(no title)')
      }), ' ', postPublishNonLinkHeader]
    }), /*#__PURE__*/_jsxs(PanelBody, {
      children: [/*#__PURE__*/_jsx("p", {
        className: "post-publish-panel__postpublish-subheader",
        children: /*#__PURE__*/_jsx("strong", {
          children: __('What’s next?')
        })
      }), /*#__PURE__*/_jsxs("div", {
        className: "post-publish-panel__postpublish-post-address-container",
        children: [/*#__PURE__*/_jsx(TextControl, {
          __next40pxDefaultSize: true,
          __nextHasNoMarginBottom: true,
          className: "post-publish-panel__postpublish-post-address",
          readOnly: true,
          label: sprintf(/* translators: %s: post type singular name */
          __('%s address'), postLabel),
          value: safeDecodeURIComponent(link),
          onFocus: event => event.target.select()
        }), /*#__PURE__*/_jsx("div", {
          className: "post-publish-panel__postpublish-post-address__copy-button-wrap",
          children: /*#__PURE__*/_jsx(CopyButton, {
            text: link
          })
        })]
      }), /*#__PURE__*/_jsxs("div", {
        className: "post-publish-panel__postpublish-buttons",
        children: [!isScheduled && /*#__PURE__*/_jsx(Button, {
          variant: "primary",
          href: link,
          __next40pxDefaultSize: true,
          children: viewPostLabel
        }), /*#__PURE__*/_jsx(Button, {
          variant: isScheduled ? 'primary' : 'secondary',
          __next40pxDefaultSize: true,
          href: addLink,
          children: addNewPostLabel
        })]
      })]
    }), children]
  });
}
//# sourceMappingURL=postpublish.js.map