From 32c971aaa87ee9c17255cd2574534b37d7b44e0f Mon Sep 17 00:00:00 2001
From: Oluwaseun Olorunsola <seun@oluwaseun.com.ng>
Date: Mon, 29 Nov 2021 14:17:10 +0100
Subject: [PATCH] Update subscribers count translation strings

[MAILPOET-3972]
---
 .../js/src/common/subscribers_cache_message.tsx   | 15 ++++++++++++---
 views/segments.html                               |  3 +--
 views/subscribers/subscribers.html                |  3 +--
 3 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/assets/js/src/common/subscribers_cache_message.tsx b/assets/js/src/common/subscribers_cache_message.tsx
index 043fe21a0e..d90f6bff17 100644
--- a/assets/js/src/common/subscribers_cache_message.tsx
+++ b/assets/js/src/common/subscribers_cache_message.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import MailPoet from 'mailpoet';
 import Button from 'common/button/button';
+import ReactStringReplace from 'react-string-replace';
 import Notice from '../notices/notice';
 
 type Props = {
@@ -29,9 +30,17 @@ export function SubscribersCacheMessage({ cacheCalculation }: Props): JSX.Elemen
 
   return (
     <div className="mailpoet-subscribers-cache-notice">
-      {MailPoet.I18n.t('subscribersCountWereCalculated')}
-      &nbsp;
-      <abbr title={cacheCalculation}>{`${String(minutes)} ${String(MailPoet.I18n.t('subscribersMinutesAgo'))}`}</abbr>
+
+      {ReactStringReplace(
+        MailPoet.I18n.t('subscribersCountWereCalculatedWithMinutesAgo'),
+        /<abbr>(.*?)<\/abbr>/,
+        (match) => (
+          <abbr title={cacheCalculation}>
+            {match.replace(/(\{\$mins\}|\$mins)/, String(minutes))}
+          </abbr>
+        )
+      )}
+
       <Button
         className="mailpoet-subscribers-cache-notice-button"
         type="button"
diff --git a/views/segments.html b/views/segments.html
index 9249e1da57..e0245c1afc 100644
--- a/views/segments.html
+++ b/views/segments.html
@@ -240,8 +240,7 @@
     'filterConnectAnd': _x('and', 'Dynamic segment creation: The user can see logical operator between condition when has more than one'),
     'filterConnectOr': _x('or', 'Dynamic segment creation: The user can see logical operator between condition when has more than one'),
 
-    'subscribersCountWereCalculated': __('Lists and Segments subscribers counts were calculated'),
-    'subscribersMinutesAgo': __('minutes ago'),
+    'subscribersCountWereCalculatedWithMinutesAgo': __('Lists and Segments subscribers counts were calculated <abbr>{$mins} minutes ago</abbr>'),
     'recalculateNow': __('Recalculate now'),
     'privacyProtectionNotice': __('Due to email privacy protections, some opens may not be tracked. Consider using a different engagement metric.'),
   }) %>
diff --git a/views/subscribers/subscribers.html b/views/subscribers/subscribers.html
index 7bfbd076b2..4f52650ce8 100644
--- a/views/subscribers/subscribers.html
+++ b/views/subscribers/subscribers.html
@@ -162,8 +162,7 @@
     'tooltipAverage': __('Read 20% or fewer of sent emails'),
     'engagementScoreDescription': __('Average percent of emails subscribers read in the last year'),
 
-    'subscribersCountWereCalculated': __('Lists and Segments subscribers counts were calculated'),
-    'subscribersMinutesAgo': __('minutes ago'),
+    'subscribersCountWereCalculatedWithMinutesAgo': __('Lists and Segments subscribers counts were calculated <abbr>{$mins} minutes ago</abbr>'),
     'recalculateNow': __('Recalculate now'),
   }) %>
 <% endblock %>