feat: convert from using dst offsets to use timezone code

feat: select timezones from current selected country

lib/logs.js

@@ -1,5 +1,6 @@
 const _ = require('lodash/fp')
-const moment = require('moment')
+const { format } = require('date-fns')
+const { zonedTimeToUtc, utcToZonedTime } = require('date-fns-tz')
 
 const db = require('./db')
 const pgp = require('pg-promise')()
@@ -112,10 +113,13 @@ function simpleGetMachineLogs (deviceId, from = new Date(0).toISOString(), until
 }
 
 function logDateFormat (timezone, logs, fields) {
-  const offset = timezone.split(':')[1]
 
   return _.map(log => {
-    const values = _.map(field => moment.utc(log[field]).utcOffset(parseInt(offset)).format('YYYY-MM-DDTHH:mm:ss.SSS'), fields)
+    const values = _.map(
+      field =>
+        format(utcToZonedTime(zonedTimeToUtc(log[field], process.env.TZ), timezone), 'yyyy-MM-ddTHH:mm:ss.SSS'),
+        fields
+      )
     const fieldsToOverride = _.zipObject(fields, values)
 
     return {

lib/plugins.js

@@ -230,7 +230,7 @@ function plugins (settings, deviceId) {
     const localeConfig = configManager.getLocale(deviceId, settings.config)
     const fiatCode = localeConfig.fiatCurrency
     const cryptoCodes = localeConfig.cryptoCurrencies
-    const timezone = localeConfig.timezone.split(':')
+    const timezone = localeConfig.timezone
 
     const tickerPromises = cryptoCodes.map(c => ticker.getRates(settings, fiatCode, c))
     const balancePromises = cryptoCodes.map(c => fiatBalance(fiatCode, c))
@@ -239,13 +239,12 @@ function plugins (settings, deviceId) {
     const currentConfigVersionPromise = fetchCurrentConfigVersion()
     const currentAvailablePromoCodes = loyalty.getNumberOfAvailablePromoCodes()
     const supportsBatchingPromise = cryptoCodes.map(c => wallet.supportsBatching(settings, c))
-    const timezoneObj = { utcOffset: timezone[0], dstOffset: timezone[1] }
 
     const promises = [
       buildAvailableCassettes(),
       pingPromise,
       currentConfigVersionPromise,
-      timezoneObj
+      timezone
     ].concat(
       supportsBatchingPromise,
       tickerPromises,

lib/routes/customerRoutes.js

@@ -18,6 +18,8 @@ const { getCustomerById } = require('../customers')
 const machineLoader = require('../machine-loader')
 const { loadLatestConfig } = require('../new-settings-loader')
 
+const { zonedTimeToUtc, utcToZonedTime } = require('date-fns-tz')
+
 function updateCustomer (req, res, next) {
   const id = req.params.id
   const machineVersion = req.query.version
@@ -129,14 +131,12 @@ function buildSms (data, receiptOptions) {
         .then(([customer, deviceConfig]) => {
           const formattedTx = _.mapKeys(_.camelCase)(tx)
           const localeConfig = configManager.getLocale(formattedTx.deviceId, config)
-          const timezone = localeConfig.timezone.split(':')
+          const timezone = localeConfig.timezone
-          const dstOffset = timezone[1]
 
           const cashInCommission = new BN(1).plus(new BN(formattedTx.commissionPercentage))
 
           const rate = new BN(formattedTx.rawTickerPrice).multipliedBy(cashInCommission).decimalPlaces(2)
-          const date = new Date()
+          const date = utcToZonedTime(zonedTimeToUtc(new Date(), process.env.TZ), timezone)
-          date.setMinutes(date.getMinutes() + parseInt(dstOffset))
           const dateString = `${date.toISOString().replace('T', ' ').slice(0, 19)}`
 
           const data = {

new-lamassu-admin/package-lock.json

@@ -10465,6 +10465,16 @@
         "whatwg-url": "^8.0.0"
       }
     },
+    "date-fns": {
+      "version": "2.26.0",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.26.0.tgz",
+      "integrity": "sha512-VQI812dRi3cusdY/fhoBKvc6l2W8BPWU1FNVnFH9Nttjx4AFBRzfSVb/Eyc7jBT6e9sg1XtAGsYpBQ6c/jygbg=="
+    },
+    "date-fns-tz": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/date-fns-tz/-/date-fns-tz-1.1.6.tgz",
+      "integrity": "sha512-nyy+URfFI3KUY7udEJozcoftju+KduaqkVfwyTIE0traBiVye09QnyWKLZK7drRr5h9B7sPJITmQnS3U6YOdQg=="
+    },
     "debug": {
       "version": "4.3.1",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",

new-lamassu-admin/package.json

@@ -19,6 +19,8 @@
     "classnames": "2.2.6",
     "countries-and-timezones": "^2.4.0",
     "d3": "^6.2.0",
+    "date-fns": "^2.26.0",
+    "date-fns-tz": "^1.1.6",
     "downshift": "3.3.4",
     "file-saver": "2.0.2",
     "formik": "2.2.0",
@@ -36,8 +38,8 @@
     "react": "^16.12.0",
     "react-copy-to-clipboard": "^5.0.2",
     "react-dom": "^16.10.2",
-    "react-material-ui-carousel": "^2.2.7",
     "react-dropzone": "^11.4.2",
+    "react-material-ui-carousel": "^2.2.7",
     "react-number-format": "^4.4.1",
     "react-otp-input": "^2.3.0",
     "react-router-dom": "5.1.2",

new-lamassu-admin/src/pages/Analytics/components/tooltips/GraphTooltip.js

@@ -31,12 +31,12 @@ const GraphTooltip = ({
         formatDate(
           dateInterval[1],
           null,
-          period.code === 'day' ? 'MMM D, HH:mm' : 'MMM D'
+          period.code === 'day' ? 'MMM d, HH:mm' : 'MMM d'
         ),
         formatDate(
           dateInterval[0],
           null,
-          period.code === 'day' ? 'HH:mm' : 'MMM D'
+          period.code === 'day' ? 'HH:mm' : 'MMM d'
         )
       ]
     : [

new-lamassu-admin/src/pages/Analytics/components/wrappers/HourOfDayWrapper.js

@@ -1,5 +1,6 @@
 import { Box } from '@material-ui/core'
 import { makeStyles } from '@material-ui/core/styles'
+import { getTimezoneOffset } from 'date-fns-tz'
 import moment from 'moment'
 import * as R from 'ramda'
 import React, { useState } from 'react'
@@ -47,7 +48,7 @@ const HourOfDayBarGraphHeader = ({
     cashOut: <div className={classes.cashOutIcon}></div>
   }
 
-  const offset = parseInt(timezone.split(':')[1]) * MINUTE
+  const offset = getTimezoneOffset(timezone)
 
   const txsPerWeekday = R.reduce(
     (acc, value) => {

new-lamassu-admin/src/pages/Analytics/graphs/HourOfDayBarGraph.js

@@ -1,5 +1,6 @@
 import BigNumber from 'bignumber.js'
 import * as d3 from 'd3'
+import { getTimezoneOffset } from 'date-fns-tz'
 import moment from 'moment'
 import * as R from 'ramda'
 import React, { memo, useCallback, useEffect, useMemo, useRef } from 'react'
@@ -38,7 +39,7 @@ const Graph = ({
     []
   )
 
-  const offset = parseInt(timezone.split(':')[1]) * MINUTE
+  const offset = getTimezoneOffset(timezone)
 
   const getTickIntervals = (domain, interval) => {
     const ticks = []

new-lamassu-admin/src/pages/Analytics/graphs/OverTimeDotGraph.js

@@ -1,5 +1,6 @@
 import BigNumber from 'bignumber.js'
 import * as d3 from 'd3'
+import { getTimezoneOffset } from 'date-fns-tz'
 import moment from 'moment'
 import * as R from 'ramda'
 import React, { memo, useCallback, useEffect, useMemo, useRef } from 'react'
@@ -40,7 +41,7 @@ const Graph = ({
     []
   )
 
-  const offset = parseInt(timezone.split(':')[1]) * MINUTE
+  const offset = getTimezoneOffset(timezone)
   const NOW = Date.now() + offset
 
   const periodDomains = {

new-lamassu-admin/src/pages/Dashboard/SystemPerformance/Graphs/RefScatterplot.js

@@ -1,4 +1,5 @@
 import * as d3 from 'd3'
+import { getTimezoneOffset } from 'date-fns-tz'
 import moment from 'moment'
 import React, { useEffect, useRef, useCallback } from 'react'
 
@@ -11,7 +12,7 @@ const RefScatterplot = ({ data: realData, timeFrame, timezone }) => {
     const margin = { top: 25, right: 0, bottom: 25, left: 15 }
     const width = 555 - margin.left - margin.right
     const height = 150 - margin.top - margin.bottom
-    const dstOffset = parseInt(timezone.split(':')[1])
+    const offset = getTimezoneOffset(timezone)
     // finds maximum value for the Y axis. Minimum value is 100. If value is multiple of 1000, add 100
     // (this is because the Y axis looks best with multiples of 100)
     const findMaxY = () => {
@@ -32,7 +33,7 @@ const RefScatterplot = ({ data: realData, timeFrame, timezone }) => {
         default:
           return moment
             .utc(v)
-            .add(dstOffset, 'minutes')
+            .add(offset, 'minutes')
             .format('HH:mm')
       }
     }

new-lamassu-admin/src/pages/Locales/Locales.js

@@ -158,6 +158,8 @@ const Locales = ({ name: SCREEN_KEY }) => {
     setValue(curr)
   }
 
+  console.log('config', config)
+
   const onEditingDefault = (it, editing) => setEditingDefault(editing)
   const onEditingOverrides = (it, editing) => setEditingOverrides(editing)
 
@@ -187,7 +189,7 @@ const Locales = ({ name: SCREEN_KEY }) => {
           save={handleSave}
           validationSchema={LocaleSchema}
           data={R.of(locale)}
-          elements={mainFields(data, onChangeCoin)}
+          elements={mainFields(data, onChangeCoin, R.of(locale))}
           setEditing={onEditingDefault}
           forceDisable={isEditingOverrides}
         />

new-lamassu-admin/src/pages/Locales/helper.js

@@ -1,18 +1,19 @@
 import * as ct from 'countries-and-timezones'
+// import { useFormikContext } from 'formik'
 import * as R from 'ramda'
 import * as Yup from 'yup'
 
 import Autocomplete from 'src/components/inputs/formik/Autocomplete.js'
-import { getTzLabels } from 'src/utils/timezones'
+// import { getTzLabels } from 'src/utils/timezones'
 
-const getFields = (getData, names, onChange, auxElements = []) => {
+const getFields = (getData, names, onChange, auxElements = [], locale) => {
   return R.filter(
     it => R.includes(it.name, names),
-    allFields(getData, onChange, auxElements)
+    allFields(getData, onChange, auxElements, locale)
   )
 }
 
-const allFields = (getData, onChange, auxElements = []) => {
+const allFields = (getData, onChange, auxElements = [], locale) => {
   const getView = (data, code, compare) => it => {
     if (!data) return ''
 
@@ -33,14 +34,19 @@ const allFields = (getData, onChange, auxElements = []) => {
   const suggestionFilter = it =>
     R.differenceWith((x, y) => x.deviceId === y, it, overridenMachines)
 
+  const localeData = (locale && locale[0]) || {}
+
   const machineData = getData(['machines'])
   const countryData = getData(['countries'])
   const currencyData = getData(['currencies'])
   const languageData = getData(['languages'])
   const cryptoData = getData(['cryptoCurrencies'])
-  const timezonesData = R.values(ct.getAllTimezones())
 
-  const tzLabels = getTzLabels(timezonesData)
+  const countryTimezones = ct.getTimezonesForCountry(localeData?.country) ?? []
+  const timezonesData =
+    R.values(
+      countryTimezones.map(it => ({ label: it.name, code: it.name })) ?? []
+    ) ?? []
 
   const findSuggestion = it => {
     const machine = R.find(R.propEq('deviceId', it.machine))(machineData)
@@ -117,10 +123,10 @@ const allFields = (getData, onChange, auxElements = []) => {
       name: 'timezone',
       width: 320,
       size: 'sm',
-      view: getView(tzLabels, 'label'),
+      view: getView(timezonesData, 'label'),
       input: Autocomplete,
       inputProps: {
-        options: tzLabels,
+        options: timezonesData,
         valueProp: 'code',
         labelProp: 'label'
       }
@@ -128,13 +134,15 @@ const allFields = (getData, onChange, auxElements = []) => {
   ]
 }
 
-const mainFields = (auxData, configureCoin) => {
+const mainFields = (auxData, configureCoin, locale) => {
   const getData = R.path(R.__, auxData)
 
   return getFields(
     getData,
     ['country', 'fiatCurrency', 'languages', 'cryptoCurrencies', 'timezone'],
-    configureCoin
+    configureCoin,
+    undefined,
+    locale
   )
 }
 

new-lamassu-admin/src/pages/Transactions/Transactions.js

@@ -218,7 +218,7 @@ const Transactions = () => {
     {
       header: 'Date (UTC)',
       view: it =>
-        timezone && formatDate(it.created, timezone, 'YYYY-MM-DD HH:mm:ss'),
+        timezone && formatDate(it.created, timezone, 'yyyy-MM-dd HH:mm:ss'),
       textAlign: 'right',
       size: 'sm',
       width: 195

new-lamassu-admin/src/utils/timezones.js

@@ -1,89 +1,23 @@
-import moment from 'moment'
+import { format } from 'date-fns'
-import * as R from 'ramda'
+import { zonedTimeToUtc, utcToZonedTime } from 'date-fns-tz'
+// import moment from 'moment'
+// import * as R from 'ramda'
 
-const getPossibleUTCDSTPairs = timezones =>
+// const buildLabel = tz => {
-  R.map(
+//   return `(UTC${tz.utcOffsetStr}) ${R.map(it => it.city, tz.cities).join(', ')}`
-    it => ({
+// }
-      utcOffset: it.utcOffset,
-      dstOffset: it.dstOffset,
-      utcOffsetStr: it.utcOffsetStr,
-      dstOffsetStr: it.dstOffsetStr
-    }),
-    R.uniqBy(
-      it => [it.utcOffset, it.dstOffset, it.utcOffsetStr, it.dstOffsetStr],
-      timezones
-    )
-  )
 
-const getFormattedTimezones = timezones =>
+const formatDate = (date, timezone, pattern) => {
-  R.sort(
+  const browserTimezone = Intl.DateTimeFormat().resolvedOptions().timeZone
-    R.ascend(R.prop('utcOffset')),
+  const newDate = utcToZonedTime(
-    R.map(
+    zonedTimeToUtc(date, browserTimezone),
-      it => ({
+    timezone
-        utcOffset: it.utcOffset,
-        dstOffset: it.dstOffset,
-        utcOffsetStr: it.utcOffsetStr,
-        dstOffsetStr: it.dstOffsetStr,
-        cities: R.map(
-          ite => {
-            const regionCityPair = R.split('/', ite.name)
-            return {
-              region: regionCityPair[0],
-              city: R.replace(/_/g, ' ', regionCityPair[1]),
-              country: ite.country
-            }
-          },
-          R.filter(
-            itx =>
-              R.eqProps('utcOffset', it, itx) &&
-              R.eqProps('dstOffset', it, itx) &&
-              !R.isNil(itx.country) &&
-              !R.includes('Etc', itx.name) &&
-              R.includes('/', itx.name),
-            timezones
-          )
-        )
-      }),
-      getPossibleUTCDSTPairs(timezones)
-    )
   )
-
+  return format(newDate, pattern)
-const getFinalTimezones = timezones => {
-  const formattedTimezones = getFormattedTimezones(timezones)
-  const nonEmptyTimezones = R.filter(
-    it => !R.isEmpty(it.cities),
-    formattedTimezones
-  )
-  const nonDuplicateCities = R.map(
-    it => ({
-      ...it,
-      cities: R.uniqBy(R.prop('country'), R.uniqBy(R.prop('city'), it.cities))
-    }),
-    nonEmptyTimezones
-  )
-  return nonDuplicateCities
 }
 
-const buildLabel = tz => {
+const formatDateNonUtc = (date, pattern) => {
-  return `(UTC${tz.utcOffsetStr}) ${R.map(it => it.city, tz.cities).join(', ')}`
+  return format(date, pattern)
 }
 
-const getTzLabels = timezones =>
+export { formatDate, formatDateNonUtc }
-  R.map(
-    it => ({ label: buildLabel(it), code: `${it.utcOffset}:${it.dstOffset}` }),
-    getFinalTimezones(timezones)
-  )
-
-const formatDate = (date, timezoneCode, format) => {
-  const dstOffset = timezoneCode?.split(':')[1] ?? 0
-  return moment
-    .utc(date)
-    .utcOffset(parseInt(dstOffset))
-    .format(format)
-}
-
-const formatDateNonUtc = (date, format) => {
-  return moment(date).format(format)
-}
-
-export { getTzLabels, formatDate, formatDateNonUtc }

package-lock.json

@@ -8464,10 +8464,14 @@
       "integrity": "sha512-YzhyDAwA4TaQIhM5go+vCLmU0UikghC/t9DTQYZR2M/UvZ1MdOhPezSDZcjj9uqQJOMqjLcpWtyW2iNINdlatQ=="
     },
     "date-fns": {
-      "version": "2.16.1",
+      "version": "2.26.0",
-      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.16.1.tgz",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.26.0.tgz",
-      "integrity": "sha512-sAJVKx/FqrLYHAQeN7VpJrPhagZc9R4ImZIWYRFZaaohR3KzmuK88touwsSwSVT8Qcbd4zoDsnGfX4GFB4imyQ==",
+      "integrity": "sha512-VQI812dRi3cusdY/fhoBKvc6l2W8BPWU1FNVnFH9Nttjx4AFBRzfSVb/Eyc7jBT6e9sg1XtAGsYpBQ6c/jygbg=="
-      "dev": true
+    },
+    "date-fns-tz": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/date-fns-tz/-/date-fns-tz-1.1.6.tgz",
+      "integrity": "sha512-nyy+URfFI3KUY7udEJozcoftju+KduaqkVfwyTIE0traBiVye09QnyWKLZK7drRr5h9B7sPJITmQnS3U6YOdQg=="
     },
     "date-time": {
       "version": "2.1.0",

package.json

@@ -26,6 +26,8 @@
     "cookie-parser": "^1.4.3",
     "cors": "^2.8.5",
     "dataloader": "^2.0.0",
+    "date-fns": "^2.26.0",
+    "date-fns-tz": "^1.1.6",
     "ethereumjs-tx": "^1.3.3",
     "ethereumjs-util": "^5.2.0",
     "ethereumjs-wallet": "^0.6.3",
@@ -68,8 +70,8 @@
     "pify": "^3.0.0",
     "pretty-ms": "^2.1.0",
     "promise-sequential": "^1.1.1",
-    "request-promise": "^4.2.6",
     "queue-promise": "^2.2.1",
+    "request-promise": "^4.2.6",
     "semver": "^7.1.3",
     "serve-static": "^1.12.4",
     "socket.io": "^2.0.3",