From 1fdbfe8046dec676da2a79018f6454856cedef2b Mon Sep 17 00:00:00 2001 From: Filip Ilic Date: Mon, 14 Apr 2025 17:01:39 +0200 Subject: [PATCH 1/6] check remote api status --- assets/css/settings-page.css | 66 +++++++++++++++++ assets/images/icon_server.svg | 3 + assets/js/ajax-request.js | 4 +- assets/js/settings-page.js | 109 ++++++++++++++++++++++++++++- classes/admin/class-enqueue.php | 2 + classes/admin/class-page.php | 5 +- views/admin-page-settings.php | 1 + views/page-settings/api-status.php | 53 ++++++++++++++ views/page-settings/pages.php | 29 +++++--- 9 files changed, 258 insertions(+), 14 deletions(-) create mode 100644 assets/images/icon_server.svg create mode 100644 views/page-settings/api-status.php diff --git a/assets/css/settings-page.css b/assets/css/settings-page.css index 2a1e0c892..6fc0ecbb0 100644 --- a/assets/css/settings-page.css +++ b/assets/css/settings-page.css @@ -245,3 +245,69 @@ max-width: calc(100% - 2rem); } } + +.prpl-api-status-wrapper { + display: flex; + flex-direction: column; + gap: 1rem; + + .prpl-api-status-controls { + display: flex; + align-items: center; + gap: 0.5rem; + } + + .prpl-api-status-response-wrapper { + display: flex; + align-items: center; + gap: 0.5rem; + + svg { + width: 1rem; + height: 1rem; + } + + .prpl-api-status-icon-ok, + .prpl-api-status-icon-error, + .prpl-api-status-icon-spinner, + .prpl-api-status-text { + display: none; + } + + &.prpl-api-status-checking { + + .prpl-api-status-icon-spinner { + display: inline-block; + } + } + + &.prpl-api-status-ok { + + .prpl-api-status-icon-spinner { + display: none; + } + + .prpl-api-status-icon-ok, + .prpl-api-status-text { + display: inline-block; + } + } + + &.prpl-api-status-error { + + .prpl-api-status-icon-spinner { + display: none; + } + + .prpl-api-status-icon-error, + .prpl-api-status-text { + display: inline-block; + } + } + } + + input { + width: 20rem; + max-width: calc(100% - 2rem); + } +} diff --git a/assets/images/icon_server.svg b/assets/images/icon_server.svg new file mode 100644 index 000000000..332eb1c9c --- /dev/null +++ b/assets/images/icon_server.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/js/ajax-request.js b/assets/js/ajax-request.js index c7c510949..56e3a9a94 100644 --- a/assets/js/ajax-request.js +++ b/assets/js/ajax-request.js @@ -14,12 +14,14 @@ const progressPlannerAjaxRequest = ( { url, data } ) => { http.open( 'POST', url, true ); http.onreadystatechange = () => { let response; + try { response = JSON.parse( http.response ); } catch ( e ) { if ( http.readyState === 4 && http.status !== 200 ) { console.warn( http, e ); - return http.response; + // Reject the promise with the response. + reject( response ); } } diff --git a/assets/js/settings-page.js b/assets/js/settings-page.js index b763b7217..b5dfb4bd8 100644 --- a/assets/js/settings-page.js +++ b/assets/js/settings-page.js @@ -1,10 +1,10 @@ -/* global alert, prplDocumentReady */ +/* global alert, prplDocumentReady, progressPlannerSettingsPage, progressPlannerAjaxRequest, prplL10n */ /* * Settings Page * * A script to handle the settings page. * - * Dependencies: progress-planner/document-ready, wp-util + * Dependencies: progress-planner/document-ready, wp-util, progress-planner/ajax-request, progress-planner/l10n */ const prplTogglePageSelectorSettingVisibility = function ( page, value ) { const itemRadiosWrapperEl = document.querySelector( @@ -83,3 +83,108 @@ prplDocumentReady( function () { .getElementById( 'prpl-settings' ) .addEventListener( 'submit', prplFormSubmit ); } ); + +/** + * API Status Manager + * Handles the display and state of the API status check + */ +class APIStatusManager { + /** + * @param {string} wrapperSelector - The selector for the status wrapper element + */ + constructor( wrapperSelector ) { + this.wrapper = document.querySelector( wrapperSelector ); + } + + /** + * Update the status text content + * @param {string} text - The text to display + */ + updateStatusText( text ) { + const textElement = this.wrapper?.querySelector( + '.prpl-api-status-text' + ); + if ( textElement ) { + textElement.textContent = text; + } + } + + /** + * Update the status classes + * @param {string} status - The status class to add ('ok', 'error', 'checking') + */ + updateStatusClasses( status ) { + if ( ! this.wrapper ) { + return; + } + + this.wrapper.classList.remove( + 'prpl-api-status-ok', + 'prpl-api-status-error', + 'prpl-api-status-checking' + ); + this.wrapper.classList.add( `prpl-api-status-${ status }` ); + } + + /** + * Handle API response + * @param {Object} response - The API response + */ + handleResponse( response ) { + if ( response.status === 'ok' && response.nonce ) { + this.updateStatusText( prplL10n( 'remoteAPIStatusOk' ) ); + this.updateStatusClasses( 'ok' ); + } else { + this.updateStatusText( + response?.message || prplL10n( 'remoteAPIStatusError' ) + ); + this.updateStatusClasses( 'error' ); + } + } + + /** + * Handle API error + * @param {Error} error - The error object + */ + handleError( error ) { + this.updateStatusText( + error?.message || prplL10n( 'remoteAPIStatusError' ) + ); + this.updateStatusClasses( 'error' ); + } + + /** + * Check the API status + */ + checkStatus() { + if ( ! this.wrapper ) { + return; + } + + this.updateStatusClasses( 'checking' ); + + progressPlannerAjaxRequest( { + url: progressPlannerSettingsPage.onboardNonceURL, + data: { + site: progressPlannerSettingsPage.siteUrl, + }, + } ) + .then( ( response ) => this.handleResponse( response ) ) + .catch( ( error ) => this.handleError( error ) ); + } +} + +// Add click handler for API status check button +prplDocumentReady( () => { + // Initialize the API status manager + const apiStatusManager = new APIStatusManager( + '.prpl-api-status-response-wrapper' + ); + + const statusButton = document.getElementById( 'prpl-setting-api-status' ); + if ( statusButton ) { + statusButton.addEventListener( 'click', () => + apiStatusManager.checkStatus() + ); + } +} ); diff --git a/classes/admin/class-enqueue.php b/classes/admin/class-enqueue.php index 180258a5b..0390201c6 100644 --- a/classes/admin/class-enqueue.php +++ b/classes/admin/class-enqueue.php @@ -341,6 +341,8 @@ public function get_localized_strings() { 'video' => \esc_html__( 'Video', 'progress-planner' ), 'watchVideo' => \esc_html__( 'Watch video', 'progress-planner' ), 'disabledRRCheckboxTooltip' => \esc_html__( 'Don\'t worry! This task will be checked off automatically when you\'ve completed it.', 'progress-planner' ), + 'remoteAPIStatusOk' => \esc_html__( 'API is accessible', 'progress-planner' ), + 'remoteAPIStatusError' => \esc_html__( 'API is not accessible', 'progress-planner' ), ]; } } diff --git a/classes/admin/class-page.php b/classes/admin/class-page.php index 1ee6f7132..7297bcc0f 100644 --- a/classes/admin/class-page.php +++ b/classes/admin/class-page.php @@ -195,7 +195,10 @@ public function enqueue_scripts() { [ 'name' => 'progressPlannerSettingsPage', 'data' => [ - 'siteUrl' => \get_site_url(), + 'siteUrl' => \get_site_url(), + 'onboardNonceURL' => \progress_planner()->get_utils__onboard()->get_remote_nonce_url(), + 'onboardAPIUrl' => \progress_planner()->get_utils__onboard()->get_remote_url(), + 'ajaxUrl' => \admin_url( 'admin-ajax.php' ), ], ] ); diff --git a/views/admin-page-settings.php b/views/admin-page-settings.php index 19febb56b..c3a483efc 100644 --- a/views/admin-page-settings.php +++ b/views/admin-page-settings.php @@ -36,6 +36,7 @@ the_view( 'page-settings/pages.php' ); ?> the_view( 'page-settings/settings.php' ); ?> the_view( 'page-settings/license.php' ); ?> + the_view( 'page-settings/api-status.php' ); ?> diff --git a/views/page-settings/api-status.php b/views/page-settings/api-status.php new file mode 100644 index 000000000..6de10459c --- /dev/null +++ b/views/page-settings/api-status.php @@ -0,0 +1,53 @@ + + +
+
+

+ + the_asset( 'images/icon_server.svg' ); ?> + + + + +

+
+ +
+ + + + + the_asset( 'images/icon_check_circle.svg' ); ?> + + + the_asset( 'images/icon_exclamation_circle.svg' ); ?> + + + + + +
+
+
+
diff --git a/views/page-settings/pages.php b/views/page-settings/pages.php index 1fcc30bdd..146e6e556 100644 --- a/views/page-settings/pages.php +++ b/views/page-settings/pages.php @@ -9,6 +9,8 @@ if ( ! defined( 'ABSPATH' ) ) { exit; } + +$prpl_pages = progress_planner()->get_admin__page_settings()->get_settings(); ?>
@@ -21,15 +23,22 @@ -

- -

-
- get_admin__page_settings()->get_settings() as $prpl_setting ) { - \progress_planner()->the_view( "setting/{$prpl_setting['type']}.php", [ 'prpl_setting' => $prpl_setting ] ); - } - ?> -
+ + +

+ +

+
+ get_admin__page_settings()->get_settings() as $prpl_setting ) { + \progress_planner()->the_view( "setting/{$prpl_setting['type']}.php", [ 'prpl_setting' => $prpl_setting ] ); + } + ?> +
+ +

+ +

+
From dbd2e8e483d156632b963f36d14cd6c5e09a1f53 Mon Sep 17 00:00:00 2001 From: Filip Ilic Date: Mon, 14 Apr 2025 17:19:32 +0200 Subject: [PATCH 2/6] use variable --- views/page-settings/pages.php | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/views/page-settings/pages.php b/views/page-settings/pages.php index 146e6e556..1745e8c00 100644 --- a/views/page-settings/pages.php +++ b/views/page-settings/pages.php @@ -10,7 +10,7 @@ exit; } -$prpl_pages = progress_planner()->get_admin__page_settings()->get_settings(); +$prpl_pages = \progress_planner()->get_admin__page_settings()->get_settings(); ?>
@@ -30,7 +30,7 @@

get_admin__page_settings()->get_settings() as $prpl_setting ) { + foreach ( $prpl_pages as $prpl_setting ) { \progress_planner()->the_view( "setting/{$prpl_setting['type']}.php", [ 'prpl_setting' => $prpl_setting ] ); } ?> From 55daa18aef01f017644c6705bd2d14820d17ae05 Mon Sep 17 00:00:00 2001 From: Filip Ilic Date: Mon, 14 Apr 2025 17:21:41 +0200 Subject: [PATCH 3/6] add "Save settings" task only if there are pages --- .../local-tasks/providers/one-time/class-settings-saved.php | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/classes/suggested-tasks/local-tasks/providers/one-time/class-settings-saved.php b/classes/suggested-tasks/local-tasks/providers/one-time/class-settings-saved.php index d312f104a..a4c763eb5 100644 --- a/classes/suggested-tasks/local-tasks/providers/one-time/class-settings-saved.php +++ b/classes/suggested-tasks/local-tasks/providers/one-time/class-settings-saved.php @@ -63,6 +63,7 @@ public function get_description() { * @return bool */ public function should_add_task() { - return false === \get_option( 'progress_planner_pro_license_key', false ); + $prpl_pages = \progress_planner()->get_admin__page_settings()->get_settings(); + return false === \get_option( 'progress_planner_pro_license_key', false ) && ! empty( $prpl_pages ); } } From ea824ac75b87e5387ae2f017875b9fc8a959e82e Mon Sep 17 00:00:00 2001 From: Filip Ilic Date: Mon, 14 Apr 2025 17:40:15 +0200 Subject: [PATCH 4/6] Settings_Saved::is_task_completed --- .../providers/one-time/class-settings-saved.php | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/classes/suggested-tasks/local-tasks/providers/one-time/class-settings-saved.php b/classes/suggested-tasks/local-tasks/providers/one-time/class-settings-saved.php index a4c763eb5..156a3e446 100644 --- a/classes/suggested-tasks/local-tasks/providers/one-time/class-settings-saved.php +++ b/classes/suggested-tasks/local-tasks/providers/one-time/class-settings-saved.php @@ -63,7 +63,15 @@ public function get_description() { * @return bool */ public function should_add_task() { - $prpl_pages = \progress_planner()->get_admin__page_settings()->get_settings(); - return false === \get_option( 'progress_planner_pro_license_key', false ) && ! empty( $prpl_pages ); + return false === \get_option( 'progress_planner_pro_license_key', false ); + } + + /** + * Check if the task is completed. + * + * @return bool + */ + public function is_task_completed() { + return false !== \get_option( 'progress_planner_pro_license_key', false ); } } From 5da4aa5f01bbc88fee191284410da0314b5259f9 Mon Sep 17 00:00:00 2001 From: Filip Ilic Date: Tue, 15 Apr 2025 09:37:01 +0200 Subject: [PATCH 5/6] adjust note --- views/page-settings/pages.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/views/page-settings/pages.php b/views/page-settings/pages.php index 1745e8c00..9e0f5a24a 100644 --- a/views/page-settings/pages.php +++ b/views/page-settings/pages.php @@ -37,7 +37,7 @@

- +

From aa31bc0418642a8784bb1c4882578df7ef8f4483 Mon Sep 17 00:00:00 2001 From: Filip Ilic Date: Tue, 15 Apr 2025 09:38:09 +0200 Subject: [PATCH 6/6] adjust the note --- views/page-settings/api-status.php | 2 +- views/page-settings/pages.php | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/views/page-settings/api-status.php b/views/page-settings/api-status.php index 6de10459c..73ddf5c82 100644 --- a/views/page-settings/api-status.php +++ b/views/page-settings/api-status.php @@ -23,7 +23,7 @@

- +