From 4ab696dd2f08c726564376de765a081b10b58980 Mon Sep 17 00:00:00 2001
From: Jarek Radosz <jradosz@gmail.com>
Date: Tue, 4 Feb 2020 11:42:25 +0100
Subject: [PATCH] DEV: Add the `@action` decorator (#8836)

This also enables`@action` use in plugin connectors.

Setting `actions` earlier allows `setupComponents` to use them, for example, when setting up event listeners.
---
 app/assets/javascripts/discourse-loader.js    |  1 +
 .../components/plugin-connector.js.es6        |  8 +++--
 .../plugin-outlet-connector-class-test.js.es6 | 31 +++++++++++++++++++
 3 files changed, 38 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/discourse-loader.js b/app/assets/javascripts/discourse-loader.js
index 0cf66dd923c..78e461d9b49 100644
--- a/app/assets/javascripts/discourse-loader.js
+++ b/app/assets/javascripts/discourse-loader.js
@@ -16,6 +16,7 @@ var define, requirejs;
         inject: Ember.inject.controller
       },
       "@ember/object": {
+        action: Ember._action,
         default: Ember.Object,
         get: Ember.get,
         getProperties: Ember.getProperties,
diff --git a/app/assets/javascripts/discourse/components/plugin-connector.js.es6 b/app/assets/javascripts/discourse/components/plugin-connector.js.es6
index 6f6bbe825f8..4fbb83e30e2 100644
--- a/app/assets/javascripts/discourse/components/plugin-connector.js.es6
+++ b/app/assets/javascripts/discourse/components/plugin-connector.js.es6
@@ -35,10 +35,14 @@ export default Component.extend({
     });
 
     const connectorClass = this.get("connector.connectorClass");
+    this.set("actions", connectorClass.actions);
+
+    for (const [name, action] of Object.entries(this.actions)) {
+      this.set(name, action);
+    }
+
     const merged = buildArgsWithDeprecations(args, deprecatedArgs);
     connectorClass.setupComponent.call(this, merged, this);
-
-    this.set("actions", connectorClass.actions);
   },
 
   willDestroyElement() {
diff --git a/test/javascripts/acceptance/plugin-outlet-connector-class-test.js.es6 b/test/javascripts/acceptance/plugin-outlet-connector-class-test.js.es6
index 70071f1d86b..cff875d98f4 100644
--- a/test/javascripts/acceptance/plugin-outlet-connector-class-test.js.es6
+++ b/test/javascripts/acceptance/plugin-outlet-connector-class-test.js.es6
@@ -1,5 +1,6 @@
 import { acceptance } from "helpers/qunit-helpers";
 import { extraConnectorClass } from "discourse/lib/plugin-connectors";
+import { action } from "@ember/object";
 
 const PREFIX = "javascripts/single-test/connectors";
 acceptance("Plugin Outlet - Connector Class", {
@@ -12,6 +13,26 @@ acceptance("Plugin Outlet - Connector Class", {
       }
     });
 
+    extraConnectorClass("user-profile-primary/hi", {
+      setupComponent() {
+        this.appEvents.on("hi:sayHi", this, this.say);
+      },
+
+      teardownComponent() {
+        this.appEvents.off("hi:sayHi", this, this.say);
+      },
+
+      @action
+      say() {
+        this.set("hi", "hi!");
+      },
+
+      @action
+      sayHi() {
+        this.appEvents.trigger("hi:sayHi");
+      }
+    });
+
     extraConnectorClass("user-profile-primary/dont-render", {
       shouldRender(args) {
         return args.model.get("username") !== "eviltrout";
@@ -25,6 +46,12 @@ acceptance("Plugin Outlet - Connector Class", {
         <button class='say-hello' {{action "sayHello"}}></button>
         <span class='hello-result'>{{hello}}</span>`
     );
+    Ember.TEMPLATES[
+      `${PREFIX}/user-profile-primary/hi`
+    ] = Ember.HTMLBars.compile(
+      `<button class='say-hi' {{action "sayHi"}}></button>
+        <span class='hi-result'>{{hi}}</span>`
+    );
     Ember.TEMPLATES[
       `${PREFIX}/user-profile-primary/dont-render`
     ] = Ember.HTMLBars.compile(`I'm not rendered!`);
@@ -32,6 +59,7 @@ acceptance("Plugin Outlet - Connector Class", {
 
   afterEach() {
     delete Ember.TEMPLATES[`${PREFIX}/user-profile-primary/hello`];
+    delete Ember.TEMPLATES[`${PREFIX}/user-profile-primary/hi`];
     delete Ember.TEMPLATES[`${PREFIX}/user-profile-primary/dont-render`];
   }
 });
@@ -53,4 +81,7 @@ QUnit.test("Renders a template into the outlet", async assert => {
     "hello!",
     "actions delegate properly"
   );
+
+  await click(".say-hi");
+  assert.equal(find(".hi-result").text(), "hi!", "actions delegate properly");
 });