* If Clipboard API isn't supported remove all copy to clipboard buttons from the DOM

* Add further buttons to allow copy to clibboard order ids, subscriptions id, payment and transaction ids.

Author: MaximilianoRicoTabo

classes/class-pmpro-discount-code-list-table.php

@@ -370,7 +370,7 @@ public function column_discount_code( $item ) {
 		?>
 		<strong><a title="<?php echo esc_attr( sprintf( __( 'Edit Code: %s', 'paid-memberships-pro' ), $item->id ) ); ?>" href="<?php echo esc_url( add_query_arg( array( 'page' => 'pmpro-discountcodes', 'edit' => $item->id ), admin_url('admin.php' ) ) ); ?>"><?php echo esc_html( $item->code ); ?></a></strong>
 		<button title="<?php echo esc_attr__('Copy code to the clipboard', 'paid-memberships-pro' ) ?>" type="button" 
-			class="pmpro_copy_discount_code button-link edit-filters" style="display:none">
+			class="pmpro_copy_discount_code pmpro_copy_to_clipboard button-link edit-filters" style="display:none">
 			<span class="dashicons dashicons-clipboard" aria-hidden="true"></span>
 		</button>
 		<div class="row-actions">

classes/class-pmpro-orders-list-table.php

@@ -891,6 +891,10 @@ public function column_order_id( $item ) {
 	public function column_order_code( $item ) {
 		?>
 		<strong><a href="admin.php?page=pmpro-orders&order=<?php echo esc_attr( $item->id ); ?>"><?php echo esc_html( $item->code ); ?></a></strong>
+		<button title="<?php echo esc_attr__('Copy code to the clipboard', 'paid-memberships-pro' ) ?>" type="button"
+			class="pmpro_copy_order_id pmpro_copy_to_clipboard button-link edit-filters" style="display:block">
+			<span class="dashicons dashicons-clipboard" aria-hidden="true"></span>
+		</button>
 		<div class="row-actions">
 			<?php
 			$delete_text = esc_html(
@@ -1230,7 +1234,18 @@ public function column_transaction_ids( $item ) {
 
 		// Echo the data for this column.
 		foreach( $column_value as $key => $value ) {
-			echo '<p>' . wp_kses_post( $value ) . '</p>';
+			echo '<p>' .
+				wp_kses_post( $value );
+				//we don't want to show the copy button for the empty  column
+				if( $key !== 'none') {
+				?>
+			<button title="<?php echo esc_attr( sprintf( __( 'Copy the %s to the clipboard', 'paid-memberships-pro' ), $key ) ) ?>" type="button"
+				class="pmpro_copy_<? echo esc_attr( $key ) ?> pmpro_copy_to_clipboard button-link edit-filters" style="display:none">
+				<span class="dashicons dashicons-clipboard" aria-hidden="true"></span>
+			</button>
+			<?php
+				}
+			echo '</p>';
 		}
 	}
 

classes/class-pmpro-subscriptions-list-table.php

@@ -449,6 +449,10 @@ public function column_default( $item, $column_name ) {
 	public function column_id( $item ) {
 		?>
 		<strong><a href="admin.php?page=pmpro-subscriptions&id=<?php echo esc_attr( $item->get_id() ); ?>"><?php echo esc_html( $item->get_subscription_transaction_id() ); ?></a></strong>
+		<button title="<?php echo esc_attr__('Copy subscription ID to the clipboard', 'paid-memberships-pro' ) ?>" type="button"
+			class="pmpro_copy_subscription_id pmpro_copy_to_clipboard button-link edit-filters" style="display:none">
+			<span class="dashicons dashicons-clipboard" aria-hidden="true"></span>
+		</button>
 		<div class="row-actions">
 			<?php
 			$actions = [

css/admin.css

@@ -1647,13 +1647,13 @@ table.pmprommpu_levels tr.remove_level td {background: #F2DEDE; }
 	-moz-osx-font-smoothing: grayscale;
 }
 
-.pmpro_admin tr td button.pmpro_copy_discount_code .dashicons:not(.button .dashicons) {
+.pmpro_admin tr td button.pmpro_copy_to_clipboard .dashicons:not(.button .dashicons) {
 	padding-top: unset;
 	font-size: 14px;
 	line-height: 1.4;
 }
 
-.pmpro_admin tr td button.pmpro_copy_discount_code:hover {
+.pmpro_admin tr td button.pmpro_copy_to_clipboard:hover {
 	color: #043959;
 }
 

js/pmpro-admin.js

@@ -1003,19 +1003,41 @@ jQuery(document).ready(function () {
 	jQuery('.pmpro_admin-pmpro-orders select#membership_id').select2();
 });
 
+/**
+ * Copy to the clipboard for discount codes, order ids, payment ids, etc.
+ */
 jQuery(document).ready(function ($) {
 
+	//get all the buttons
+	const $allButtons = $( '.pmpro_copy_to_clipboard' );
+
+	//get all table rows
+	const $allTableRows = $( 'table.discountcodes tr, table.subscriptions tr, table.orders tr' );
+
+	//get all anchors in the same table cell
+	const $allAnchors = $( 'td.column-discount_code a, td.column-subscription_id a, td.column-order_id a' );
+
+	// Bail if Clipboard API isn't supported
+	if ( ! navigator.clipboard ) {
+		//hide all buttons. Iterate over the jquery elements array and hide them all.
+		$allButtons.each( function () {
+			$( this ).remove();
+		});
+	}
+
 	/**
 	 * If it's mouseenter show the clipboard icon hider otherwise
 	 *
 	 * @param {Event} evt The event object
 	 * @returns {void}
 	 * @since TBD
 	 */
-	$('table.discountcodes tr').on( "mouseenter mouseleave focus", function ( evt ) {
-		$(this).find('td.column-discount_code .pmpro_copy_discount_code').hide();
-		if (evt.type === 'mouseenter' ) {
-			$(this).find('.pmpro_copy_discount_code').show();
+	$( $allTableRows ).on( "mouseenter mouseleave focus", function ( evt ) {
+		const button = $( this ).find( '.pmpro_copy_to_clipboard' );
+		button.hide();
+
+		if ( evt.type === 'mouseenter' || evt.type === 'focus' ) {
+			button.show();
 		}
 	});
 
@@ -1026,25 +1048,24 @@ jQuery(document).ready(function ($) {
 	 * @returns {void}
 	 * @since TBD
 	 */
-	$('td.column-discount_code a').on( "focus", function ( evt ) {
-		$(this).closest( 'td' ).find( '.pmpro_copy_discount_code' ).show();
+	$( $allAnchors ).on( "focus", function ( evt ) {
+		$(this).closest('td').find('.pmpro_copy_to_clipboard').show();
 	});
 
 	/**
-	 * Copy Discount Code to Clipboard
+	 * Copy  to Clipboard different codes across the site. Check the class pmpro_copy_to_clipboard to find where it's used.
 	 *
 	 * @param {Event} evt The click event
 	 * @returns {void}
 	 * @since TBD
 	 */
-	$('.pmpro_copy_discount_code').on('click', function ( evt ) {
+	$('.pmpro_copy_to_clipboard').on('click', function ( evt ) {
         // Find first link text
-        const code = $(this).closest('td').find('a').first().text();
-
-        // Bail if Clipboard API isn't supported
-        if ( ! navigator.clipboard ) {
-            return;
-        }
+        let code = $(this).closest('td').find('a').first().text();
+		//if it's a payment transaction id, we need to get the text from the first anchor
+		if( $(this).hasClass('pmpro_copy_payment_transaction_id') ) {
+			code = $(this).closest('td').find('p').first().text().split(":")[1].trim();
+		}
 
         // Create a new Blob object with the discount code
         const blob = new Blob([code], { type: 'text/plain' });
@@ -1059,7 +1080,7 @@ jQuery(document).ready(function ($) {
                 // Remove success message and show copy button after a delay
                 setTimeout(() => {
                     $('.success-message').remove();
-                    $('.pmpro_copy_discount_code').show();
+                    $('.pmpro_copy_to_clipboard').show();
                 }, 3000);
             })
             .catch(err => {