FreakU
/
Retrospring
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

#1448, add copy to clipboard button on inbox share dialogue

This commit is contained in:
Ahmed Ejaz 2023-11-22 21:54:04 +05:00 committed by Andreas Nedbal
parent bfe1851969
commit e5fe0c6958
4 changed files with 16 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/javascript/retrospring/controllers/clipboard_controller.ts
View File

@ -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"));

8
app/javascript/retrospring/controllers/inbox_sharing_controller.ts
View File

@ -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());
}
}

5
app/javascript/retrospring/features/inbox/entry/answer.ts
View File

@ -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);

3
app/views/inbox/_entry.html.haml
View File

@ -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")