Improve plugin browser: - Add Tutor LMS to LMS category - Move Free Plugins tab after Advanced - Fix loading overlay coverage - Add immediate tab loading with loading state - Implement plugin list caching (12 hours) - Add minimum loading time for better UX

This commit is contained in:
Marcus Quinn
2025-03-14 03:46:51 +00:00
parent 20bfd2b976
commit c771c5bb0f
2 changed files with 77 additions and 14 deletions

View File

@ -197,13 +197,13 @@
/* Loading overlay */ /* Loading overlay */
.wpa-loading-overlay { .wpa-loading-overlay {
position: absolute; position: fixed;
top: 0; top: 32px;
left: 0; left: 160px;
right: 0; right: 0;
bottom: 0; bottom: 0;
background: rgba(255, 255, 255, 0.8); background: rgba(255, 255, 255, 0.9);
z-index: 100; z-index: 100000;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -211,5 +211,10 @@
.wp-list-table-container { .wp-list-table-container {
position: relative; position: relative;
min-height: 200px; min-height: 400px;
}
.wp-list-table-container .spinner {
float: none;
margin: 0;
} }

View File

@ -58,11 +58,28 @@ function wpa_superstar_get_recommended_plugins() {
'client-booking' 'client-booking'
), ),
'lms' => array( 'lms' => array(
// Add LMS plugins when needed 'tutor'
) )
); );
} }
// Add transient caching for plugin data
function wpa_superstar_get_cached_plugins($category) {
$cache_key = 'wpa_superstar_plugins_' . $category;
$cached_data = get_transient($cache_key);
if ($cached_data !== false) {
return $cached_data;
}
return false;
}
function wpa_superstar_set_cached_plugins($category, $data) {
$cache_key = 'wpa_superstar_plugins_' . $category;
set_transient($cache_key, $data, 12 * HOUR_IN_SECONDS);
}
// Filter plugins API to show only our recommended plugins // Filter plugins API to show only our recommended plugins
function wpa_superstar_plugins_api_result($res, $action, $args) { function wpa_superstar_plugins_api_result($res, $action, $args) {
// Only filter if we're on our plugin page and it's a plugin query // Only filter if we're on our plugin page and it's a plugin query
@ -75,6 +92,13 @@ function wpa_superstar_plugins_api_result($res, $action, $args) {
// Get the current category // Get the current category
$category = isset($_GET['category']) ? sanitize_key($_GET['category']) : 'minimal'; $category = isset($_GET['category']) ? sanitize_key($_GET['category']) : 'minimal';
// Try to get cached data first
$cached_data = wpa_superstar_get_cached_plugins($category);
if ($cached_data !== false) {
return $cached_data;
}
$recommended_plugins = wpa_superstar_get_recommended_plugins(); $recommended_plugins = wpa_superstar_get_recommended_plugins();
// Check if category exists and has plugins // Check if category exists and has plugins
@ -126,9 +150,11 @@ function wpa_superstar_plugins_api_result($res, $action, $args) {
'plugins' => $plugins 'plugins' => $plugins
); );
// Cache the results
wpa_superstar_set_cached_plugins($category, $res);
return $res; return $res;
} catch (Exception $e) { } catch (Exception $e) {
// If something goes wrong, return original results
return $res; return $res;
} }
} }
@ -163,15 +189,15 @@ function wpa_superstar_settings_page() {
<div class="wpa-settings-container"> <div class="wpa-settings-container">
<div class="wpa-superstar-nav"> <div class="wpa-superstar-nav">
<h2 class="nav-tab-wrapper"> <h2 class="nav-tab-wrapper">
<a href="?page=wpa-superstar&tab=recommended" class="nav-tab <?php echo $active_tab == 'recommended' ? 'nav-tab-active' : ''; ?>">
<?php esc_html_e('Free Plugins', 'wpa-superstar'); ?>
</a>
<a href="?page=wpa-superstar&tab=general" class="nav-tab <?php echo $active_tab == 'general' ? 'nav-tab-active' : ''; ?>"> <a href="?page=wpa-superstar&tab=general" class="nav-tab <?php echo $active_tab == 'general' ? 'nav-tab-active' : ''; ?>">
<?php esc_html_e('General', 'wpa-superstar'); ?> <?php esc_html_e('General', 'wpa-superstar'); ?>
</a> </a>
<a href="?page=wpa-superstar&tab=advanced" class="nav-tab <?php echo $active_tab == 'advanced' ? 'nav-tab-active' : ''; ?>"> <a href="?page=wpa-superstar&tab=advanced" class="nav-tab <?php echo $active_tab == 'advanced' ? 'nav-tab-active' : ''; ?>">
<?php esc_html_e('Advanced', 'wpa-superstar'); ?> <?php esc_html_e('Advanced', 'wpa-superstar'); ?>
</a> </a>
<a href="?page=wpa-superstar&tab=recommended" class="nav-tab <?php echo $active_tab == 'recommended' ? 'nav-tab-active' : ''; ?>">
<?php esc_html_e('Free Plugins', 'wpa-superstar'); ?>
</a>
</h2> </h2>
</div> </div>
@ -197,7 +223,7 @@ function wpa_superstar_settings_page() {
</div> </div>
<div class="wp-list-table-container"> <div class="wp-list-table-container">
<div class="wpa-loading-overlay" style="display: none;"> <div class="wpa-loading-overlay">
<span class="spinner is-active"></span> <span class="spinner is-active"></span>
</div> </div>
<?php <?php
@ -209,9 +235,41 @@ function wpa_superstar_settings_page() {
<script> <script>
jQuery(document).ready(function($) { jQuery(document).ready(function($) {
// Show loading state when changing categories var loadingStartTime;
$('.wpa-plugin-filters a').on('click', function() {
// Show loading overlay immediately
$('.wpa-loading-overlay').show(); $('.wpa-loading-overlay').show();
loadingStartTime = Date.now();
// Function to ensure minimum loading time
function ensureMinLoadingTime(callback) {
var currentTime = Date.now();
var elapsed = currentTime - loadingStartTime;
var minLoadingTime = 500; // minimum loading time in milliseconds
if (elapsed < minLoadingTime) {
setTimeout(function() {
callback();
}, minLoadingTime - elapsed);
} else {
callback();
}
}
// Hide loading overlay when content is loaded
var checkLoading = setInterval(function() {
if ($('.plugin-card').length > 0) {
ensureMinLoadingTime(function() {
$('.wpa-loading-overlay').fadeOut();
});
clearInterval(checkLoading);
}
}, 100);
// Show loading state when changing categories
$('.wpa-plugin-filters a').on('click', function(e) {
loadingStartTime = Date.now();
$('.wpa-loading-overlay').fadeIn();
}); });
}); });
</script> </script>