Function NewCommentComponent

packages/shared/src/components/post/NewComment.tsx:71–223

(
  {
    className,
    size = ProfileImageSize.Large,
    onCommented,
    post,
    shouldHandleCommentQuery = false,
    CommentInput,
    onComposerOpenChange,
    renderTrigger,
    ...props
  }: NewCommentProps,
  ref: ForwardedRef<NewCommentRef>,
)

}

function NewCommentComponent(
  {
    className,
    size = ProfileImageSize.Large,
    onCommented,
    post,
    shouldHandleCommentQuery = false,
    CommentInput,
    onComposerOpenChange,
    renderTrigger,
    ...props
  }: NewCommentProps,
  ref: ForwardedRef<NewCommentRef>,
): ReactElement {
  const router = useRouter();
  const { logEvent } = useLogContext();
  const { logOpts } = useActiveFeedContext();
  const { user, showLogin } = useAuthContext();
  const inputId = `comment-input-${useId()}`;
  const [inputContent, setInputContent] = useState<string | undefined>(
    undefined,
  );

  const onSuccess: typeof onCommented = (comment, isNew) => {
    setInputContent(undefined);
    onCommented?.(comment, isNew);
  };

  const onShowComment = useCallback(
    (origin: Origin, content = '') => {
      logEvent(
        postLogEvent(LogEvent.OpenComment, post, {
          extra: { origin },
          ...(logOpts && logOpts),
        }),
      );

      setInputContent(content);
    },
    [post, logEvent, setInputContent, logOpts],
  );

  const hasCommentQuery = typeof router.query.comment === 'string';
  const isComposerOpen = typeof inputContent !== 'undefined';

  useEffect(() => {
    onComposerOpenChange?.(isComposerOpen);
  }, [isComposerOpen, onComposerOpenChange]);

  useEffect(() => {
    if (
      !shouldHandleCommentQuery ||
      !hasCommentQuery ||
      (post.type !== PostType.Welcome && post.type !== PostType.Poll)
    ) {
      return;
    }