Create a post or comment using callbacks

Create a post or comment using callbacks in Bitsocial React Hooks. Usage, options, and examples.

const onChallenge = async (challenge, comment) => {
  let challengeAnswers
  try {
    // ask the user to complete the challenges in a modal window
    challengeAnswers = await getChallengeAnswersFromUser(challenge.challenges)
  }
  catch (e) {
    // the modal rejects when the user declines
    await abandonPublish()
    return
  }
  if (challengeAnswers) {
    await comment.publishChallengeAnswers(challengeAnswers)
  }
}

const onChallengeVerification = (challengeVerification, comment) => {
  // A failed verification with a reason or nonempty challengeErrors is terminal.
  // Other failures retry automatically only if a challenge was received.
  // Call abandonPublish() when the user cancels the challenge flow.
  if (challengeVerification.challengeSuccess === true) {
    console.log('challenge success', {publishedCid: challengeVerification.commentUpdate?.cid})
  }
  else if (challengeVerification.challengeSuccess === false) {
    console.error('challenge failed', {reason: challengeVerification.reason, challengeErrors: challengeVerification.challengeErrors})
  }
}

const onError = (error, comment) => console.error(error)

const onPendingComment = (accountCommentIndex, pendingComment) => {
  // render or navigate to the pending comment immediately, before local persistence finishes
  // this runs again with the corrected index if another local deletion shifts the comment while saving
  history.push(`/profile/c/${accountCommentIndex}`, {pendingComment})
}

const publishCommentOptions = {
  content: 'hello',
  title: 'hello',
  communityAddress: '12D3KooW...',
  // partial author overrides keep the active account's author identity
  author: {displayName: 'Alice'},
  onPendingComment,
  onChallenge,
  onChallengeVerification,
  onError
}

const {index, state, publishComment, abandonPublish} = usePublishComment(publishCommentOptions)

// create post
await publishComment()
// pending comment index
console.log(index)
// pending comment state
console.log(state)

// onPendingComment is called as soon as the provisional comment and index exist,
// and again with a corrected index if another local deletion shifts it while saving.
// Use it to immediately redirect the user to a page displaying the comment
// with a "pending" label. The index result is also defined after the pending
// comment has been stored locally.
if (index !== undefined) {
  // on the "pending" comment page, you can get the pending comment by doing
  // const accountComment = useAccountComment({commentIndex: index})
  // after accountComment.cid gets defined, it means the comment was published successfully
  // it is recommended to immediately redirect to `/p/${accountComment.communityAddress}/c/${useAccountComment.cid}`
}

// if the user closes the challenge modal and wants to cancel publishing:
await abandonPublish()
// the pending local account comment is removed from accountComments
// this works even if called immediately from onChallenge before publishComment() resolves

// reply to a post or comment
const publishReplyOptions = {
  content: 'hello',
  parentCid: 'Qm...', // the cid of the comment to reply to
  communityAddress: '12D3KooW...',
  onChallenge,
  onChallengeVerification,
  onError
}
const {publishComment} = usePublishComment(publishReplyOptions)
await publishComment()

// when displaying replies, it is recommended to include the user's pending replies
// See "Get replies to a post (nested or flat)" below for both layouts.