feat: increase the visibility of rename/replace

assets/js/modal-attachment.js

@@ -0,0 +1,101 @@
+jQuery(document).ready(function($) {
+    if (!$('body').hasClass('upload-php')) {
+        return;
+    }
+
+    var originalAttachmentDetails = wp.media.view.Attachment.Details;
+
+    wp.media.view.Attachment.Details = originalAttachmentDetails.extend({
+        initialize: function() {
+            originalAttachmentDetails.prototype.initialize.apply(this, arguments);
+        },
+
+        render: function() {
+            originalAttachmentDetails.prototype.render.apply(this, arguments);
+
+            this.addReplaceRenameButton();
+
+            return this;
+        },
+
+        addReplaceRenameButton: function() {
+            var self = this;
+
+            var $el = self.$el;
+            var $actions = $el.find('.actions');
+
+            if ($actions.find('.optml-replace-rename-link').length) {
+                return;
+            }
+
+            var attachmentId = self.model.get('id');
+
+            if (attachmentId && $actions.length) {
+                var editUrl = OptimoleModalAttachment.editPostURL + '?post=' + attachmentId + 
+                             '&action=edit&TB_iframe=true&width=90%&height=90%';
+
+                var $editLink = $actions.find('a[href*="post.php"]');
+
+                if ($editLink.length) {
+                    $editLink.after(
+                        ' <span class="links-separator">|</span>' +
+                        '<a href="' + editUrl + '" class="optml-replace-rename-link thickbox" title="' + 
+                        OptimoleModalAttachment.i18n.replaceOrRename + '"> ' +
+                        OptimoleModalAttachment.i18n.replaceOrRename + '</a>'
+                    );
+                }
+            }
+        }
+    });
+
+    if (wp.media.view.Attachment.Details.TwoColumn) {
+        var originalTwoColumn = wp.media.view.Attachment.Details.TwoColumn;
+
+        wp.media.view.Attachment.Details.TwoColumn = originalTwoColumn.extend({
+            initialize: function() {
+                originalTwoColumn.prototype.initialize.apply(this, arguments);
+            },
+
+            render: function() {
+                originalTwoColumn.prototype.render.apply(this, arguments);
+
+                this.addReplaceRenameButton();
+
+                return this;
+            },
+
+            addReplaceRenameButton: function() {
+                var self = this;
+
+                var $el = self.$el;
+                var $actions = $el.find('.actions');
+
+                if ($actions.find('.optml-replace-rename-link').length) {
+                    return;
+                }
+
+                var attachmentId = self.model.get('id');
+
+                if (attachmentId && $actions.length) {
+                    var editUrl = OptimoleModalAttachment.editPostURL + '?post=' + attachmentId + 
+                                 '&action=edit&TB_iframe=true&width=90%&height=90%';
+
+                    var $editLink = $actions.find('a[href*="post.php"]');
+
+                    if ($editLink.length) {
+                        $editLink.after(
+                            ' <span class="links-separator">|</span>' +
+                            '<a href="' + editUrl + '" class="optml-replace-rename-link thickbox" title="' + 
+                            OptimoleModalAttachment.i18n.replaceOrRename + '"> ' +
+                            OptimoleModalAttachment.i18n.replaceOrRename + '</a>'
+                        );
+                    }
+                }
+            }
+        });
+    }
+
+    $(document).on('click', '.optml-replace-rename-link.thickbox', function() {
+        tb_init('a.thickbox');
+    });
+});

inc/media_rename/attachment_edit.php

@@ -24,6 +24,30 @@
 		add_action( 'wp_ajax_optml_replace_file', [ $this, 'replace_file' ] );
 
 		add_action( 'admin_enqueue_scripts', [ $this, 'enqueue_scripts' ] );
+		add_filter( 'media_row_actions', [ $this, 'add_replace_rename_action' ], 10, 2 );
+	}
+
+	/**
+	 * Add Replace or Rename action in media library list view.
+	 *
+	 * @param array   $actions The list of actions.
+	 * @param WP_Post $post The post object.
+	 * @return array
+	 */
+	public function add_replace_rename_action( $actions, $post ) {
+		if ( get_post_type( $post->ID ) !== 'attachment' ) {
+			return $actions;
+		}
+
+		$edit_url = admin_url( 'post.php?post=' . $post->ID . '&action=edit' );
+		$actions['replace_rename'] = sprintf(
+			'<a href="%s" aria-label="%s">%s</a>',
+			esc_url( $edit_url ),
+			esc_attr__( 'Replace or Rename', 'optimole-wp' ),
+			esc_html__( 'Replace or Rename', 'optimole-wp' )
+		);
+
+		return $actions;
 	}
 
 	/**
@@ -32,48 +56,69 @@
 	 * @param string $hook The hook.
 	 */
 	public function enqueue_scripts( $hook ) {
-		if ( $hook !== 'post.php' ) {
+		if ( $hook !== 'post.php' && $hook !== 'upload.php' ) {
 			return;
 		}
 
-		$id = (int) sanitize_text_field( $_GET['post'] );
+		if ( $hook === 'post.php' ) {
+			$id = (int) sanitize_text_field( $_GET['post'] );
 
-		if ( ! $id ) {
-			return;
-		}
+			if ( ! $id ) {
+				return;
+			}
 
-		if ( ! current_user_can( 'edit_post', $id ) ) {
-			return;
-		}
+			if ( ! current_user_can( 'edit_post', $id ) ) {
+				return;
+			}
 
-		if ( get_post_type( $id ) !== 'attachment' ) {
-			return;
-		}
+			if ( get_post_type( $id ) !== 'attachment' ) {
+				return;
+			}
 
-		$mime_type = get_post_mime_type( $id );
-
-		$max_file_size = wp_max_upload_size();
-		// translators: %s is the max file size in MB.
-		$max_file_size_error = sprintf( __( 'File size is too large. Max file size is %sMB', 'optimole-wp' ), $max_file_size / 1024 / 1024 );
-
-		wp_enqueue_style( 'optml-attachment-edit', OPTML_URL . 'assets/css/single-attachment.css', [], OPTML_VERSION );
-
-		wp_register_script( 'optml-attachment-edit', OPTML_URL . 'assets/js/single-attachment.js', [ 'jquery' ], OPTML_VERSION, true );
-		wp_localize_script(
-			'optml-attachment-edit',
-			'OMAttachmentEdit',
-			[
-				'ajaxURL'      => admin_url( 'admin-ajax.php' ),
-				'maxFileSize'  => $max_file_size,
-				'attachmentId' => $id,
-				'mimeType'     => $mime_type,
-				'i18n'         => [
-					'maxFileSizeError' => $max_file_size_error,
-					'replaceFileError' => __( 'Error replacing file', 'optimole-wp' ),
-				],
-			]
-		);
-		wp_enqueue_script( 'optml-attachment-edit' );
+			$mime_type = get_post_mime_type( $id );
+
+			$max_file_size = wp_max_upload_size();
+			// translators: %s is the max file size in MB.
+			$max_file_size_error = sprintf( __( 'File size is too large. Max file size is %sMB', 'optimole-wp' ), $max_file_size / 1024 / 1024 );
+
+			wp_enqueue_style( 'optml-attachment-edit', OPTML_URL . 'assets/css/single-attachment.css', [], OPTML_VERSION );
+
+			wp_register_script( 'optml-attachment-edit', OPTML_URL . 'assets/js/single-attachment.js', [ 'jquery' ], OPTML_VERSION, true );
+			wp_localize_script(
+				'optml-attachment-edit',
+				'OMAttachmentEdit',
+				[
+					'ajaxURL'      => admin_url( 'admin-ajax.php' ),
+					'maxFileSize'  => $max_file_size,
+					'attachmentId' => $id,
+					'mimeType'     => $mime_type,
+					'i18n'         => [
+						'maxFileSizeError' => $max_file_size_error,
+						'replaceFileError' => __( 'Error replacing file', 'optimole-wp' ),
+					],
+				]
+			);
+			wp_enqueue_script( 'optml-attachment-edit' );
+		} elseif ( $hook === 'upload.php' ) {
+			wp_enqueue_script(
+				'optml-modal-attachment',
+				OPTML_URL . 'assets/js/modal-attachment.js', // Your JavaScript file
+				[ 'jquery', 'media-views', 'media-models' ],
+				OPTML_VERSION,
+				true
+			);
+
+			wp_localize_script(
+				'optml-modal-attachment',
+				'OptimoleModalAttachment',
+				[
+					'editPostURL' => admin_url( 'post.php' ),
+					'i18n' => [
+						'replaceOrRename' => __( 'Replace or Rename', 'optimole-wp' ),
+					],
+				]
+			);
+		}
 	}
 
 	/**