DEV: Experimental JS plugin API for topic summary HTML (#20963)

app/assets/javascripts/discourse/app/lib/plugin-api.js

@@ -69,6 +69,7 @@ import { addQuickAccessProfileItem } from "discourse/widgets/quick-access-profil
 import { addTagsHtmlCallback } from "discourse/lib/render-tags";
 import { addToolbarCallback } from "discourse/components/d-editor";
 import { addTopicParticipantClassesCallback } from "discourse/widgets/topic-map";
+import { addTopicSummaryCallback } from "discourse/widgets/toggle-topic-summary";
 import { addTopicTitleDecorator } from "discourse/components/topic-title";
 import { addUserMenuGlyph } from "discourse/widgets/user-menu";
 import { addUsernameSelectorDecorator } from "discourse/helpers/decorate-username-selector";
@@ -1022,6 +1023,28 @@ class PluginApi {
     addTopicParticipantClassesCallback(callback);
   }
 
+  /**
+   * EXPERIMENTAL. Do not use.
+   * Adds a callback to be topic summary widget markup that can be used, for example,
+   * to add an extra button to the topic summary widget.
+   *
+   * Example:
+   *
+   *  api.addTopicSummaryCallback((html, attrs, widget) => {
+   *    html.push(
+   *      widget.attach("button", {
+   *        className: "btn btn-primary",
+   *        icon: "magic",
+   *        title: "discourse_ai.ai_helper.title",
+   *        label: "discourse_ai.ai_helper.title",
+   *        action: "showAiSummary",
+   *     })
+   *   );
+   **/
+  addTopicSummaryCallback(callback) {
+    addTopicSummaryCallback(callback);
+  }
+
   /**
    *
    * Adds a callback to be executed on the "transformed" post that is passed to the post

app/assets/javascripts/discourse/app/widgets/toggle-topic-summary.js

@@ -31,10 +31,16 @@ createWidget("toggle-summary-description", {
   },
 });
 
+let topicSummaryCallbacks = null;
+export function addTopicSummaryCallback(callback) {
+  topicSummaryCallbacks = topicSummaryCallbacks || [];
+  topicSummaryCallbacks.push(callback);
+}
+
 export default createWidget("toggle-topic-summary", {
   tagName: "section.information.toggle-summary",
   html(attrs) {
-    return [
+    let html = [
       this.attach("toggle-summary-description", attrs),
       this.attach("button", {
         className: "btn btn-primary",
@@ -44,5 +50,13 @@ export default createWidget("toggle-topic-summary", {
         action: attrs.topicSummaryEnabled ? "cancelFilter" : "showSummary",
       }),
     ];
+
+    if (topicSummaryCallbacks) {
+      topicSummaryCallbacks.forEach((callback) => {
+        html = callback(html, attrs, this);
+      });
+    }
+
+    return html;
   },
 });