A helper to ease marking GitHub comments as off-topic

github-comment-off-topic-button.user.js

// ==UserScript==
// @name         A helper to ease marking GitHub comments as off-topic
// @version      0.5
// @description  Helps maintain PRs and commit comments
// @match        https://github.com/*
// @source       https://gist.github.com/dscho/cd85d0a23fad7aa2d21ab0eca84b55b8
// @updateURL    https://gist.github.com/dscho/cd85d0a23fad7aa2d21ab0eca84b55b8/raw/github-comment-off-topic-button.user.js
// @downloadURL  https://gist.github.com/dscho/cd85d0a23fad7aa2d21ab0eca84b55b8/raw/github-comment-off-topic-button.user.js
// @run-at document-end
// @connect api.github.com
// ==/UserScript==

(() => {
  // Add a 'Off Topic' button to all comments
  const handleComment = (comment) => {
    const h3 = comment.querySelector(
      ".js-suggested-changes-container .timeline-comment-actions"
    )
    if (!h3) return
    if (h3.querySelector('.added-by-dscho')) return
    const reason = comment.querySelector('[aria-label="Reason"]')
    if (!reason) return
    for (const className of ["btn", "Button"]) {
      const hideCommentButton = reason.parentNode.querySelector(
        `.${className}`
      )
      if (!hideCommentButton) continue

      const resolveButton = document.createElement(className)
      resolveButton.classList.add(className, 'btn-sm', 'Button--secondary', 'Button--medium', 'd-inline-block', 'added-by-dscho')
      resolveButton.innerHTML = "Off Topic"
      resolveButton.onclick = () => {
        reason.value = "OFF_TOPIC"
        hideCommentButton.click()
      }
      h3.appendChild(resolveButton)
      return
    }
  }

  const handleComments = (queryable) => {
    const comments = queryable.querySelectorAll(".review-comment")
    for (const comment of comments) handleComment(comment)

    for (const comment of queryable.querySelectorAll(
      ".js-comment-container,.timeline-comment-wrapper,.js-suggested-changes-container"
    )) {
      handleComment(comment)
    }
  }

  handleComments(document)

  new MutationObserver((events, observer) => {
    events
      .filter(e => e.type === 'childList')
      .forEach(e => handleComments(e.target))
  }).observe(document, { attributes: true, childList: true, subtree: true });
})()