Use replies

Fetch and paginate replies for a specific comment

Overview

useReplies loads replies for a specific comment from the entityCommentsTree managed by the nearest CommentSectionProvider. It fetches a page of replies when the page state increases above 0.

Must be used inside a CommentSectionProvider. Replies are merged into the shared entityCommentsTree.

Usage Example

import { useReplies } from "@sublay/react-js";

function CommentItem({ commentId }: { commentId: string }) {
  const { replies, newReplies, loading, setPage } = useReplies({
    commentId,
    sortBy: "createdAt",
  });

  return (
    <div>
      <button onClick={() => setPage((p) => p + 1)}>Load replies</button>
      {[...newReplies, ...replies].map((r) => (
        <div key={r.id}>{r.content}</div>
      ))}
    </div>
  );
}

Props

commentId · string · required

The ID of the comment to load replies for.

sortBy · CommentsSortByOptions · required

Sort order for replies: "createdAt" or "top". "new"/"old" are deprecated aliases for "createdAt" (removed in v8).

sortDir · "asc" | "desc"

Sort direction for sortBy: "createdAt". Default: "desc" (newest first).

Return Values

replies · (Comment & { new: boolean })[]

Paginated replies (not newly submitted in this session).

newReplies · (Comment & { new: boolean })[]

Replies submitted in this session, sorted newest-first.

loading · boolean

true while replies are being fetched.

page · number

Current page number. Starts at 0 (no replies loaded). Increment to load replies.

setPage · Dispatch<SetStateAction<number>>

Increment to trigger loading the next page of replies.