UX: make entire topic card clickable

javascripts/discourse/api-initializers/clickable-topic-row.js

@@ -0,0 +1,41 @@
+import { apiInitializer } from "discourse/lib/api";
+import { wantsNewWindow } from "discourse/lib/intercept-click";
+
+export default apiInitializer((api) => {
+  api.registerBehaviorTransformer(
+    "topic-list-item-click",
+    ({ context, next }) => {
+      const event = context.event;
+      const target = event.target;
+      const topic = context.topic;
+
+      const excludedSelectors = [
+        "a:not(.title)",
+        "button",
+        ".bulk-select",
+        ".topic-category-data",
+      ];
+
+      const isExcluded = excludedSelectors.some((selector) =>
+        target.closest(selector)
+      );
+
+      if (isExcluded) {
+        return next();
+      }
+
+      const mainLink = target.closest(".title, .main-link, .topic-list-item");
+      if (mainLink) {
+        if (wantsNewWindow(event)) {
+          window.open(topic.lastUnreadUrl, "_blank");
+        } else {
+          event.preventDefault();
+          context.navigateToTopic(topic, topic.lastUnreadUrl);
+        }
+        return;
+      }
+
+      next();
+    }
+  );
+});

scss/topic-cards.scss

@@ -359,6 +359,7 @@
 }
 
 .topic-list-item {
+  cursor: pointer;
   background: var(--d-content-background);
   box-shadow: 0 0 12px 1px var(--topic-card-shadow);