feat: Implement version switching functionality in plugin settings #251

imantsk · 2025-08-22T08:56:39Z

🔄 Version Switching Functionality Implementation

This PR introduces comprehensive version switching functionality in the Code Snippets plugin settings, enabling users to safely switch between different plugin versions directly from the WordPress admin interface.

✨ Features Implemented

🎛️ New Settings Section

New "Version" Tab: Added to plugin settings (Settings > Snippets Settings > Version)
Current Version Display: Shows active version with distinctive styling
Available Versions: Fetches and displays all versions from WordPress.org repository

🔄 Version Switching Interface

Smart Dropdown: Lists available versions with current version highlighted
One-Click Switching: Secure version change execution with validation
Real-time Feedback: Loading states, progress indicators, success/error messages
Safety Features:
- ⚠️ Compatibility warnings with backup recommendations
- 🔒 Progress tracking prevents concurrent operations
- 🔄 Automatic page refresh after successful switches

🚀 Performance & Caching

Intelligent Caching: 1-hour cache for version data (reduces API calls)
Manual Refresh: Force cache updates with dedicated button
Auto-cleanup: Cache cleared after successful version switches

🔐 Security & Safety

WordPress Standards: Nonce verification, capability checks (update_plugins)
Progress Locking: Transient-based system prevents concurrent switches
Error Handling: Comprehensive logging with user-friendly messages
Core Integration: Uses WordPress upgrader for maximum reliability

🎨 User Experience

Responsive Design: Mobile and desktop optimized
Visual Feedback: Clear states (loading, success, error, warning)
Intuitive Flow: Dropdown → Warning → Confirmation → Progress → Success
Accessibility: Proper ARIA labels and keyboard navigation

🧪 Testing Steps

📋 Prerequisites

WordPress admin access with plugin update permissions
Active Code Snippets plugin installation
Hosting environment that allows plugin updates

1️⃣ Settings Access

Passed

# Test Steps:
1. Navigate to "Snippets > Settings"
2. Click "Version" tab
3. Verify current version display
4. Confirm dropdown population

Expected: Clean interface with current version highlighted, dropdown populated with available versions.

2️⃣ Version Selection Flow

Passed

# Test Steps:
1. Select different version from dropdown
2. Observe button state changes
3. Check warning message appearance
4. Verify current version remains disabled

Expected: Switch button enables, warning appears, current version shows "(Current)" label.

3️⃣ Cache Refresh Mechanism

Passed

# Test Steps:
1. Click "Refresh Available Versions"
2. Monitor button text changes
3. Wait for completion
4. Verify page reload

Expected: Button shows "Refreshing..." → "Refreshed!" → page reloads with fresh data.

4️⃣ Successful Version Switch

Passed

# Test Steps:
1. Select stable previous version
2. Click "Switch Version"  
3. Monitor progress messages
4. Wait for completion
5. Verify version change

Expected:
- Button → "Switching..." (disabled)
- Progress message appears
- Success confirmation
- Auto-refresh after 3 seconds
- New version displayed

5️⃣ Error Handling

Passed

# Test Network Issues:
1. Disable internet connection
2. Attempt version switch
3. Verify error handling

# Test Permission Issues:  
1. Test with non-admin user
2. Attempt access
3. Verify permission messages

Expected: Graceful error handling, no fatal errors, clear user guidance.

6️⃣ Concurrent Operation Prevention

Passed

# Test Steps:
1. Open two browser tabs
2. Start switch in tab 1
3. Immediately try switch in tab 2

Expected: Second attempt blocked with "switch in progress" message.

7️⃣ Input Validation

Passed

# Test Steps:
1. Use dev tools to modify dropdown values
2. Submit invalid version
3. Verify rejection

Expected: Server-side validation rejects invalid versions with error message.

8️⃣ CSRF Protection

Passed

# Test Steps:  
1. Submit AJAX request without nonce
2. Verify security rejection

Expected: Request blocked with "Security check failed" message.

📊 Expected Results

✅ Success Indicators

Immediate Feedback: Visual confirmation of all user actions
Progress Transparency: Users always know current operation status
State Persistence: Interface reflects actual plugin state
Error Recovery: Failed operations don't leave system in bad state

⚠️ Error Handling

Graceful Degradation: Errors don't break interface
Actionable Messages: Users get clear next steps
Safe Fallbacks: No partial installs or corrupted states
Debug Information: Errors logged for troubleshooting

🔍 Code Review Focus Areas

📁 File Changes

src/php/settings/version-switch.php: Complete version switching logic
src/css/settings.scss: UI styling and responsive design
Settings integration: Proper WordPress settings API usage

⚠️ Known Limitations

Requires internet connectivity for version fetching
Depends on WordPress.org API availability
File system write permissions needed for upgrades
Some hosting providers may block plugin modifications

CarolinaOP · 2025-08-28T22:39:42Z

I followed the testing steps, but at step 4 the version didn’t switch. The version I selected was downloaded, and I received positive feedback confirming the switch. However, the new version did not replace the previous one — it was only downloaded, that plugin version was listed in the plugins but was disabled, keeping the previous version activated.

CarolinaOP · 2025-08-29T10:48:49Z

https://www.loom.com/share/700dff3c16024c4f9867cced02d5e0f6?sid=0c00682e-5545-4bb0-a677-3feeb66d0ad2

github-actions · 2025-08-29T12:26:36Z

Download and install

📦 code-snippets.zip

imantsk · 2025-08-29T12:44:41Z

@CarolinaOP
the behaviour you reported was caused by how the build process for pull requests was setup.
The plugin zip file is expected to contain a sub folder with the correct slug of the plugin to install or override, however our previous build process was putting all the plugins files directly resulting in the behavior experienced.
More precisely this probably was caused by the fact that the file to download is always simply code-snippets.zip and when downloading multiple file with the same name, most browsers append a (1) to the end of the file name.
This browser behaviour, combined with the lack of the sub folder in the zip file, causes WordPress to install the plugin in wp-content/plugins/code-snippets-1 (following the zip file name).
Further when testing the switch version feature provided in this PR , the implementation does install the plugin but with its original slug/folder name resulting in having two plugins installed, and one not yet activated, as you showcase in the screen recording.

I have now adjusted our build action workflow and this shouldnt be an issue. please proceed with testing further :)

CarolinaOP · 2025-08-29T17:42:29Z

Review completed — everything is working well overall, though the error messages could be refined.

louiswol94 · 2025-09-03T20:44:47Z

src/css/settings.scss

+	.notice {
+		&.notice-success {
+			border-left-color: #00a32a;
+		}
+
+		&.notice-error {
+			border-left-color: #d63638;
+		}
+
+		&.notice-warning {
+			border-left-color: #dba617;
+		}
+
+		&.notice-info {
+			border-left-color: #72aee6;
+		}
+	}


Not a big deal, but some of the classes can be more nested.

.notice { &.notice { &-success{} &-error{} } }

louiswol94 · 2025-09-03T20:47:44Z

src/php/settings/version-switch.php

+const VERSION_CACHE_DURATION = HOUR_IN_SECONDS;
+const PROGRESS_TIMEOUT = 5 * MINUTE_IN_SECONDS;
+const WORDPRESS_API_ENDPOINT = 'https://api.wordpress.org/plugins/info/1.2/?action=plugin_information&slug=code-snippets';
+


Can we perhaps move all the code in this file to a class?

louiswol94 · 2025-09-03T20:48:59Z

src/php/settings/version-switch.php

+/**
+ * Check if a version switch is in progress
+ *
+ * @return bool True if switch is in progress
+ */


I would remove all these comments. For example is_version_switch_in_progress() is readable enough, and the function signature already declares the return type as bool.

louiswol94 · 2025-09-03T20:50:47Z

src/php/settings/version-switch.php

+	// Check if already on target version
+	if ( get_current_version() === $target_version ) {


Suggested change

// Check if already on target version

if ( get_current_version() === $target_version ) {

$is_already_on_target_version = get_current_version() === $target_version;

if ( $is_already_on_target_version ) {

Please remove all the redundant comments from the file.

louiswol94 · 2025-09-03T20:52:41Z

src/php/settings/version-switch.php

+	<script type="text/javascript">
+	jQuery(document).ready(function($) {
+		var currentVersion = '<?php echo esc_js( $current_version ); ?>';
+		var $button = $('#switch-version-btn');
+		var $dropdown = $('#target_version');
+		var $result = $('#version-switch-result');
+
+		// Handle dropdown changes - enable/disable button and show/hide warning
+		$dropdown.on('change', function() {
+			var selectedVersion = $(this).val();
+
+			if (!selectedVersion || selectedVersion === currentVersion) {
+				// Current version or no selection - disable button and hide warning
+				$button.prop('disabled', true);
+				$('#version-switch-warning').hide();
+			} else {
+				// Different version selected - enable button and show warning
+				$button.prop('disabled', false);
+				$('#version-switch-warning').show();
+			}
+		});
+
+		$button.on('click', function() {
+			var targetVersion = $dropdown.val();
+
+			if (!targetVersion || targetVersion === currentVersion) {
+				$result.removeClass('notice-success notice-error').addClass('notice-warning')
+					.html('<p><?php esc_html_e( 'Please select a different version to switch to.', 'code-snippets' ); ?></p>')
+					.show();
+				return;
+			}
+
+			// Disable button and show loading
+			$button.prop('disabled', true).text('<?php esc_html_e( 'Switching...', 'code-snippets' ); ?>');
+			$result.removeClass('notice-success notice-error notice-warning').addClass('notice-info')
+				.html('<p><?php esc_html_e( 'Processing version switch. Please wait...', 'code-snippets' ); ?></p>')
+				.show();
+
+			// Make AJAX request
+			$.post(ajaxurl, {
+				action: 'code_snippets_switch_version',
+				target_version: targetVersion,
+				nonce: '<?php echo esc_js( wp_create_nonce( 'code_snippets_version_switch' ) ); ?>'
+			})
+			.done(function(response) {
+				if (response.success) {
+					$result.removeClass('notice-info notice-error').addClass('notice-success')
+						.html('<p>' + response.data.message + '</p>');
+
+					// Refresh page after 3 seconds
+					setTimeout(function() {
+						window.location.reload();
+					}, 3000);
+				} else {
+					$result.removeClass('notice-info notice-success').addClass('notice-error')
+						.html('<p>' + response.data.message + '</p>');
+					$button.prop('disabled', false).text('<?php esc_html_e( 'Switch Version', 'code-snippets' ); ?>');
+				}
+			})
+			.fail(function() {
+				$result.removeClass('notice-info notice-success').addClass('notice-error')
+					.html('<p><?php esc_html_e( 'An error occurred while switching versions. Please try again.', 'code-snippets' ); ?></p>');
+				$button.prop('disabled', false).text('<?php esc_html_e( 'Switch Version', 'code-snippets' ); ?>');
+			});
+		});
+	});
+	</script>


Can we rather add this script to a separate JS file and enqueue it?

Do we have to use jQuery?

Use let/const instead of var

imantsk added 6 commits August 22, 2025 11:54

feat: Add version switch settings file to plugin initialization

d263c52

feat: add render callback

2dce939

feat: add version switch settings

cb27853

feat: add version switch section to settings

cc8faf9

feat: implement version switching functionality for the plugin

690d756

feat: add version switch styles and update sections in settings

fcd6831

imantsk added the build Adding this label will trigger the zip build action label Aug 22, 2025

imantsk added 5 commits August 22, 2025 20:19

feat: refactor version switch functions and improve error handling

2e54814

feat: move version warning to separate field

5af841c

feat: enhance version switch UI with warning and button state management

f6225ab

feat: update version switch button styles and add warning box styling

1c3f8cd

fix: remove unused function import in version switch

9c23fee

codesnippetspro deleted a comment from github-actions bot Aug 22, 2025

code-snippets-bot added build Adding this label will trigger the zip build action and removed build Adding this label will trigger the zip build action labels Aug 22, 2025

code-snippets-bot requested review from sheabunge, louiswol94 and CarolinaOP August 22, 2025 19:03

code-snippets-bot self-assigned this Aug 22, 2025

codesnippetspro deleted a comment from github-actions bot Aug 29, 2025

imantsk added build Adding this label will trigger the zip build action and removed build Adding this label will trigger the zip build action labels Aug 29, 2025

Merge branch 'core' into feat/version-switch

6cee314

codesnippetspro deleted a comment from github-actions bot Aug 29, 2025

imantsk removed the build Adding this label will trigger the zip build action label Aug 29, 2025

imantsk assigned imantsk and unassigned code-snippets-bot Aug 29, 2025

imantsk added the build Adding this label will trigger the zip build action label Aug 29, 2025

louiswol94 reviewed Sep 3, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat: Implement version switching functionality in plugin settings #251

feat: Implement version switching functionality in plugin settings #251

Uh oh!

imantsk commented Aug 22, 2025 •

edited by CarolinaOP

Loading

Uh oh!

CarolinaOP commented Aug 28, 2025

Uh oh!

CarolinaOP commented Aug 29, 2025

Uh oh!

github-actions bot commented Aug 29, 2025 •

edited

Loading

Uh oh!

imantsk commented Aug 29, 2025

Uh oh!

CarolinaOP commented Aug 29, 2025

Uh oh!

louiswol94 Sep 3, 2025

Uh oh!

louiswol94 Sep 3, 2025

Uh oh!

louiswol94 Sep 3, 2025

Uh oh!

louiswol94 Sep 3, 2025

Uh oh!

louiswol94 Sep 3, 2025

Uh oh!

Uh oh!

		// Check if already on target version
		if ( get_current_version() === $target_version ) {

feat: Implement version switching functionality in plugin settings #251

Are you sure you want to change the base?

feat: Implement version switching functionality in plugin settings #251

Uh oh!

Conversation

imantsk commented Aug 22, 2025 • edited by CarolinaOP Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🔄 Version Switching Functionality Implementation

✨ Features Implemented

🎛️ New Settings Section

🔄 Version Switching Interface

🚀 Performance & Caching

🔐 Security & Safety

🎨 User Experience

🧪 Testing Steps

📋 Prerequisites

1️⃣ Settings Access

2️⃣ Version Selection Flow

3️⃣ Cache Refresh Mechanism

4️⃣ Successful Version Switch

5️⃣ Error Handling

6️⃣ Concurrent Operation Prevention

7️⃣ Input Validation

8️⃣ CSRF Protection

📊 Expected Results

✅ Success Indicators

⚠️ Error Handling

🔍 Code Review Focus Areas

📁 File Changes

⚠️ Known Limitations

Uh oh!

CarolinaOP commented Aug 28, 2025

Uh oh!

CarolinaOP commented Aug 29, 2025

Uh oh!

github-actions bot commented Aug 29, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Download and install

Uh oh!

imantsk commented Aug 29, 2025

Uh oh!

CarolinaOP commented Aug 29, 2025

Uh oh!

louiswol94 Sep 3, 2025

Choose a reason for hiding this comment

Uh oh!

louiswol94 Sep 3, 2025

Choose a reason for hiding this comment

Uh oh!

louiswol94 Sep 3, 2025

Choose a reason for hiding this comment

Uh oh!

louiswol94 Sep 3, 2025

Choose a reason for hiding this comment

Uh oh!

louiswol94 Sep 3, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

imantsk commented Aug 22, 2025 •

edited by CarolinaOP

Loading

github-actions bot commented Aug 29, 2025 •

edited

Loading