review fix

decred · May 22, 2019 · aa77d42 · aa77d42
1 parent f849e1f
commit aa77d42
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 16 deletions.
diff --git a/app/components/TxHistory/TxHistoryRow/RegularTxRow.js b/app/components/TxHistory/TxHistoryRow/RegularTxRow.js
@@ -14,7 +14,7 @@ const RegularTxRow = ({ txAmount, txDescription, txDirection, overview, txAccoun
         </div>}
       {!pending &&
         <div className="transaction-time-date-spacer">
-          {timeMessage(txTs)}
+          {timeMessage(txTs, props.intl)}
         </div>}
     </div>
     <div className="transaction-amount-hash">{(txDescription.addressStr || []).join(", ")}</div>

diff --git a/app/components/TxHistory/TxHistoryRow/StakeTxRow.js b/app/components/TxHistory/TxHistoryRow/StakeTxRow.js
@@ -58,7 +58,7 @@ const StakeTxRow = ({ status,  ...props }) => {
         <span className="transaction-stake-type-overview">{typeMsg}</span>
         {!pending &&
             <div className="transaction-time-date-spacer">
-              {timeMessage(txTs)}
+              {timeMessage(txTs, props.intl)}
             </div>}
       </div>
       <div className="transaction-info-price-reward">

diff --git a/app/components/TxHistory/TxHistoryRow/index.js b/app/components/TxHistory/TxHistoryRow/index.js
@@ -1,6 +1,6 @@
 import { RegularTxRowOfClass as regular } from "./RegularTxRow";
 import { StakeTxRowOfType as stake } from "./StakeTxRow";
-import { FormattedDate, FormattedTime, FormattedMessage as T } from "react-intl";
+import { defineMessages, injectIntl } from "react-intl";
 import "style/TxHistory.less";
 
 const TxRowByType = { // TODO: use constants instead of string
@@ -21,18 +21,16 @@ const TxRowByType = { // TODO: use constants instead of string
   "Coinbase": regular("Receive", true),
 };
 
-export const timeMessage = (txTimestamp) => <T
-  id="txHistory.statusSmall.date"
-  defaultMessage="{day} {month} {year} {time}"
-  values={{
-    day: <FormattedDate value={txTimestamp} day="2-digit" />,
-    month: <FormattedDate value={txTimestamp} month="short" />,
-    year: <FormattedDate value={txTimestamp} year="numeric" />,
-    time: <FormattedTime value={txTimestamp} hour12={false} />,
-  }}
-/>;
+export const timeMessageDefine = defineMessages({
+  dayMonthHourDisplay: {
+    id: "txHistory.dayMonthHourDisplay",
+    defaultMessage: "{value, date, short-month-24hour}"
+  },
+});
 
-const TxRow = ({ tx, overview, tsDate }, { router }) => {
+export const timeMessage = (txTimestamp, intl) => intl.formatMessage(timeMessageDefine.dayMonthHourDisplay, { value: txTimestamp });
+
+const TxRow = ({ tx, overview, tsDate, intl }, { router }) => {
   const rowType = tx.status ? tx.status :
     tx.txType ? tx.txType : tx.txDirection;
   const Component = TxRowByType[rowType];
@@ -41,6 +39,7 @@ const TxRow = ({ tx, overview, tsDate }, { router }) => {
     <Component
       {...{
         ...tx,
+        intl,
         txTs: tsDate(tx.txTimestamp),
         overview,
         pending: !tx.txTimestamp,
@@ -54,4 +53,4 @@ TxRow.contextTypes = {
   router: PropTypes.object.isRequired,
 };
 
-export default TxRow;
+export default injectIntl(TxRow);
diff --git a/app/i18n/locales/index.js b/app/i18n/locales/index.js
@@ -30,8 +30,17 @@ export const defaultFormats = {
     },
     "short-month": {
       month: "short"
+    },
+    "short-month-24hour": {
+      day: "2-digit",
+      month: "short",
+      year: "numeric",
+      hour: "numeric",
+      minute: "numeric",
+      hour12: false,
+      formatMatcher: "best fit"
     }
-  }
+  },
 };
 
 const de = {