[DEMO] Collapse subject-only comments (IFB)

ifb.user.js

// ==UserScript==
// @name Collapse subject-only comments (IFB)
// @description Collapses toplevel comments whose body is a single period into a summarized view, 
//              just showing their subject lines with a count, similar to Slack or Discord.
// @namespace   frobisherw.dreamwidth.org
// @version  0.1
// @match *://*.dreamwidth.org/*
// @grant    none
// @license Just for demostration at this time; do not redistribute; expected to be released under a free license later.
// ==/UserScript==
let reactions={};
function processComments(matchingTitle, show) {
  document.querySelectorAll(".comment-depth-1").forEach(function(x){
    let title=x.querySelector(".comment-title").textContent;
    let content=x.querySelector(".comment-content").textContent;
    if (content==="." && (!matchingTitle || title===matchingTitle)) {
      reactions[title] = (reactions[title] || 0) + 1;
      x.style.display=show ? null : "none";
    }
  });
}
processComments();

document.querySelectorAll(".entry-interaction-links").forEach(function(x){
  let e;
  if (x.firstChild.className !== "comment-reactions") {
   e = document.createElement("li");
   e.className = "comment-reactions";
  } else {
    e = x.firstChild;
  }
  function make_reaction_element(x) {
    let s = document.createElement("span");
    s.onclick=function() {
      let show=(s.style.borderStyle==="inset");
      processComments(s.firstChild.textContent, show);
      s.style.borderStyle = show ? "outset" : "inset";
    }
    s.style.borderStyle="inset";
    s.style.borderColor="black";
    s.style.borderWidth="2px";
    s.innerHTML="<span>"+x[0]+"</span> <b>" + x[1]+"</b>"
    e.appendChild(s);
  }

  Object.entries(reactions).forEach(make_reaction_element);
  if (x.firstChild.className !== "comment-reactions") {
    x.insertBefore(e, x.firstChild);
    e.insertAdjacentText("afterend", " ")
  }
});