feat(TestStatus): minor tweaks

components/admin-notification/index.php

@@ -41,10 +41,6 @@
 		$template = dirname( __FILE__ ) . '/views/admin-notification-unlock-more-tests.php';
 		break;
 
-	case 'run_manual_test':
-		$template = dirname( __FILE__ ) . '/views/admin-notification-run-manual-test.php';
-		break;
-
 	default:
 		$template = '';
 		break;

components/admin-notification/script.js

@@ -20,4 +20,97 @@ jQuery( document ).ready( function ( $ ) {
 			} );
 		}
 	} );
+	if ( ! window.customElements.get( 'vrts-relative-time' ) ) {
+		window.customElements.define(
+			'vrts-relative-time',
+			RelativeTimeElement
+		);
+	}
 } );
+
+class RelativeTimeElement extends window.HTMLElement {
+	// constructor (element) {
+	// 	this.element = element
+	// 	// get date from utc timestamp
+
+	// 	// this.time = new Date( element.getAttribute( 'time' ) );
+	// 	// this.update();
+	// }
+
+	// observe attribute time
+	static get observedAttributes() {
+		return [ 'time' ];
+	}
+
+	// update time when attribute time changes
+	attributeChangedCallback( name, oldValue, newValue ) {
+		if ( name === 'time' ) {
+			this.time = new Date( newValue );
+			this.update();
+		}
+	}
+
+	// connectedCallback() {
+	// 	this.time = new Date( this.getAttribute( 'time' ) );
+	// 	this.update();
+	// }
+
+	update() {
+		this.innerText = `${ extractDate( this.time ) } at ${ extractTime(
+			this.time
+		) }`;
+	}
+}
+
+function extractDate( inputDate ) {
+	const { __ } = wp.i18n;
+	const today = new Date();
+	// Set the time to midnight for an accurate date comparison
+	today.setHours( 0, 0, 0, 0 );
+
+	// Create a Date object for the input date
+	const comparisonDate = new Date( inputDate );
+	comparisonDate.setHours( 0, 0, 0, 0 );
+
+	// Calculate the difference in days
+	const difference = ( comparisonDate - today ) / ( 1000 * 3600 * 24 );
+
+	// Determine if the date is today, tomorrow, or yesterday
+	if ( difference === 0 ) {
+		return __( 'Today', 'visual-regression-testing' );
+	} else if ( difference === 1 ) {
+		return __( 'Tomorrow', 'visual-regression-testing' );
+	} else if ( difference === -1 ) {
+		return __( 'Yesterday', 'visual-regression-testing' );
+	}
+	return dateFormat( inputDate, 'Y/m/d' );
+}
+
+function extractTime( inputDate ) {
+	return dateFormat( inputDate, 'g:i a' );
+}
+
+// format date like in php date_format
+function dateFormat( date, format ) {
+	const pad = ( number ) => ( number < 10 ? `0${ number }` : number );
+	const d = pad( date.getDate() );
+	const m = pad( date.getMonth() + 1 );
+	const y = date.getFullYear();
+	const Y = date.getFullYear();
+	const H = date.getHours();
+	const i = pad( date.getMinutes() );
+	const s = date.getSeconds();
+	const g = date.getHours() % 12 || 12;
+	const a = date.getHours() >= 12 ? 'pm' : 'am';
+
+	return format
+		.replace( 'd', d )
+		.replace( 'm', m )
+		.replace( 'y', y )
+		.replace( 'Y', Y )
+		.replace( 'H', H )
+		.replace( 'i', i )
+		.replace( 's', s )
+		.replace( 'g', g )
+		.replace( 'a', a );
+}

components/tests-page/views/tests-page-list.php

@@ -1,7 +1,5 @@
 <?php
-use Vrts\Features\Admin_Notices;
 use Vrts\Features\Subscription;
-use Vrts\Services\Manual_Test_Service;
 ?>
 
 <div class="wrap vrts_list_table_page">
@@ -58,12 +56,6 @@ class="page-title-action button-secondary"
 		if ( $list_table->has_items() ) {
 			$list_table->inline_edit();
 		}
-
-		$vrts_manual_test_service = new Manual_Test_Service();
-		if ( $vrts_manual_test_service->is_active() && ! isset( $_GET['run-manual-test']) ) {
-			$vrts_manual_test_service->delete_option();
-			Admin_Notices::render_notification( 'run_manual_test', true, [] );
-		}
 		?>
 	</form>
 </div>

includes/core/utilities/class-date-time-helpers.php

@@ -2,6 +2,8 @@
 
 namespace Vrts\Core\Utilities;
 
+use DateTimeZone;
+
 class Date_Time_Helpers {
 	/**
 	 * Get the date and time WordPress native formatted.
@@ -14,17 +16,54 @@ public static function get_formatted_date_time( $date = null ) {
 		if ( null === $date ) {
 			return null;
 		}
-		$formatted_date = get_date_from_gmt( $date );
-		$date = date_create( $formatted_date );
+		$date = self::date_from_gmt( $date );
 
-		$date = sprintf(
+		$formatted_date = sprintf(
 			/* translators: 1: Date, 2: Time. */
 			esc_html_x( '%1$s at %2$s', 'date at time', 'visual-regression-tests' ),
 			/* translators: Date format. See https://www.php.net/manual/datetime.format.php */
 			date_format( $date, esc_html_x( 'Y/m/d', 'date format', 'visual-regression-tests' ) ),
 			/* translators: Time format. See https://www.php.net/manual/datetime.format.php */
 			date_format( $date, esc_html_x( 'g:i a', 'time format', 'visual-regression-tests' ) )
 		);
+		return $formatted_date;
+	}
+
+	/**
+	 * Get the date and time WordPress native formatted.
+	 *
+	 * @param mixed $date a DateTime string.
+	 *
+	 * @return string Formatted date and time.
+	 */
+	public static function get_formatted_relative_date_time( $date = null ) {
+		if ( null === $date ) {
+			return null;
+		}
+		$date = self::date_from_gmt( $date );
+
+		$formatted_date = sprintf(
+			/* translators: 1: Date, 2: Time. */
+			esc_html_x( '%1$s at %2$s', 'date at time', 'visual-regression-tests' ),
+			/* translators: Date format. See https://www.php.net/manual/datetime.format.php */
+			date_format( $date, esc_html_x( 'Y/m/d', 'date format', 'visual-regression-tests' ) ),
+			/* translators: Time format. See https://www.php.net/manual/datetime.format.php */
+			date_format( $date, esc_html_x( 'g:i a', 'time format', 'visual-regression-tests' ) )
+		);
+		return '<vrts-relative-time time="' . date_format( $date, 'c' ) . '">' . $formatted_date . '</vrts-relative-time>';
+	}
+
+	/**
+	 * Get the date WordPress native formatted.
+	 *
+	 * @param mixed $date a DateTime string.
+	 *
+	 * @return string Formatted date.
+	 */
+	private static function date_from_gmt( $date ) {
+		$date = date_create( $date, new DateTimeZone( 'UTC' ) );
+		$date->setTimezone( wp_timezone() );
+
 		return $date;
 	}
 }

includes/features/class-tests-page.php

@@ -244,21 +244,20 @@ public function process_column_actions() {
 			}
 		} elseif ( $test_id && 'run-manual-test' === $action ) {
 			$service = new Manual_Test_Service();
-			$service->run_tests([ $test_id ]);
+			$service->run_tests( [ $test_id ] );
 			$test = Test::get_item( $test_id );
 
 			$redirect_to = add_query_arg([
 				'message' => 'success',
 				'run-manual-test' => true,
 				'post_id' => $test->post_id,
 			], $page_url);
-		}
+		}//end if
 
 		if ( empty( $redirect_to ) ) {
 			$redirect_to = add_query_arg( [ 'message' => 'error' ], $page_url );
 		}
 
-
 		wp_safe_redirect( $redirect_to );
 		exit;
 	}
@@ -399,10 +398,6 @@ public function init_notifications() {
 			add_action( 'admin_notices', [ $this, 'render_notification_unlock_more_tests' ] );
 		}
 
-		if ( isset( $_GET['run-manual-test'] ) ) {
-			add_action( 'admin_notices', [ $this, 'render_notification_run_manual_test' ] );
-		}
-
 		// phpcs:ignore WordPress.Security.NonceVerification.Recommended -- It should be ok here.
 		$is_new_test_failed = isset( $_GET['new-test-failed'] ) ? sanitize_text_field( wp_unslash( $_GET['new-test-failed'] ) ) : false;
 		if ( ( $is_new_test_failed || '0' === $remaining_tests ) && $is_connected ) {
@@ -458,18 +453,6 @@ public function render_notification_test_disabled() {
 		]);
 	}
 
-	/**
-	 * Render run_manual_test Notification.
-	 */
-	public function render_notification_run_manual_test() {
-		// phpcs:ignore WordPress.Security.NonceVerification.Recommended -- It should be ok here.
-		$post_id = isset( $_GET['post_id'] ) ? intval( $_GET['post_id'] ) : false;
-		Admin_Notices::render_notification('run_manual_test', true, [
-			'page_title' => get_the_title( $post_id ),
-			'post_id' => intval( $post_id ),
-		]);
-	}
-
 	/**
 	 * Render unlock_more_tests Notification.
 	 */