DEV: Modernizations

README.md

@@ -1,5 +1,7 @@
-# Discourse Copy Post
+# 📄 Copy post
 
-This theme component adds a 📄 Copy Button to the post menu control section of every post. Clicking the button will copy the entire contents of the post to the user's clipboard.
+This theme component adds a copy button to the post menu control section of every post. Clicking the button will copy the entire contents of the post to the user's clipboard.
+
+Learn more about this component [here](https://meta.discourse.org/t/copy-post-component/218883).
 
 ![Example Usage](.github/images/usage.gif)

about.json

@@ -7,7 +7,8 @@
   "theme_version": "1.0",
   "modifiers": {
     "svg_icons": [
-      "copy"
+      "far-copy",
+      "check"
     ]
   }
 }

common/common.scss

@@ -0,0 +1,3 @@
+.post-action-menu__copy-post .d-icon-check {
+  color: var(--success);
+}

javascripts/discourse/api-initializers/discourse-copy-post.js

@@ -1,23 +1,20 @@
 import { apiInitializer } from "discourse/lib/api";
+import CopyPostButton from "../components/copy-post-button";
 
-export default apiInitializer("0.11.1", (api) => {
-  const user = api.getCurrentUser();
-  const trustLevelAllUsers = 5;
-  const minTrustLevel = settings.min_trust_level;
+export default apiInitializer("2.0.0", (api) => {
+  const currentUser = api.getCurrentUser();
+  const currentUserGroupIds = currentUser.groups.map((group) => group.id);
+  const allowedGroups = settings.copy_button_allowed_groups;
+  const allowedGroupIds = allowedGroups.split("|").map(Number);
+  const userNotAllowed = !allowedGroupIds.some((groupId) =>
+    currentUserGroupIds.includes(groupId)
+  );
 
-  if (minTrustLevel !== trustLevelAllUsers) {
-    if (!user) {
-      return;
-    }
-
-    if (user.trust_level < minTrustLevel) {
-      return;
-    }
+  if (userNotAllowed) {
+    return;
   }
 
-  api.decorateWidget("post-menu:before-extra-controls", (helper) => {
-    const results = [];
-    results.push(helper.widget.attach("copy-widget", helper));
-    return results;
+  api.registerValueTransformer("post-menu-buttons", ({ value: dag }) => {
+    dag.add("copy-post", CopyPostButton);
   });
 });

javascripts/discourse/components/copy-post-button.gjs

@@ -0,0 +1,57 @@
+import Component from '@glimmer/component';
+import { tracked } from "@glimmer/tracking";
+import { action } from "@ember/object";
+import DButton from "discourse/components/d-button";
+import { ajax } from "discourse/lib/ajax";
+import { popupAjaxError } from "discourse/lib/ajax-error";
+import { clipboardCopy } from "discourse/lib/utilities";
+import discourseLater from "discourse-common/lib/later";
+
+export default class CopyPostButton extends Component {
+  static hidden() {
+    return false;
+  }
+
+  @tracked icon = "far-copy";
+
+  @action
+  async copyPost() {
+    const cookedPost = this.args.post.cooked;
+    const copyType = settings.copy_type;
+    const postContents = copyType === "html" ? cookedPost : await this.fetchRawPost(this.args.post.id);
+
+    if (!postContents) {
+      return;
+    }
+
+    try {
+      this.icon = "check";
+      await clipboardCopy(postContents);
+    } catch (error) {
+      popupAjaxError(error);
+    } finally {
+      discourseLater(() => {
+        this.icon = "far-copy";
+      }, 2000);
+    }
+  }
+
+  async fetchRawPost(postId) {
+    try {
+      const { raw } = await ajax(`/posts/${postId}.json`);
+      return raw;
+    } catch (error) {
+      popupAjaxError(error);
+    }
+  }
+
+  <template>
+    <DButton
+      class="post-action-menu__copy-post btn-flat"
+      @title={{themePrefix "title"}}
+      @icon={{this.icon}}
+      @action={{this.copyPost}}
+      ...attributes
+    />
+  </template>
+}

locales/en.yml

@@ -1,5 +1,4 @@
 en:
   theme_metadata:
     description: "A button in the post menu to copy a post's contents to the clipboard"
-  copied: "Copied"
   title: "Copy the contents of this post"

settings.yml

@@ -1,9 +1,12 @@
-copy_raw_html:
-  type: bool
-  default: false
-  description: "If selected the copied contents will be raw HTML instead of the stripped down plain text"
-min_trust_level:
-  type: integer
-  default: 5
-  max: 5
-  description: "Select the minimum trust level required to see the widget. (Select 5 to show to all users)"
+copy_type:
+  type: enum
+  default: markdown
+  choices:
+    - markdown
+    - html
+  description: "Select the type of copied text you would like saved to the clipboard."
+copy_button_allowed_groups:
+  type: list
+  list_type: group
+  default: "11" # trust_level_1
+  description: "Select the groups that are allowed to use the copy button."