Skip to content

Commit 16e8d01

Browse files
ilicfilipilicfilip
committed
adjusted wording & new icon
1 parent ffcbccd commit 16e8d01

4 files changed

Lines changed: 68 additions & 16 deletions

File tree

‎assets/css/page-widgets/suggested-tasks.css‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -395,6 +395,16 @@
395395
height: 100%;
396396
}
397397
}
398+
399+
&.prpl-note-error {
400+
color: #9f0712;
401+
background-color: var(--prpl-background-red);
402+
403+
.prpl-note-icon {
404+
color: var(--prpl-color-notification-red);
405+
}
406+
407+
}
398408
}
399409

400410
/* To align the buttons to the bottom of the column. */

‎assets/images/icon_exclamation_circle_solid.svg‎

Lines changed: 3 additions & 0 deletions
Loading

‎assets/js/web-components/prpl-task-sending-email.js‎

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -177,28 +177,36 @@ customElements.define(
177177
'#prpl-sending-email-error-occurred-step'
178178
);
179179

180+
// Replace the placeholder with the email address (text in the left column).
180181
const emailAddress = this.querySelector(
181182
'#prpl-sending-email-address'
182183
).value;
183184

184185
// Get the error message text.
185-
let errorMessageText = errorOccurredStep
186+
const errorMessageText = errorOccurredStep
186187
.querySelector( '#prpl-sending-email-error-occurred-message' )
187188
.getAttribute( 'data-email-message' );
188189

189190
// Replace the placeholder with the email address.
190-
errorMessageText = errorMessageText.replace(
191+
errorOccurredStep.querySelector(
192+
'#prpl-sending-email-error-occurred-message'
193+
).textContent = errorMessageText.replace(
191194
'[EMAIL_ADDRESS]',
192195
emailAddress
193196
);
194197

195-
// Replace the placeholder with the error message.
196-
errorOccurredStep.querySelector(
197-
'#prpl-sending-email-error-occurred-message'
198-
).textContent = errorMessageText.replace(
199-
'[ERROR_MESSAGE]',
200-
errorMessageReason
198+
// Replace the placeholder with the error message (text in the right column).
199+
const errorMessageNotification = errorOccurredStep.querySelector(
200+
'.prpl-note.prpl-note-error .prpl-note-text'
201201
);
202+
const errorMessageNotificationText =
203+
errorMessageNotification.getAttribute( 'data-email-message' );
204+
205+
errorMessageNotification.textContent =
206+
errorMessageNotificationText.replace(
207+
'[ERROR_MESSAGE]',
208+
errorMessageReason
209+
);
202210

203211
// Hide form step.
204212
this.formStep.style.display = 'none';

‎classes/suggested-tasks/providers/interactive/class-email-sending.php‎

Lines changed: 39 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -250,18 +250,39 @@ public function the_popover_content() {
250250
<p class="prpl-interactive-task-description" id="prpl-sending-email-error-occurred-message" data-email-message="
251251
<?php
252252
/* translators: %s is the email subject. */
253-
printf( \esc_attr__( 'We just tried to send the email "%s" to [EMAIL_ADDRESS], but it didn’t work. The error message was: [ERROR_MESSAGE]', 'progress-planner' ), \esc_attr( $this->email_subject ) );
253+
printf( \esc_attr__( 'We just tried to send the email "%s" to [EMAIL_ADDRESS], but unfortunately it didn’t work.', 'progress-planner' ), \esc_attr( $this->email_subject ) );
254254
?>
255255
"></p>
256256

257257
</div>
258258

259259
<div class="prpl-column">
260-
<p><?php \esc_html_e( 'Please fix the issue and try again.', 'progress-planner' ); ?></p>
260+
<div class="prpl-note prpl-note-error">
261+
<span class="prpl-note-icon">
262+
<?php \progress_planner()->the_asset( 'images/icon_exclamation_circle_solid.svg' ); ?>
263+
</span>
264+
<span class="prpl-note-text" data-email-message="
265+
<?php
266+
/* translators: %s is the error message. */
267+
printf( \esc_attr__( 'The test email didn’t work. The error message was: [ERROR_MESSAGE]', 'progress-planner' ), \esc_attr( $this->email_error ) );
268+
?>
269+
">
270+
</span>
271+
</div>
272+
273+
<p>
274+
<?php
275+
printf(
276+
/* translators: %s is a link to the troubleshooting guide. */
277+
\esc_html__( 'There are a few common reasons why your email might not be sending. Check the %s to find out what’s causing the issue and how to fix it.', 'progress-planner' ),
278+
'<a href="#" target="_blank">' . \esc_html__( 'troubleshooting guide', 'progress-planner' ) . '</a>'
279+
);
280+
?>
281+
</p>
261282

262283
<div class="prpl-steps-nav-wrapper">
263-
<button class="prpl-button" data-action="showForm"><?php \esc_html_e( 'Retry now', 'progress-planner' ); ?></button>
264-
<button class="prpl-button" data-action="closePopover"><?php \esc_html_e( 'Close', 'progress-planner' ); ?></button>
284+
<button class="prpl-button" data-action="showForm"><?php \esc_html_e( 'Try again', 'progress-planner' ); ?></button>
285+
<button class="prpl-button" data-action="closePopover"><?php \esc_html_e( 'Retry later', 'progress-planner' ); ?></button>
265286
</div>
266287
</div>
267288
</div>
@@ -273,14 +294,22 @@ public function the_popover_content() {
273294
<p class="prpl-interactive-task-description" id="prpl-sending-email-sent-message" data-email-message="
274295
<?php
275296
/* translators: %s is the email subject. */
276-
printf( \esc_attr__( 'We just sent the email "%s" to [EMAIL_ADDRESS]. It usually arrives within a few minutes. In rare cases, it might take a few hours.', 'progress-planner' ), \esc_attr( $this->email_subject ) );
297+
printf( \esc_attr__( 'We just sent the email "%s" to [EMAIL_ADDRESS].', 'progress-planner' ), \esc_attr( $this->email_subject ) );
277298
?>
278299
"></p>
279300

280301
</div>
281302

282303
<div class="prpl-column">
283-
<p><?php \esc_html_e( 'Did you receive our test email?', 'progress-planner' ); ?></p>
304+
<p><?php \esc_html_e( 'Did you get the test email?', 'progress-planner' ); ?></p>
305+
<div class="prpl-note">
306+
<span class="prpl-note-icon">
307+
<?php \progress_planner()->the_asset( 'images/icon_exclamation_triangle_solid.svg' ); ?>
308+
</span>
309+
<span class="prpl-note-text">
310+
<?php \esc_html_e( 'You should get the email in a few minutes. In rare cases, it might take a few hours.', 'progress-planner' ); ?>
311+
</span>
312+
</div>
284313
<div class="radios">
285314
<div class="prpl-radio-wrapper">
286315
<label for="prpl-sending-email-result-yes" class="prpl-custom-radio">
@@ -322,13 +351,15 @@ public function the_popover_content() {
322351
<?php /* Email received, showing success message */ ?>
323352
<div class="prpl-columns-wrapper-flex prpl-sending-email-step" id="prpl-sending-email-success-step" style="display: none;">
324353
<div class="prpl-column prpl-column-content">
325-
<?php \esc_html_e( 'Great, you received the test email! That means email is working correctly on your website.', 'progress-planner' ); ?>
354+
<h2 class="prpl-interactive-task-title"><?php \esc_html_e( 'Your email is set up properly!', 'progress-planner' ); ?></h2>
355+
<?php \esc_html_e( 'Great, you received the test email! This indicates email is set up properly on your website.', 'progress-planner' ); ?>
326356
</div>
327357

328358
<div class="prpl-column">
359+
<p><?php \esc_html_e( 'Celebrate this achievement!', 'progress-planner' ); ?></p>
329360

330361
<div class="prpl-steps-nav-wrapper">
331-
<button class="prpl-button" data-action="completeTask"><?php \esc_html_e( 'Mark as completed', 'progress-planner' ); ?></button>
362+
<button class="prpl-button" data-action="completeTask"><?php \esc_html_e( 'Collect your point!', 'progress-planner' ); ?></button>
332363
</div>
333364
</div>
334365
</div>

0 commit comments

Comments
 (0)