From 8cbfc75ff3a3a6fc0163afa86952914c10184b26 Mon Sep 17 00:00:00 2001
From: rahulbile <rahul.rmcet@gmail.com>
Date: Sun, 8 Nov 2020 17:03:17 +0530
Subject: [PATCH 1/3] feat(ui): add time display mode setting to general
 preferences

fix #3600
---
 config/default.js                             |  3 +++
 .../Settings/SettingsFieldsGeneral.js         | 24 +++++++++++++++++++
 renderer/components/Settings/messages.js      |  4 ++++
 3 files changed, 31 insertions(+)

diff --git a/config/default.js b/config/default.js
index bdda23acda4..288102ae1f9 100644
--- a/config/default.js
+++ b/config/default.js
@@ -21,6 +21,9 @@ module.exports = {
   currency: 'USD',
   locale: 'en',
 
+  // Default time dipslay mode (12hour|24hour).
+  timeDisplayMode: '12hour',
+
   autoupdate: {
     active: true,
     channel: 'beta',
diff --git a/renderer/components/Settings/SettingsFieldsGeneral.js b/renderer/components/Settings/SettingsFieldsGeneral.js
index 83af5d48873..7cb9d36a43b 100644
--- a/renderer/components/Settings/SettingsFieldsGeneral.js
+++ b/renderer/components/Settings/SettingsFieldsGeneral.js
@@ -26,6 +26,15 @@ const themeMessageMapper = key => {
   return filters[key]
 }
 
+const displayModeItems = [{ key: '12hour' }, { key: '24hour' }]
+const displayModeMessageMapper = key => {
+  const filters = {
+    '12hour': messages.timeDisplayMode_option_12hour,
+    '24hour': messages.timeDisplayMode_option_24hour,
+  }
+  return filters[key]
+}
+
 const SettingsFieldsGeneral = ({ currentConfig }) => {
   return (
     <>
@@ -72,6 +81,21 @@ const SettingsFieldsGeneral = ({ currentConfig }) => {
 
       <Bar variant="light" />
 
+      <DataRow
+        left={<FieldLabel itemKey="timeDisplayMode" />}
+        right={
+          <Select
+            field="timeDisplayMode"
+            highlightOnValid={false}
+            initialValue={currentConfig.timeDisplayMode}
+            items={displayModeItems}
+            messageMapper={displayModeMessageMapper}
+          />
+        }
+      />
+
+      <Bar variant="light" />
+
       <DataRow
         left={<FieldLabel itemKey="autoupdate.active" />}
         right={<Toggle field="autoupdate.active" initialValue={currentConfig.autoupdate.active} />}
diff --git a/renderer/components/Settings/messages.js b/renderer/components/Settings/messages.js
index f545a5c3725..d6f7be00534 100644
--- a/renderer/components/Settings/messages.js
+++ b/renderer/components/Settings/messages.js
@@ -63,4 +63,8 @@ export default defineMessages({
   payments_maxParts_label: 'Payment parts',
   payments_maxParts_description:
     'Maximum number of partial payments that may be used to send a payment.',
+  timeDisplayMode_label: 'Time display mode',
+  timeDisplayMode_description: 'Your preferred time display mode.',
+  timeDisplayMode_option_12hour: '12 Hour',
+  timeDisplayMode_option_24hour: '24 Hour',
 })

From dd54622d5f1c19470d8775ac9a8fd637cdc5bc81 Mon Sep 17 00:00:00 2001
From: rahulbile <rahul.rmcet@gmail.com>
Date: Mon, 9 Nov 2020 11:09:24 +0530
Subject: [PATCH 2/3] feat(ui): use date formatting component for rendering
 date

fix #3600
---
 .../components/Activity/Invoice/Invoice.js    |  7 ++--
 .../components/Activity/Payment/Payment.js    |  6 +--
 .../Activity/PaymentModal/PaymentModal.js     | 20 +++++----
 renderer/components/Activity/Row.js           |  4 +-
 .../Activity/Transaction/Transaction.js       |  6 +--
 .../TransactionModal/TransactionModal.js      | 24 +++++------
 renderer/components/Channels/ChannelData.js   | 12 ++----
 renderer/components/Request/RequestSummary.js | 21 +++++-----
 renderer/containers/UI/FormattedDateTime.js   | 42 +++++++++++++++++++
 renderer/containers/UI/index.js               |  1 +
 10 files changed, 91 insertions(+), 52 deletions(-)
 create mode 100644 renderer/containers/UI/FormattedDateTime.js

diff --git a/renderer/components/Activity/Invoice/Invoice.js b/renderer/components/Activity/Invoice/Invoice.js
index aac56f90e72..4c1cfa74246 100644
--- a/renderer/components/Activity/Invoice/Invoice.js
+++ b/renderer/components/Activity/Invoice/Invoice.js
@@ -1,11 +1,11 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FormattedTime, FormattedMessage, injectIntl } from 'react-intl'
+import { FormattedMessage, injectIntl } from 'react-intl'
 import { Box, Flex } from 'rebass/styled-components'
 import { intlShape } from '@zap/i18n'
 import { Text } from 'components/UI'
 import Zap from 'components/Icon/Zap'
-import { CryptoValue, FiatValue } from 'containers/UI'
+import { CryptoValue, FiatValue, FormattedDateTime } from 'containers/UI'
 import messages from './messages'
 import Clock from 'components/Icon/Clock'
 
@@ -33,7 +33,8 @@ const Invoice = ({ activity, showActivityModal, cryptoUnitName, intl, ...rest })
         <FormattedMessage {...messages[activity.isSettled ? 'received' : 'requested']} />
       </Text>
       <Text color="gray" fontSize="xs" fontWeight="normal">
-        <FormattedTime
+        <FormattedDateTime
+          format="time"
           value={activity.isSettled ? activity.settleDate * 1000 : activity.creationDate * 1000}
         />
       </Text>
diff --git a/renderer/components/Activity/Payment/Payment.js b/renderer/components/Activity/Payment/Payment.js
index 6edcc84d257..fff7e392f98 100644
--- a/renderer/components/Activity/Payment/Payment.js
+++ b/renderer/components/Activity/Payment/Payment.js
@@ -1,12 +1,12 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FormattedMessage, FormattedTime, injectIntl } from 'react-intl'
+import { FormattedMessage, injectIntl } from 'react-intl'
 import { Box, Flex } from 'rebass/styled-components'
 import { intlShape } from '@zap/i18n'
 import { getDisplayNodeName } from 'reducers/payment/utils'
 import { Message, Text } from 'components/UI'
 import Zap from 'components/Icon/Zap'
-import { CryptoValue, FiatValue } from 'containers/UI'
+import { CryptoValue, FiatValue, FormattedDateTime } from 'containers/UI'
 import ErrorLink from '../ErrorLink'
 import messages from './messages'
 
@@ -57,7 +57,7 @@ const Payment = ({
           </>
         ) : (
           <Text color="gray" fontSize="xs" fontWeight="normal">
-            <FormattedTime value={activity.creationDate * 1000} />
+            <FormattedDateTime format="time" value={activity.creationDate * 1000} />
           </Text>
         )}
       </Box>
diff --git a/renderer/components/Activity/PaymentModal/PaymentModal.js b/renderer/components/Activity/PaymentModal/PaymentModal.js
index e0f8e8cdaec..649b45bd5cc 100644
--- a/renderer/components/Activity/PaymentModal/PaymentModal.js
+++ b/renderer/components/Activity/PaymentModal/PaymentModal.js
@@ -1,12 +1,19 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FormattedDate, FormattedTime, FormattedMessage, injectIntl } from 'react-intl'
+import { FormattedMessage, injectIntl } from 'react-intl'
 import { Flex } from 'rebass/styled-components'
 import { intlShape } from '@zap/i18n'
 import { getDisplayNodeName } from 'reducers/payment/utils'
 import { Bar, DataRow, Header, Panel, Text } from 'components/UI'
 import { getTag } from '@zap/utils/crypto'
-import { CopyButton, CryptoSelector, CryptoValue, FiatSelector, FiatValue } from 'containers/UI'
+import {
+  CopyButton,
+  CryptoSelector,
+  CryptoValue,
+  FiatSelector,
+  FiatValue,
+  FormattedDateTime,
+} from 'containers/UI'
 import { Truncate } from 'components/Util'
 import Lightning from 'components/Icon/Lightning'
 import Route from './Route'
@@ -78,15 +85,10 @@ class PaymentModal extends React.PureComponent {
             right={
               <>
                 <Text>
-                  <FormattedDate
-                    day="2-digit"
-                    month="long"
-                    value={item.creationDate * 1000}
-                    year="numeric"
-                  />
+                  <FormattedDateTime format="date" month="long" value={item.creationDate * 1000} />
                 </Text>
                 <Text>
-                  <FormattedTime value={item.creationDate * 1000} />
+                  <FormattedDateTime format="time" value={item.creationDate * 1000} />
                 </Text>
               </>
             }
diff --git a/renderer/components/Activity/Row.js b/renderer/components/Activity/Row.js
index c1930ddcc74..09f6bbb1bba 100644
--- a/renderer/components/Activity/Row.js
+++ b/renderer/components/Activity/Row.js
@@ -1,15 +1,15 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FormattedDate } from 'react-intl'
 import { Box } from 'rebass/styled-components'
 import { Bar, Heading } from 'components/UI'
+import { FormattedDateTime } from 'containers/UI'
 
 const Row = ({ style, item, RowComponent }) => (
   <div style={style}>
     {item.title ? (
       <Box mt={4} pl={4}>
         <Heading.H4 fontWeight="normal">
-          <FormattedDate day="2-digit" month="short" value={item.title} year="numeric" />
+          <FormattedDateTime format="date" month="short" value={item.title} />
         </Heading.H4>
         <Bar my={1} />
       </Box>
diff --git a/renderer/components/Activity/Transaction/Transaction.js b/renderer/components/Activity/Transaction/Transaction.js
index cd6018f7c65..8018f1311af 100644
--- a/renderer/components/Activity/Transaction/Transaction.js
+++ b/renderer/components/Activity/Transaction/Transaction.js
@@ -1,14 +1,14 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import findLast from 'lodash/findLast'
-import { FormattedTime, FormattedMessage, injectIntl } from 'react-intl'
+import { FormattedMessage, injectIntl } from 'react-intl'
 import { Box, Flex } from 'rebass/styled-components'
 import config from 'config'
 import { intlShape } from '@zap/i18n'
 import { CoinBig } from '@zap/utils/coin'
 import { Message, Text } from 'components/UI'
 import ChainLink from 'components/Icon/ChainLink'
-import { CryptoValue, FiatValue } from 'containers/UI'
+import { CryptoValue, FiatValue, FormattedDateTime } from 'containers/UI'
 import ErrorLink from '../ErrorLink'
 import messages from './messages'
 
@@ -45,7 +45,7 @@ const Transaction = ({
     if (CoinBig(numConfirmations).gt(confirmed)) {
       return (
         <Text color="gray" fontSize="xs" fontWeight="normal">
-          <FormattedTime value={activity.timeStamp * 1000} />
+          <FormattedDateTime format="time" value={activity.timeStamp * 1000} />
         </Text>
       )
     }
diff --git a/renderer/components/Activity/TransactionModal/TransactionModal.js b/renderer/components/Activity/TransactionModal/TransactionModal.js
index c1d97f577b1..8743de83154 100644
--- a/renderer/components/Activity/TransactionModal/TransactionModal.js
+++ b/renderer/components/Activity/TransactionModal/TransactionModal.js
@@ -1,19 +1,20 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import get from 'lodash/get'
-import {
-  FormattedDate,
-  FormattedTime,
-  FormattedMessage,
-  FormattedNumber,
-  injectIntl,
-} from 'react-intl'
+import { FormattedMessage, FormattedNumber, injectIntl } from 'react-intl'
 import { Flex } from 'rebass/styled-components'
 import { CoinBig } from '@zap/utils/coin'
 import { intlShape } from '@zap/i18n'
 import blockExplorer from '@zap/utils/blockExplorer'
 import { Bar, DataRow, Header, Link, Panel, Span, Text, Button } from 'components/UI'
-import { CopyButton, CryptoSelector, CryptoValue, FiatSelector, FiatValue } from 'containers/UI'
+import {
+  CopyButton,
+  CryptoSelector,
+  CryptoValue,
+  FiatSelector,
+  FiatValue,
+  FormattedDateTime,
+} from 'containers/UI'
 import { Truncate } from 'components/Util'
 import Onchain from 'components/Icon/Onchain'
 import Padlock from 'components/Icon/Padlock'
@@ -127,15 +128,14 @@ class TransactionModal extends React.PureComponent {
                   item.numConfirmations ? (
                     <>
                       <Text>
-                        <FormattedDate
-                          day="2-digit"
+                        <FormattedDateTime
+                          format="date"
                           month="long"
                           value={item.timeStamp * 1000}
-                          year="numeric"
                         />
                       </Text>
                       <Text>
-                        <FormattedTime value={item.timeStamp * 1000} />
+                        <FormattedDateTime format="time" value={item.timeStamp * 1000} />
                       </Text>
                     </>
                   ) : (
diff --git a/renderer/components/Channels/ChannelData.js b/renderer/components/Channels/ChannelData.js
index 9898878c69e..0dd2eb63e1f 100644
--- a/renderer/components/Channels/ChannelData.js
+++ b/renderer/components/Channels/ChannelData.js
@@ -1,6 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FormattedDate, FormattedTime, FormattedMessage, injectIntl } from 'react-intl'
+import { FormattedMessage, injectIntl } from 'react-intl'
 import styled from 'styled-components'
 import { opacity } from 'styled-system'
 import { Box as BaseBox, Flex } from 'rebass/styled-components'
@@ -8,7 +8,7 @@ import { intlShape } from '@zap/i18n'
 import blockExplorer from '@zap/utils/blockExplorer'
 import { Bar, DataRow, Link, Text } from 'components/UI'
 import { Truncate } from 'components/Util'
-import { CopyButton, CryptoValue } from 'containers/UI'
+import { CopyButton, CryptoValue, FormattedDateTime } from 'containers/UI'
 import { CHANNEL_DATA_VIEW_MODE_BASIC, CHANNEL_DATA_VIEW_MODE_FULL } from './constants'
 import messages from './messages'
 
@@ -62,13 +62,7 @@ const ChannelData = ({ channel, cryptoUnitName, intl, networkInfo, viewMode, ...
       body: <FormattedMessage {...messages.funding_date_description} />,
       value: (
         <Text>
-          <FormattedDate
-            day="2-digit"
-            month="short"
-            value={fundingTxTimestamp * 1000}
-            year="numeric"
-          />{' '}
-          <FormattedTime value={fundingTxTimestamp * 1000} />
+          <FormattedDateTime month="short" value={fundingTxTimestamp * 1000} />
         </Text>
       ),
     }),
diff --git a/renderer/components/Request/RequestSummary.js b/renderer/components/Request/RequestSummary.js
index 1dfcdb261f6..d9e1719b641 100644
--- a/renderer/components/Request/RequestSummary.js
+++ b/renderer/components/Request/RequestSummary.js
@@ -1,10 +1,16 @@
 import React, { useState } from 'react'
 import PropTypes from 'prop-types'
 import { Box, Flex } from 'rebass/styled-components'
-import { FormattedMessage, FormattedTime, useIntl } from 'react-intl'
+import { FormattedMessage, useIntl } from 'react-intl'
 import copy from 'copy-to-clipboard'
 import { Bar, DataRow, Button, QRCode, Text, Countdown } from 'components/UI'
-import { CryptoSelector, CryptoValue, FiatSelector, FiatValue } from 'containers/UI'
+import {
+  CryptoSelector,
+  CryptoValue,
+  FiatSelector,
+  FiatValue,
+  FormattedDateTime,
+} from 'containers/UI'
 import { Truncate } from 'components/Util'
 import RequestSettlePrompt from './RequestSettlePrompt'
 import messages from './messages'
@@ -99,9 +105,7 @@ const RequestSummary = ({
 
       <DataRow
         left={<FormattedMessage {...messages.created} />}
-        right={
-          <FormattedTime day="2-digit" month="long" value={creationDate * 1000} year="numeric" />
-        }
+        right={<FormattedDateTime month="long" value={creationDate * 1000} />}
       />
 
       <Bar variant="light" />
@@ -213,12 +217,7 @@ const RequestSummary = ({
                 >
                   <FormattedMessage {...messages.paid} />
                   <br />
-                  <FormattedTime
-                    day="2-digit"
-                    month="long"
-                    value={settleDate * 1000}
-                    year="numeric"
-                  />
+                  <FormattedDateTime month="long" value={settleDate * 1000} />
                 </Text>
               ) : (
                 <Text color={getStatusColor()} fontWeight="light">
diff --git a/renderer/containers/UI/FormattedDateTime.js b/renderer/containers/UI/FormattedDateTime.js
new file mode 100644
index 00000000000..fe94af1be11
--- /dev/null
+++ b/renderer/containers/UI/FormattedDateTime.js
@@ -0,0 +1,42 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import { connect } from 'react-redux'
+import { FormattedDate, FormattedTime } from 'react-intl'
+import { settingsSelectors } from 'reducers/settings'
+
+const mapStateToProps = state => ({
+  timeDisplayMode: settingsSelectors.currentConfig(state).timeDisplayMode,
+})
+
+const FormattedDateTime = ({ timeDisplayMode = '12hour', format, month = 'long', value }) => {
+  const is12Hour = timeDisplayMode === '12hour'
+
+  switch (format) {
+    case 'date':
+      return <FormattedDate day="2-digit" month={month} value={value} year="numeric" />
+    case 'time':
+      return <FormattedTime hour12={is12Hour} value={value} />
+    default:
+      return (
+        <FormattedDate
+          day="2-digit"
+          hour="numeric"
+          hour12={is12Hour}
+          minute="numeric"
+          month={month}
+          value={value}
+          year="numeric"
+        />
+      )
+  }
+}
+
+FormattedDateTime.propTypes = {
+  format: PropTypes.oneOf(['date', 'time']),
+  month: PropTypes.string,
+  timeDisplayMode: PropTypes.oneOf(['12hour', '24hour']),
+  value: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)])
+    .isRequired,
+}
+
+export default connect(mapStateToProps)(FormattedDateTime)
diff --git a/renderer/containers/UI/index.js b/renderer/containers/UI/index.js
index 80f04b19c4e..94fbc44910c 100644
--- a/renderer/containers/UI/index.js
+++ b/renderer/containers/UI/index.js
@@ -1,6 +1,7 @@
 export CopyButton from './CopyButton'
 export CryptoSelector from './CryptoSelector'
 export CryptoValue from './CryptoValue'
+export FormattedDateTime from './FormattedDateTime'
 export FiatSelector from './FiatSelector'
 export FiatValue from './FiatValue'
 export CryptoValueSelector from './CryptoValueSelector'

From aae38385e27cac1dc06ffd3aa81aeb608c16fc74 Mon Sep 17 00:00:00 2001
From: rahulbile <rahul.rmcet@gmail.com>
Date: Mon, 9 Nov 2020 20:08:26 +0530
Subject: [PATCH 3/3] chore(i18n): extract new translation strings

fix #3600
---
 translations/af-ZA.json | 4 ++++
 translations/ar-SA.json | 4 ++++
 translations/bg-BG.json | 4 ++++
 translations/ca-ES.json | 4 ++++
 translations/cs-CZ.json | 4 ++++
 translations/da-DK.json | 4 ++++
 translations/de-DE.json | 4 ++++
 translations/el-GR.json | 4 ++++
 translations/en.json    | 4 ++++
 translations/es-ES.json | 4 ++++
 translations/fi-FI.json | 4 ++++
 translations/fr-FR.json | 4 ++++
 translations/ga-IE.json | 4 ++++
 translations/he-IL.json | 4 ++++
 translations/hi-IN.json | 4 ++++
 translations/hr-HR.json | 4 ++++
 translations/hu-HU.json | 4 ++++
 translations/it-IT.json | 4 ++++
 translations/ja-JP.json | 4 ++++
 translations/ko-KR.json | 4 ++++
 translations/nl-NL.json | 4 ++++
 translations/no-NO.json | 4 ++++
 translations/pl-PL.json | 4 ++++
 translations/pt-BR.json | 4 ++++
 translations/pt-PT.json | 4 ++++
 translations/ro-RO.json | 4 ++++
 translations/ru-RU.json | 4 ++++
 translations/sr-SP.json | 4 ++++
 translations/sv-SE.json | 4 ++++
 translations/tr-TR.json | 4 ++++
 translations/uk-UA.json | 4 ++++
 translations/vi-VN.json | 4 ++++
 translations/zh-CN.json | 4 ++++
 translations/zh-TW.json | 4 ++++
 34 files changed, 136 insertions(+)

diff --git a/translations/af-ZA.json b/translations/af-ZA.json
index 92012a20101..e42f5665000 100644
--- a/translations/af-ZA.json
+++ b/translations/af-ZA.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/ar-SA.json b/translations/ar-SA.json
index 9c7879922eb..3a6d14faaff 100644
--- a/translations/ar-SA.json
+++ b/translations/ar-SA.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/bg-BG.json b/translations/bg-BG.json
index ee5087d2d37..05f214cdbeb 100644
--- a/translations/bg-BG.json
+++ b/translations/bg-BG.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "Тема",
   "components.Settings.theme_option_dark": "Тъмна",
   "components.Settings.theme_option_light": "Светла",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Адресът за плащането е копиран в буферната ви памет",
   "components.Syncing.address_copied_notification_title": "Адресът е копиран",
   "components.Syncing.block_progress": "Блок {currentBlock} от {totalBlocks}",
diff --git a/translations/ca-ES.json b/translations/ca-ES.json
index 92012a20101..e42f5665000 100644
--- a/translations/ca-ES.json
+++ b/translations/ca-ES.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/cs-CZ.json b/translations/cs-CZ.json
index 60fecf5aabe..3ec16a4ea78 100644
--- a/translations/cs-CZ.json
+++ b/translations/cs-CZ.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "Téma",
   "components.Settings.theme_option_dark": "Tmavý",
   "components.Settings.theme_option_light": "Světlý",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Platební adresa byla zkopírována do vaší schránky",
   "components.Syncing.address_copied_notification_title": "Adresa zkopírována",
   "components.Syncing.block_progress": "Blok {currentBlock} z {totalBlocks}",
diff --git a/translations/da-DK.json b/translations/da-DK.json
index 2504e5bc2a3..37f680a79d4 100644
--- a/translations/da-DK.json
+++ b/translations/da-DK.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "Tema",
   "components.Settings.theme_option_dark": "Mørk",
   "components.Settings.theme_option_light": "Lys",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Betalings adresse er blevet kopieret til din clipboard",
   "components.Syncing.address_copied_notification_title": "Adresse kopieret",
   "components.Syncing.block_progress": "Blok {currentBlock} af {totalBlocks}",
diff --git a/translations/de-DE.json b/translations/de-DE.json
index 060ecfe5a4a..5551febe624 100644
--- a/translations/de-DE.json
+++ b/translations/de-DE.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "Design",
   "components.Settings.theme_option_dark": "Dunkel",
   "components.Settings.theme_option_light": "Hell",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Die Adresse wurde in die Zwischenablage kopiert",
   "components.Syncing.address_copied_notification_title": "Adresse kopiert",
   "components.Syncing.block_progress": "Block {currentBlock} von {totalBlocks}",
diff --git a/translations/el-GR.json b/translations/el-GR.json
index 0636949d8b7..503765b4871 100644
--- a/translations/el-GR.json
+++ b/translations/el-GR.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/en.json b/translations/en.json
index 1730db98948..f7885ea78cd 100644
--- a/translations/en.json
+++ b/translations/en.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "Theme",
   "components.Settings.theme_option_dark": "Dark",
   "components.Settings.theme_option_light": "Light",
+  "components.Settings.timeDisplayMode_description": "Your preferred time display mode.",
+  "components.Settings.timeDisplayMode_label": "Time display mode",
+  "components.Settings.timeDisplayMode_option_12hour": "12 Hour",
+  "components.Settings.timeDisplayMode_option_24hour": "24 Hour",
   "components.Syncing.address_copied_notification_description": "Payment address has been copied to your clipboard",
   "components.Syncing.address_copied_notification_title": "Address copied",
   "components.Syncing.block_progress": "Block {currentBlock} of {totalBlocks}",
diff --git a/translations/es-ES.json b/translations/es-ES.json
index 2dbc6b0c634..2b9f1818361 100644
--- a/translations/es-ES.json
+++ b/translations/es-ES.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "Tema",
   "components.Settings.theme_option_dark": "Oscuro",
   "components.Settings.theme_option_light": "Ligero",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Dirección de pago ha sido copiada a su portapapeles",
   "components.Syncing.address_copied_notification_title": "Dirección copiada",
   "components.Syncing.block_progress": "Bloque {currentBlock} entre {totalBlocks} bloques totales",
diff --git a/translations/fi-FI.json b/translations/fi-FI.json
index 92012a20101..e42f5665000 100644
--- a/translations/fi-FI.json
+++ b/translations/fi-FI.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/fr-FR.json b/translations/fr-FR.json
index 3dc1b5dfcad..debf950b5d9 100644
--- a/translations/fr-FR.json
+++ b/translations/fr-FR.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "Thème",
   "components.Settings.theme_option_dark": "Sombre",
   "components.Settings.theme_option_light": "Clair",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "L'adresse a été copiée dans votre presse-papiers",
   "components.Syncing.address_copied_notification_title": "Adresse copiée",
   "components.Syncing.block_progress": "Bloc {currentBlock} sur {totalBlocks}",
diff --git a/translations/ga-IE.json b/translations/ga-IE.json
index a48517154ca..c1034aa9cdf 100644
--- a/translations/ga-IE.json
+++ b/translations/ga-IE.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "Solas",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Tá an seoladh íocaíochta cóipeáilte go dtí do ghearrthaisce",
   "components.Syncing.address_copied_notification_title": "Seoladh cóipeáilte",
   "components.Syncing.block_progress": "Bloc {currentBlock} de {totalBlocks}",
diff --git a/translations/he-IL.json b/translations/he-IL.json
index 6b082734277..f5f18c17690 100644
--- a/translations/he-IL.json
+++ b/translations/he-IL.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/hi-IN.json b/translations/hi-IN.json
index f6034c282cd..4f1fb423930 100644
--- a/translations/hi-IN.json
+++ b/translations/hi-IN.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/hr-HR.json b/translations/hr-HR.json
index cc3ac094948..7c4d6811b4f 100644
--- a/translations/hr-HR.json
+++ b/translations/hr-HR.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "Tema",
   "components.Settings.theme_option_dark": "Tamna",
   "components.Settings.theme_option_light": "Svijetla",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Adresa je kopirana u međuspremnik",
   "components.Syncing.address_copied_notification_title": "Adresa je kopirana",
   "components.Syncing.block_progress": "Blok {currentBlock} od {totalBlocks}",
diff --git a/translations/hu-HU.json b/translations/hu-HU.json
index 92012a20101..e42f5665000 100644
--- a/translations/hu-HU.json
+++ b/translations/hu-HU.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/it-IT.json b/translations/it-IT.json
index a3df66fc756..aef1b05a616 100644
--- a/translations/it-IT.json
+++ b/translations/it-IT.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/ja-JP.json b/translations/ja-JP.json
index c757eec2523..117ca53fcb6 100644
--- a/translations/ja-JP.json
+++ b/translations/ja-JP.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/ko-KR.json b/translations/ko-KR.json
index 92012a20101..e42f5665000 100644
--- a/translations/ko-KR.json
+++ b/translations/ko-KR.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/nl-NL.json b/translations/nl-NL.json
index e7a8b2fc3e5..a3f3fed73d0 100644
--- a/translations/nl-NL.json
+++ b/translations/nl-NL.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Betalingsadres is gekopieerd naar je klembord",
   "components.Syncing.address_copied_notification_title": "Adres gekopiëerd",
   "components.Syncing.block_progress": "Blok {currentBlock} van {totalBlocks}",
diff --git a/translations/no-NO.json b/translations/no-NO.json
index 9ceda2ba4aa..e8072169251 100644
--- a/translations/no-NO.json
+++ b/translations/no-NO.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Betalingsadresse har blitt kopiert til utklippstavlen",
   "components.Syncing.address_copied_notification_title": "Addresse kopiert",
   "components.Syncing.block_progress": "Blokk {currentBlock} av {totalBlocks}",
diff --git a/translations/pl-PL.json b/translations/pl-PL.json
index 18545f65365..1185eeb0b18 100644
--- a/translations/pl-PL.json
+++ b/translations/pl-PL.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/pt-BR.json b/translations/pt-BR.json
index aa50b51f44b..5a8cb17b22a 100644
--- a/translations/pt-BR.json
+++ b/translations/pt-BR.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/pt-PT.json b/translations/pt-PT.json
index b3366454dc7..aad7c0e03ea 100644
--- a/translations/pt-PT.json
+++ b/translations/pt-PT.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/ro-RO.json b/translations/ro-RO.json
index 052ea6ce19b..55bdaca050e 100644
--- a/translations/ro-RO.json
+++ b/translations/ro-RO.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/ru-RU.json b/translations/ru-RU.json
index 9425ef3e0bd..60a899f47d3 100644
--- a/translations/ru-RU.json
+++ b/translations/ru-RU.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/sr-SP.json b/translations/sr-SP.json
index 92012a20101..e42f5665000 100644
--- a/translations/sr-SP.json
+++ b/translations/sr-SP.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/sv-SE.json b/translations/sv-SE.json
index 4fdb014f958..befcf2c1a78 100644
--- a/translations/sv-SE.json
+++ b/translations/sv-SE.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/tr-TR.json b/translations/tr-TR.json
index b4ab337b33a..930f6b449c9 100644
--- a/translations/tr-TR.json
+++ b/translations/tr-TR.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Ödeme adresi kopyalandı",
   "components.Syncing.address_copied_notification_title": "Adres kopyalandı",
   "components.Syncing.block_progress": "Toplam {totalBlocks} bloktan: {currentBlock}",
diff --git a/translations/uk-UA.json b/translations/uk-UA.json
index c8118a67b6e..95768064da5 100644
--- a/translations/uk-UA.json
+++ b/translations/uk-UA.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "Тема",
   "components.Settings.theme_option_dark": "Темна",
   "components.Settings.theme_option_light": "Світла",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "Адреса платежу скопійована у буфер обміну",
   "components.Syncing.address_copied_notification_title": "Адреса скопійована",
   "components.Syncing.block_progress": "Заблокувати {currentBlock} з {totalBlocks}",
diff --git a/translations/vi-VN.json b/translations/vi-VN.json
index 92012a20101..e42f5665000 100644
--- a/translations/vi-VN.json
+++ b/translations/vi-VN.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/zh-CN.json b/translations/zh-CN.json
index 56c27633efa..4dade42e3e9 100644
--- a/translations/zh-CN.json
+++ b/translations/zh-CN.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",
diff --git a/translations/zh-TW.json b/translations/zh-TW.json
index 75058884a31..41644c8aa61 100644
--- a/translations/zh-TW.json
+++ b/translations/zh-TW.json
@@ -653,6 +653,10 @@
   "components.Settings.theme_label": "",
   "components.Settings.theme_option_dark": "",
   "components.Settings.theme_option_light": "",
+  "components.Settings.timeDisplayMode_description": "",
+  "components.Settings.timeDisplayMode_label": "",
+  "components.Settings.timeDisplayMode_option_12hour": "",
+  "components.Settings.timeDisplayMode_option_24hour": "",
   "components.Syncing.address_copied_notification_description": "",
   "components.Syncing.address_copied_notification_title": "",
   "components.Syncing.block_progress": "",