Update staff note icon to appear on reviewable

Update staff note icon to appear on reviewable

Flagged posts have been folded into the review queue - this makes staff notes appear on the flags in the review queue

Icon appears as a shorthand pencil emoji

diff --git a/assets/javascripts/discourse-user-notes/connectors/after-reviewable-post-user/show-user-notes-on-flags.js.es6 b/assets/javascripts/discourse-user-notes/connectors/after-reviewable-post-user/show-user-notes-on-flags.js.es6
new file mode 100644
index 0000000..d9918ad
--- /dev/null
+++ b/assets/javascripts/discourse-user-notes/connectors/after-reviewable-post-user/show-user-notes-on-flags.js.es6
@@ -0,0 +1,28 @@
+import { showUserNotes } from "discourse/plugins/discourse-user-notes/discourse-user-notes/lib/user-notes";
+import { getOwner } from "discourse-common/lib/get-owner";
+import { emojiUrlFor } from "discourse/lib/text";
+
+export default {
+  shouldRender(args, component) {
+    return component.siteSettings.user_notes_enabled;
+  },
+
+  setupComponent(args, component) {
+    const model = args.user;
+    const userNotesCount = model.get("custom_fields.user_notes_count") || 0;
+    component.setProperties({
+      userNotesCount,
+      emojiEnabled: component.siteSettings.enable_emoji,
+      emojiUrl: emojiUrlFor("pencil"),
+      userNotesTitle: I18n.t("user_notes.show", { count: userNotesCount })
+    });
+  },
+
+  actions: {
+    showUserNotes() {
+      const store = getOwner(this).lookup("store:main");
+      const user = this.get("args.user");
+      showUserNotes(store, user.id, count => this.set("userNotesCount", count));
+    }
+  }
+};
diff --git a/assets/javascripts/discourse-user-notes/connectors/flagged-post-controls/show-user-notes-on-flags.js.es6 b/assets/javascripts/discourse-user-notes/connectors/flagged-post-controls/show-user-notes-on-flags.js.es6
deleted file mode 100644
index d4f12ec..0000000
--- a/assets/javascripts/discourse-user-notes/connectors/flagged-post-controls/show-user-notes-on-flags.js.es6
+++ /dev/null
@@ -1,24 +0,0 @@
-import { showUserNotes } from "discourse/plugins/discourse-user-notes/discourse-user-notes/lib/user-notes";
-import { getOwner } from "discourse-common/lib/get-owner";
-
-export default {
-  shouldRender(args, component) {
-    return component.siteSettings.user_notes_enabled;
-  },
-
-  setupComponent(args, component) {
-    const model = args.flaggedPost.user;
-    component.set(
-      "userNotesCount",
-      model.get("custom_fields.user_notes_count") || 0
-    );
-  },
-
-  actions: {
-    showUserNotes() {
-      const store = getOwner(this).lookup("store:main");
-      const user = this.get("args.flaggedPost.user");
-      showUserNotes(store, user.id, count => this.set("userNotesCount", count));
-    }
-  }
-};
diff --git a/assets/javascripts/discourse-user-notes/templates/connectors/after-reviewable-post-user/show-user-notes-on-flags.hbs b/assets/javascripts/discourse-user-notes/templates/connectors/after-reviewable-post-user/show-user-notes-on-flags.hbs
new file mode 100644
index 0000000..d7fb5e4
--- /dev/null
+++ b/assets/javascripts/discourse-user-notes/templates/connectors/after-reviewable-post-user/show-user-notes-on-flags.hbs
@@ -0,0 +1,9 @@
+{{#if userNotesCount}}
+  <a href {{action "showUserNotes"}} title="{{userNotesTitle}}">
+    {{#if emojiEnabled}}
+      <img src={{emojiUrl}} title={{userNotesTitle}} alt="pencil" class="emoji">
+    {{else}}
+      {{d-icon "sticky-note"}}
+    {{/if}}
+  </a>
+{{/if}}
diff --git a/assets/javascripts/discourse-user-notes/templates/connectors/flagged-post-controls/show-user-notes-on-flags.hbs b/assets/javascripts/discourse-user-notes/templates/connectors/flagged-post-controls/show-user-notes-on-flags.hbs
deleted file mode 100644
index 19589a0..0000000
--- a/assets/javascripts/discourse-user-notes/templates/connectors/flagged-post-controls/show-user-notes-on-flags.hbs
+++ /dev/null
@@ -1,6 +0,0 @@
-{{#if userNotesCount}}
-  {{show-user-notes
-    show=(action "showUserNotes")
-    count=userNotesCount
-  }}
-{{/if}}
diff --git a/assets/stylesheets/user_notes.scss b/assets/stylesheets/user_notes.scss
index 081ea2c..c3fdf8d 100644
--- a/assets/stylesheets/user_notes.scss
+++ b/assets/stylesheets/user_notes.scss
@@ -4,6 +4,10 @@
   }
 }
 
+.show-user-notes-on-flags {
+  display: inline-block;
+}
+
 .modal-body.user-notes-modal {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;

GitHub sha: 1a60f567

1 Like

This is very cool, thanks.

It looks like this might have caused an error @featheredtoast:

Uncaught TypeError: Cannot read property ‘get’ of null at t.setupComponent (_discourse-user-notes-b69f3e267d54ad0a9559591b5251bd3a5fd6e05e257c50feb9c298fc0851aa8c.js:55)