Add alt text in image

Author: aristath

assets/js/focus-element.js

@@ -1,12 +1,14 @@
 /* global progressPlannerFocusElement */
 
-const prplGetIndicatorElement = ( content, taskId ) => {
+const prplGetIndicatorElement = ( content, taskId, points ) => {
 	// Create an <img> element.
 	const imgEl = document.createElement( 'img' );
 	imgEl.src =
 		progressPlannerFocusElement.base_url +
 		'/assets/images/icon_progress_planner.svg';
-	imgEl.alt = '';
+	imgEl.alt = points
+		? progressPlannerFocusElement.l10n.fixThisIssue.replace( '%d', points )
+		: '';
 
 	// Create a span element for the points.
 	const spanEl = document.createElement( 'span' );
@@ -59,15 +61,18 @@ const prplAddPointsIndicatorToElement = ( task ) => {
 	document.querySelectorAll( task.link_setting.iconEl ).forEach( ( el ) => {
 		const iconEl = prplGetIndicatorElement(
 			task.is_complete ? '✓' : '+' + points,
-			task.task_id
+			task.task_id,
+			points
 		);
 		if ( task.is_complete ) {
 			iconEl.classList.add( 'complete' );
 		}
 
 		// Create a positioning wrapper.
 		const wrapperEl = document.createElement( 'span' );
-		wrapperEl.classList.add( 'prpl-element-awards-points-icon-positioning-wrapper' );
+		wrapperEl.classList.add(
+			'prpl-element-awards-points-icon-positioning-wrapper'
+		);
 
 		// Add the icon to the wrapper.
 		wrapperEl.appendChild( iconEl );

classes/admin/class-page.php

@@ -196,6 +196,10 @@ public function maybe_enqueue_focus_el_script( $hook ) {
 				'totalPoints'     => $total_points,
 				'completedPoints' => $completed_points,
 				'base_url'        => PROGRESS_PLANNER_URL,
+				'l10n'            => [
+					/* translators: %d: The number of points. */
+					'fixThisIssue' => \esc_html__( 'Fix this issue to get %d point(s) in Progress Planner', 'progress-planner' ),
+				],
 			]
 		);
 		\wp_enqueue_style(