@wordpress/block-library
Version:
Block library for the WordPress editor.
112 lines (111 loc) • 4.7 kB
JavaScript
// packages/block-library/src/comments/edit/placeholder.js
import { store as blockEditorStore } from "@wordpress/block-editor";
import { __, sprintf } from "@wordpress/i18n";
import { useSelect } from "@wordpress/data";
import { useEntityProp } from "@wordpress/core-data";
import { createInterpolateElement } from "@wordpress/element";
import CommentsForm from "../../post-comments-form/form";
import { jsx, jsxs } from "react/jsx-runtime";
function PostCommentsPlaceholder({ postType, postId }) {
let [postTitle] = useEntityProp("postType", postType, "title", postId);
postTitle = postTitle || __("Post Title");
const { avatarURL } = useSelect(
(select) => select(blockEditorStore).getSettings().__experimentalDiscussionSettings
);
return /* @__PURE__ */ jsxs("div", { className: "wp-block-comments__legacy-placeholder", inert: "true", children: [
/* @__PURE__ */ jsx("h3", {
/* translators: %s: Post title. */
children: sprintf(__("One response to %s"), postTitle)
}),
/* @__PURE__ */ jsxs("div", { className: "navigation", children: [
/* @__PURE__ */ jsx("div", { className: "alignleft", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
"\xAB ",
__("Older Comments")
] }) }),
/* @__PURE__ */ jsx("div", { className: "alignright", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
__("Newer Comments"),
" \xBB"
] }) })
] }),
/* @__PURE__ */ jsx("ol", { className: "commentlist", children: /* @__PURE__ */ jsx("li", { className: "comment even thread-even depth-1", children: /* @__PURE__ */ jsxs("article", { className: "comment-body", children: [
/* @__PURE__ */ jsxs("footer", { className: "comment-meta", children: [
/* @__PURE__ */ jsxs("div", { className: "comment-author vcard", children: [
/* @__PURE__ */ jsx(
"img",
{
alt: __("Commenter Avatar"),
src: avatarURL,
className: "avatar avatar-32 photo",
height: "32",
width: "32",
loading: "lazy"
}
),
/* @__PURE__ */ jsx("b", { className: "fn", children: /* @__PURE__ */ jsx("a", { href: "#top", className: "url", children: __("A WordPress Commenter") }) }),
" ",
/* @__PURE__ */ jsxs("span", { className: "says", children: [
__("says"),
":"
] })
] }),
/* @__PURE__ */ jsxs("div", { className: "comment-metadata", children: [
/* @__PURE__ */ jsx("a", { href: "#top", children: /* @__PURE__ */ jsx("time", { dateTime: "2000-01-01T00:00:00+00:00", children: __("January 1, 2000 at 00:00 am") }) }),
" ",
/* @__PURE__ */ jsx("span", { className: "edit-link", children: /* @__PURE__ */ jsx(
"a",
{
className: "comment-edit-link",
href: "#top",
children: __("Edit")
}
) })
] })
] }),
/* @__PURE__ */ jsx("div", { className: "comment-content", children: /* @__PURE__ */ jsxs("p", { children: [
__("Hi, this is a comment."),
/* @__PURE__ */ jsx("br", {}),
__(
"To get started with moderating, editing, and deleting comments, please visit the Comments screen in the dashboard."
),
/* @__PURE__ */ jsx("br", {}),
createInterpolateElement(
__(
"Commenter avatars come from <a>Gravatar</a>."
),
{
a: (
// eslint-disable-next-line jsx-a11y/anchor-has-content
/* @__PURE__ */ jsx("a", { href: "https://gravatar.com/" })
)
}
)
] }) }),
/* @__PURE__ */ jsx("div", { className: "reply", children: /* @__PURE__ */ jsx(
"a",
{
className: "comment-reply-link",
href: "#top",
"aria-label": __(
"Reply to A WordPress Commenter"
),
children: __("Reply")
}
) })
] }) }) }),
/* @__PURE__ */ jsxs("div", { className: "navigation", children: [
/* @__PURE__ */ jsx("div", { className: "alignleft", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
"\xAB ",
__("Older Comments")
] }) }),
/* @__PURE__ */ jsx("div", { className: "alignright", children: /* @__PURE__ */ jsxs("a", { href: "#top", children: [
__("Newer Comments"),
" \xBB"
] }) })
] }),
/* @__PURE__ */ jsx(CommentsForm, { postId, postType })
] });
}
export {
PostCommentsPlaceholder as default
};
//# sourceMappingURL=placeholder.js.map