update timezone task description & try to pre-select timezone

Author: ilicfilip

assets/js/recommendations/interactive-task.js

@@ -57,15 +57,9 @@ const prplInteractiveTaskFormListener = {
 					if ( ! postId ) {
 						return;
 					}
+
+					// This will trigger the celebration event (confetti) as well.
 					prplSuggestedTask.maybeComplete( postId );
-					taskEl.setAttribute( 'data-task-action', 'celebrate' );
-					document.dispatchEvent(
-						new CustomEvent( 'prpl/celebrateTasks', {
-							detail: {
-								element: taskEl,
-							},
-						} )
-					);
 				} );
 			} );
 		} );
@@ -94,15 +88,9 @@ const prplInteractiveTaskFormListener = {
 			if ( ! postId ) {
 				return;
 			}
+
+			// This will trigger the celebration event (confetti) as well.
 			prplSuggestedTask.maybeComplete( postId );
-			taskEl.setAttribute( 'data-task-action', 'celebrate' );
-			document.dispatchEvent(
-				new CustomEvent( 'prpl/celebrateTasks', {
-					detail: {
-						element: taskEl,
-					},
-				} )
-			);
 		} );
 	},
 
@@ -153,15 +141,9 @@ const prplInteractiveTaskFormListener = {
 				if ( ! postId ) {
 					return;
 				}
+
+				// This will trigger the celebration event (confetti) as well.
 				prplSuggestedTask.maybeComplete( postId );
-				taskEl.setAttribute( 'data-task-action', 'celebrate' );
-				document.dispatchEvent(
-					new CustomEvent( 'prpl/celebrateTasks', {
-						detail: {
-							element: taskEl,
-						},
-					} )
-				);
 			} );
 		} );
 	},

assets/js/recommendations/select-timezone.js

@@ -1,4 +1,4 @@
-/* global prplInteractiveTaskFormListener */
+/* global prplInteractiveTaskFormListener, prplDocumentReady */
 
 /*
  * Set the site timezone.
@@ -12,3 +12,15 @@ prplInteractiveTaskFormListener.siteSettings( {
 	taskId: 'select-timezone',
 	popoverId: 'prpl-popover-select-timezone',
 } );
+
+prplDocumentReady( () => {
+	const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+	const timezoneSelect = document.querySelector( 'select#timezone' );
+	const timezoneSaved = timezoneSelect?.dataset?.timezoneSaved || 'false';
+	console.log( timezoneSelect );
+	console.log( timezoneSaved );
+	// Try to preselect the timezone.
+	if ( timezone && timezoneSelect && 'false' === timezoneSaved ) {
+		timezoneSelect.value = timezone;
+	}
+} );

classes/suggested-tasks/providers/class-select-timezone.php

@@ -69,7 +69,7 @@ protected function get_title() {
 	 * @return string
 	 */
 	protected function get_description() {
-		return \esc_html__( 'Set site timezone to ensure scheduled posts and pages are published at desired time.', 'progress-planner' );
+		return \esc_html__( 'Setting the time zone correctly on your site is valuable. By setting the correct time zone, you ensure scheduled tasks happen exactly when you want them to happen. To correctly account for daylight savings\', we recommend you use the city-based time zone instead of the UTC offset (e.g. Amsterdam or London).', 'progress-planner' );
 	}
 
 	/**
@@ -95,7 +95,7 @@ public function should_add_task() {
 	 */
 	public function print_popover_instructions() {
 		echo '<p>';
-		\esc_html_e( 'Set site timezone to ensure scheduled posts and pages are published at desired time.', 'progress-planner' );
+		\esc_html_e( 'Setting the time zone correctly on your site is valuable. By setting the correct time zone, you ensure scheduled tasks happen exactly when you want them to happen. To correctly account for daylight savings\', we recommend you use the city-based time zone instead of the UTC offset (e.g. Amsterdam or London).', 'progress-planner' );
 		echo '</p>';
 	}
 
@@ -107,6 +107,7 @@ public function print_popover_instructions() {
 	public function print_popover_form_contents() {
 		$current_offset = \get_option( 'gmt_offset' );
 		$tzstring       = \get_option( 'timezone_string' );
+		$was_tzstring_saved = '' !== $tzstring || '0' !== $current_offset ? 'true' : 'false';
 
 		// Remove old Etc mappings. Fallback to gmt_offset.
 		if ( str_contains( $tzstring, 'Etc/GMT' ) ) {
@@ -124,7 +125,7 @@ public function print_popover_form_contents() {
 		}
 		?>
 		<label>
-			<select id="timezone" name="timezone">
+			<select id="gmt_offset" name="gmt_offset" data-timezone-saved="<?php echo \esc_attr( $was_tzstring_saved ); ?>">
 				<?php echo \wp_timezone_choice( $tzstring, \get_user_locale() ); ?>
 			</select>
 		</label>