From c01b4a2986a17d59fc29926862413957833b729a Mon Sep 17 00:00:00 2001
From: Marcus Quinn <marcus@agentdesign.co.uk>
Date: Mon, 17 Mar 2025 01:16:38 +0000
Subject: [PATCH] Fix theme installation button and remove image zoom effect

---
 admin/css/wp-allstars-admin.css |  4 +---
 admin/js/wp-allstars-admin.js   | 20 +++++++++++++++++---
 admin/partials/theme-panel.php  |  8 ++++++++
 wp-allstars-plugin.php          |  8 ++++++--
 4 files changed, 32 insertions(+), 8 deletions(-)

diff --git a/admin/css/wp-allstars-admin.css b/admin/css/wp-allstars-admin.css
index 66a68bd..0a2c5ec 100644
--- a/admin/css/wp-allstars-admin.css
+++ b/admin/css/wp-allstars-admin.css
@@ -526,9 +526,7 @@ input:checked + .wp-toggle-slider:before {
     transition: transform 0.3s ease;
 }
 
-.theme-card:hover .theme-image img {
-    transform: scale(1.05);
-}
+/* Removed hover zoom effect */
 
 .theme-info {
     padding: 15px;
diff --git a/admin/js/wp-allstars-admin.js b/admin/js/wp-allstars-admin.js
index ff5bd32..fd35ff5 100644
--- a/admin/js/wp-allstars-admin.js
+++ b/admin/js/wp-allstars-admin.js
@@ -311,9 +311,19 @@ jQuery(document).ready(function($) {
             console.log('Installing theme via AJAX:', slug);
             $button.addClass('updating-message').text('Installing...');
             
+            // Make sure wp.updates is available
+            if (typeof wp === 'undefined' || typeof wp.updates === 'undefined' || typeof wp.updates.installTheme === 'undefined') {
+                console.error('WordPress updates API not available');
+                $button.removeClass('updating-message').text('Install');
+                alert('WordPress updates API not available. Please try again or install the theme from the Themes page.');
+                return;
+            }
+            
             // Use the WordPress core updates API for AJAX installation
             wp.updates.installTheme({
                 slug: slug,
+                // Make sure we pass the correct nonce
+                _ajax_nonce: $button.data('api-nonce') || wpAllstars.updateNonce,
                 success: function(response) {
                     console.log('Theme installed successfully:', response);
                     $button.removeClass('updating-message').addClass('updated-message').text('Installed!');
@@ -324,9 +334,13 @@ jQuery(document).ready(function($) {
                         $button.remove();
                         
                         // Create a proper activation link
-                        var activateUrl = response.activateUrl || 
-                                         'themes.php?action=activate&stylesheet=' + slug + 
-                                         '&_wpnonce=' + wp.updates.data.activateNonce;
+                        var activateUrl = '';
+                        if (response.activateUrl) {
+                            activateUrl = response.activateUrl;
+                        } else {
+                            var nonce = wp.updates.data.activateNonce || wpAllstars.nonce;
+                            activateUrl = 'themes.php?action=activate&stylesheet=' + slug + '&_wpnonce=' + nonce;
+                        }
                         
                         var adminUrl = wpAllstars.adminUrl || ajaxurl.replace('/admin-ajax.php', '/');
                         var $activateButton = $('<a class="button button-primary activate-now" href="' + adminUrl + activateUrl + '">Activate</a>');
diff --git a/admin/partials/theme-panel.php b/admin/partials/theme-panel.php
index acc63ca..40727db 100644
--- a/admin/partials/theme-panel.php
+++ b/admin/partials/theme-panel.php
@@ -43,9 +43,17 @@ if (!defined('ABSPATH')) {
                    class="button button-primary install-now" 
                    data-slug="kadence" 
                    data-name="Kadence"
+                   data-api-nonce="<?php echo esc_attr(wp_create_nonce('updates')); ?>"
+                   data-nonce="<?php echo esc_attr($nonce); ?>"
                    aria-label="<?php esc_attr_e('Install Kadence'); ?>">
                     <?php esc_html_e('Install'); ?>
                 </button>
+                <script>
+                console.log('Theme installation button initialized with:', {
+                    slug: 'kadence',
+                    nonce: '<?php echo esc_js(wp_create_nonce("updates")); ?>'
+                });
+                </script>
             <?php endif; ?>
             <script>
             jQuery(document).ready(function($) {
diff --git a/wp-allstars-plugin.php b/wp-allstars-plugin.php
index d314e35..42bde21 100644
--- a/wp-allstars-plugin.php
+++ b/wp-allstars-plugin.php
@@ -57,10 +57,13 @@ function wp_allstars_admin_assets() {
     );
 
     // Enqueue script
+    // Enqueue WordPress updates script for theme installation
+    wp_enqueue_script('updates');
+    
     wp_enqueue_script( 
         'wp-allstars-admin', 
         plugins_url( 'admin/js/wp-allstars-admin.js', __FILE__ ), 
-        array('jquery'), 
+        array('jquery', 'updates'), 
         WP_ALLSTARS_VERSION, 
         true 
     );
@@ -69,7 +72,8 @@ function wp_allstars_admin_assets() {
     $ajax_data = array(
         'ajaxurl' => admin_url( 'admin-ajax.php' ),
         'adminUrl' => admin_url(),
-        'nonce'   => wp_create_nonce( 'wp-allstars-nonce' )
+        'nonce'   => wp_create_nonce( 'wp-allstars-nonce' ),
+        'updateNonce' => wp_create_nonce( 'updates' )
     );
     wp_localize_script( 'wp-allstars-admin', 'wpAllstars', $ajax_data );
 }