import { jsx, jsxs } from "react/jsx-runtime";
import { __ } from "@wordpress/i18n";
import { useSelect } from "@wordpress/data";
import {
  __experimentalHStack as HStack,
  __experimentalVStack as VStack
} from "@wordpress/components";
import {
  store as blockEditorStore,
  privateApis as blockEditorPrivateApis
} from "@wordpress/block-editor";
import { unlock } from "../../lock-unlock";
import CommentAuthorInfo from "./comment-author-info";
import CommentForm from "./comment-form";
import { focusCommentThread } from "./utils";
const { useBlockElement } = unlock(blockEditorPrivateApis);
function AddComment({
  onSubmit,
  showCommentBoard,
  setShowCommentBoard,
  commentSidebarRef
}) {
  const { clientId, blockCommentId } = useSelect((select) => {
    const { getSelectedBlock } = select(blockEditorStore);
    const selectedBlock = getSelectedBlock();
    return {
      clientId: selectedBlock?.clientId,
      blockCommentId: selectedBlock?.attributes?.metadata?.noteId
    };
  }, []);
  const blockElement = useBlockElement(clientId);
  if (!showCommentBoard || !clientId || void 0 !== blockCommentId) {
    return null;
  }
  return /* @__PURE__ */ jsxs(
    VStack,
    {
      className: "editor-collab-sidebar-panel__thread is-selected",
      spacing: "3",
      tabIndex: 0,
      role: "listitem",
      children: [
        /* @__PURE__ */ jsx(HStack, { alignment: "left", spacing: "3", children: /* @__PURE__ */ jsx(CommentAuthorInfo, {}) }),
        /* @__PURE__ */ jsx(
          CommentForm,
          {
            onSubmit: async (inputComment) => {
              const { id } = await onSubmit({ content: inputComment });
              focusCommentThread(id, commentSidebarRef.current);
              setShowCommentBoard(false);
            },
            onCancel: () => {
              setShowCommentBoard(false);
              blockElement?.focus();
            },
            submitButtonText: __("Add note"),
            labelText: __("New Note")
          }
        )
      ]
    }
  );
}
export {
  AddComment
};
//# sourceMappingURL=add-comment.js.map
