refactor: dashboard optimization status

[RaduCristianPopescu]

All Submissions:

• Have you followed the Optimole Contributing guideline?
• Does your code follow the WordPress' coding standards?
• Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

The user can now interact with the optimization status dashboard using:

• Image Handling: Redirects to the settings page/enables the setting.
• Smart Lazy-Loading, Image Scaling: Programmatically disable/enable from status.

Closes https://github.com/Codeinwp/optimole-service/issues/1490

Testing

• If image handling is disabled, Lazy & Scaling are also disabled, along with the hidden button.
• Scaling depends on Lazy; if Scaling is enabled but you disable Lazy, Scaling will also be disabled.
• If Lazy is disabled, when enabling, it will not modify the Scaling.

2025-10-03_13-35-20.mp4

Other information:

• Have you added an explanation of what your changes do and why you'd like us to include them?
• Have you written new tests for your changes, as applicable?
• Have you successfully ran tests with your changes locally?

[pirate-bot]

Plugin build for 4cc2151 is ready 🛎️!

• Download build
• Download dev

[Copilot]

Pull Request Overview

This PR adds interactive functionality to the optimization status dashboard, allowing users to directly enable/disable features and navigate to settings. The changes introduce button controls for managing optimization features like image handling, smart lazy-loading, and image scaling.

• Adds interactive buttons to optimization status items for direct feature control
• Implements logic to handle feature dependencies and state management
• Integrates navigation to settings page for image handling configuration

Reviewed Changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.

File	Description
inc/admin.php	Adds new localized strings for button labels (disable, enable, manage, block)
assets/src/dashboard/parts/connected/index.js	Passes additional props to Sidebar component for state management
assets/src/dashboard/parts/connected/Sidebar.js	Updates Sidebar to pass state management props to OptimizationStatus
assets/src/dashboard/parts/connected/OptimizationStatus.js	Major refactor adding interactive buttons and feature toggle logic

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[Copilot]

Mutating the status.active property directly modifies the original array item, which can cause unexpected behavior in React. This mutation should be avoided as it modifies the state outside of React's state management system.

Suggested change

	status.active = ! status.active;
	// Do not mutate status.active directly; handled by directUpdate below.

[Copilot]

The word 'Scalling' should be 'Scaling' (single 'l').

Suggested change

	'statusTitle3' => __( 'Image Scalling', 'optimole-wp' ),
	'statusTitle3' => __( 'Image Scaling', 'optimole-wp' ),

[Soare-Robert-Daniel]

@ineagu, if the Image Handling is disabled, lazy loading and scaling are no longer available. How should the flow be in this case?

Currently, if Image Handling is not available, Radu has blocked the other two options. It is ok, or should it be shown as Disable for lazy and scaling, and if they are activated, the Image Handling would also be activated?

Snippet from the video

[ineagu]

In the UI you showed, I won't show Block there, but we can simply leave that part empty, it's clear from the x icon on the left that they are disabled and you can't do anything

[pirate-bot]

🎉 This PR is included in version 4.1.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀