DEV: Added compatibility with the Glimmer Post Menu (#219)

assets/javascripts/discourse/components/post-voting-answer-button.gjs

@@ -0,0 +1,31 @@
+import Component from "@glimmer/component";
+import { inject as service } from "@ember/service";
+import DButton from "discourse/components/d-button";
+import concatClass from "discourse/helpers/concat-class";
+
+export default class PostVotingAnswerButton extends Component {
+  static shouldRender(args) {
+    return args.state.canCreatePost && args.post.post_number === 1;
+  }
+
+  @service site;
+
+  get showLabel() {
+    return this.site.desktopView;
+  }
+
+  <template>
+    <DButton
+      class={{concatClass
+        "post-action-menu__post-voting-answer"
+        "reply"
+        (if this.showLabel "create fade-out")
+      }}
+      ...attributes
+      @action={{@buttonActions.replyToPost}}
+      @icon="reply"
+      @label={{if this.showLabel "post_voting.topic.answer.label"}}
+      @title="post_voting.topic.answer.help"
+    />
+  </template>
+}

assets/javascripts/discourse/initializers/post-voting-edits.js → assets/javascripts/discourse/initializers/post-voting-edits.gjs

@@ -1,45 +1,15 @@
+import Component from "@glimmer/component";
 import { withPluginApi } from "discourse/lib/plugin-api";
+import { withSilencedDeprecations } from "discourse-common/lib/deprecated";
 import I18n from "I18n";
+import PostVotingAnswerButton from "../components/post-voting-answer-button";
+import PostVotingComments from "../components/post-voting-comments";
 
 export const ORDER_BY_ACTIVITY_FILTER = "activity";
 const pluginId = "discourse-post-voting";
 
-function initPlugin(api) {
-  api.removePostMenuButton("reply", (attrs) => {
-    return attrs.post_voting_has_votes !== undefined;
-  });
-
-  api.removePostMenuButton("like", (_attrs, _state, siteSetting) => {
-    return (
-      _attrs.post_voting_has_votes !== undefined &&
-      _attrs.post_number !== 1 &&
-      !siteSetting.post_voting_enable_likes_on_answers
-    );
-  });
-
-  api.addPostMenuButton("answer", (attrs) => {
-    if (
-      attrs.post_voting_has_votes === undefined ||
-      attrs.post_number !== 1 ||
-      !attrs.canCreatePost
-    ) {
-      return;
-    }
-
-    const args = {
-      action: "replyToPost",
-      title: "post_voting.topic.answer.help",
-      icon: "reply",
-      className: "reply create fade-out",
-      position: "last",
-    };
-
-    if (!attrs.mobileView) {
-      args.label = "post_voting.topic.answer.label";
-    }
-
-    return args;
-  });
+function initPlugin(api, container) {
+  customizePostMenu(api, container);
 
   api.modifyClass("model:post-stream", {
     pluginId,
@@ -74,6 +44,7 @@ function initPlugin(api) {
       }
     }
   }
+
   api.registerCustomLastUnreadUrlCallback(customLastUnreadUrl);
 
   api.reopenWidget("post", {
@@ -166,28 +137,6 @@ function initPlugin(api) {
     return result;
   });
 
-  api.decorateWidget("post-menu:after", (helper) => {
-    const result = [];
-    const attrs = helper.widget.attrs;
-
-    if (
-      attrs.post_voting_has_votes !== undefined &&
-      !attrs.reply_to_post_number &&
-      !helper.widget.state.filteredRepliesShown
-    ) {
-      const post = helper.getModel();
-
-      result.push(
-        helper.attach("post-voting-comments", {
-          post,
-          canCreatePost: attrs.canCreatePost,
-        })
-      );
-    }
-
-    return result;
-  });
-
   api.decorateWidget("post-avatar:after", function (helper) {
     const result = [];
     const model = helper.getModel();
@@ -212,6 +161,115 @@ function initPlugin(api) {
   );
 }
 
+function customizePostMenu(api, container) {
+  const siteSettings = container.lookup("service:site-settings");
+
+  const transformerRegistered = api.registerValueTransformer(
+    "post-menu-buttons",
+    ({ value: dag, context: { post, buttonKeys } }) => {
+      if (post.post_voting_has_votes !== undefined) {
+        dag.add("post-voting-answer", PostVotingAnswerButton, {
+          after: [buttonKeys.SHOW_MORE, buttonKeys.REPLY],
+        });
+
+        dag.delete(buttonKeys.REPLY);
+
+        if (
+          post.post_number !== 1 &&
+          !siteSettings.post_voting_enable_likes_on_answers
+        ) {
+          dag.delete(buttonKeys.LIKE);
+        }
+      }
+    }
+  );
+
+  api.renderInOutlet(
+    "post-menu__after",
+    class extends Component {
+      static shouldRender(args) {
+        return (
+          args.post.post_voting_has_votes !== undefined &&
+          !args.post.reply_to_post_number &&
+          !(args.state.filteredRepliesView && args.state.repliesShown)
+        );
+      }
+
+      <template>
+        <PostVotingComments
+          @post={{@outletArgs.post}}
+          @canCreatePost={{@outletArgs.state.canCreatePost}}
+        />
+      </template>
+    }
+  );
+
+  const silencedKey =
+    transformerRegistered && "discourse.post-menu-widget-overrides";
+
+  withSilencedDeprecations(silencedKey, () => customizeWidgetPostMenu(api));
+}
+
+function customizeWidgetPostMenu(api) {
+  api.removePostMenuButton("reply", (attrs) => {
+    return attrs.post_voting_has_votes !== undefined;
+  });
+
+  api.removePostMenuButton("like", (_attrs, _state, siteSetting) => {
+    return (
+      _attrs.post_voting_has_votes !== undefined &&
+      _attrs.post_number !== 1 &&
+      !siteSetting.post_voting_enable_likes_on_answers
+    );
+  });
+
+  api.addPostMenuButton("answer", (attrs) => {
+    if (
+      attrs.post_voting_has_votes === undefined ||
+      attrs.post_number !== 1 ||
+      !attrs.canCreatePost
+    ) {
+      return;
+    }
+
+    const args = {
+      action: "replyToPost",
+      title: "post_voting.topic.answer.help",
+      icon: "reply",
+      className: "reply create fade-out",
+      position: "last",
+    };
+
+    if (!attrs.mobileView) {
+      args.label = "post_voting.topic.answer.label";
+    }
+
+    return args;
+  });
+
+  api.decorateWidget("post-menu:after", (helper) => {
+    const result = [];
+    const attrs = helper.widget.attrs;
+
+    if (
+      attrs.post_voting_has_votes !== undefined &&
+      !attrs.reply_to_post_number &&
+      !helper.widget.state.filteredRepliesShown
+    ) {
+      const post = helper.getModel();
+
+      result.push(
+        helper.attach("post-voting-comments", {
+          post,
+          canCreatePost: attrs.canCreatePost,
+        })
+      );
+    }
+
+    return result;
+  });
+}
+
 export default {
   name: "post-voting-edits",
   initialize(container) {
@@ -221,6 +279,8 @@ export default {
       return;
     }
 
-    withPluginApi("1.2.0", initPlugin);
+    withPluginApi("1.13.0", (api) => {
+      initPlugin(api, container);
+    });
   },
 };

test/javascripts/acceptance/post-voting-test.js

@@ -129,6 +129,7 @@ function setupPostVoting(needs) {
     min_post_length: 5,
     post_voting_comment_max_raw_length: 50,
     post_voting_enable_likes_on_answers: false,
+    glimmer_post_menu_mode: "enabled",
   });
 
   needs.hooks.afterEach(function () {