From e5fe0c6958715c3f28e58e055a4a84232f2cdcaf Mon Sep 17 00:00:00 2001
From: Ahmed Ejaz <chahmedejaz9050@gmail.com>
Date: Wed, 22 Nov 2023 21:54:04 +0500
Subject: [PATCH] #1448, add copy to clipboard button on inbox share dialogue

---
 .../retrospring/controllers/clipboard_controller.ts       | 1 +
 .../retrospring/controllers/inbox_sharing_controller.ts   | 8 +++++++-
 app/javascript/retrospring/features/inbox/entry/answer.ts | 5 +++++
 app/views/inbox/_entry.html.haml                          | 3 +++
 4 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/app/javascript/retrospring/controllers/clipboard_controller.ts b/app/javascript/retrospring/controllers/clipboard_controller.ts
index 23bfc46c..59afaf46 100644
--- a/app/javascript/retrospring/controllers/clipboard_controller.ts
+++ b/app/javascript/retrospring/controllers/clipboard_controller.ts
@@ -14,6 +14,7 @@ export default class extends Controller {
     try {
       await navigator.clipboard.writeText(this.copyValue);
       showNotification(I18n.translate("frontend.clipboard_copy.success"));
+      this.element.dispatchEvent(new CustomEvent('retrospring:copied'));
     } catch (error) {
       console.log(error);
       showErrorNotification(I18n.translate("frontend.clipboard_copy.error"));
diff --git a/app/javascript/retrospring/controllers/inbox_sharing_controller.ts b/app/javascript/retrospring/controllers/inbox_sharing_controller.ts
index dcc7b44f..fe52c0f1 100644
--- a/app/javascript/retrospring/controllers/inbox_sharing_controller.ts
+++ b/app/javascript/retrospring/controllers/inbox_sharing_controller.ts
@@ -1,13 +1,14 @@
 import { Controller } from '@hotwired/stimulus';
 
 export default class extends Controller {
-  static targets = ['twitter', 'tumblr', 'telegram', 'other', 'custom'];
+  static targets = ['twitter', 'tumblr', 'telegram', 'other', 'custom', 'clipboard'];
 
   declare readonly twitterTarget: HTMLAnchorElement;
   declare readonly tumblrTarget: HTMLAnchorElement;
   declare readonly telegramTarget: HTMLAnchorElement;
   declare readonly customTarget: HTMLAnchorElement;
   declare readonly otherTarget: HTMLButtonElement;
+  declare readonly clipboardTarget: HTMLButtonElement;
   declare readonly hasCustomTarget: boolean;
 
   static values = {
@@ -24,6 +25,7 @@ export default class extends Controller {
       this.tumblrTarget.addEventListener('click', () => this.close());
       this.telegramTarget.addEventListener('click', () => this.close());
       this.otherTarget.addEventListener('click', () => this.closeAfterShare());
+      this.clipboardTarget.addEventListener('click', () => this.closeAfterCopyToClipboard());
 
       if (this.hasCustomTarget) {
         this.customTarget.addEventListener('click', () => this.close());
@@ -54,4 +56,8 @@ export default class extends Controller {
   closeAfterShare(): void {
     this.otherTarget.addEventListener('retrospring:shared', () => this.close());
   }
+
+  closeAfterCopyToClipboard(): void {
+    this.clipboardTarget.addEventListener('retrospring:copied', () => this.close());
+  }
 }
diff --git a/app/javascript/retrospring/features/inbox/entry/answer.ts b/app/javascript/retrospring/features/inbox/entry/answer.ts
index b5a142ab..312527c8 100644
--- a/app/javascript/retrospring/features/inbox/entry/answer.ts
+++ b/app/javascript/retrospring/features/inbox/entry/answer.ts
@@ -31,11 +31,16 @@ export function answerEntryHandler(event: Event): void {
       showNotification(data.message);
 
       const shareButton = inboxEntry.querySelector<HTMLButtonElement>('[data-controller="share"]');
+      const clipboardCopyButton = inboxEntry.querySelector<HTMLButtonElement>('[data-action="clipboard#copy"]')
       if (shareButton != null) {
         shareButton.dataset.shareUrlValue = data.sharing.url;
         shareButton.dataset.shareTextValue = data.sharing.text;
       }
 
+      if (clipboardCopyButton != null){
+        clipboardCopyButton.dataset.clipboardCopyValue = `${data.sharing.text} ${data.sharing.url}`;
+      }
+
       const sharing = inboxEntry.querySelector<HTMLElement>('.inbox-entry__sharing');
       if (sharing != null) {
         sharing.dataset.inboxSharingConfigValue = JSON.stringify(data.sharing);
diff --git a/app/views/inbox/_entry.html.haml b/app/views/inbox/_entry.html.haml
index 8e15a7a7..c310b7cd 100644
--- a/app/views/inbox/_entry.html.haml
+++ b/app/views/inbox/_entry.html.haml
@@ -30,6 +30,9 @@
             %a.btn.btn-primary{ href: "#", data: { inbox_sharing_target: "telegram" }, target: "_blank" }
               %i.fab.fa-telegram.fa-fw
               Telegram
+            %a.btn.btn-primary{ data: { controller: :clipboard, action: "clipboard#copy", inbox_sharing_target: "clipboard" }}
+              %i.fa.fa-fw.fa-solid.fa-copy
+              = t("actions.share.copy")
             %button.btn.btn-primary{ data: { controller: "share", action: "share#share", inbox_sharing_target: "other" } }
               %i.fa.fa-fw.fa-share-alt
               = t("actions.share.other")