Modifying dateString as per UTC-Offset to satisfactorily filter based on date

Akshay Jain
3 min readOct 22, 2020

I work at Nium where we handle international money transfer, so we have pages where we show clients a list of transactions, and this is where I got a good case to make medium post!

See the case —

A user does a transaction in India at 2am 20-October, it is recorded in database with timestamp of 2020:10:19T20:30:00Z i.e 19th October 8:30pm this is what is the GMT time at 2am India Time on that day!

Suppose on any other day, that user in India tries to search for that transaction using date filter, as he knows that he has done transaction on 20th October, he will select 20 October as dateFrom in the range.

We are using dateRange picker of react-dates

Selecting 20Oct as dateFrom will give dateString = 2020:10:20T00:00:00 which is 20 Oct 12 am GMT time, i.e. 5:30am India time. Now if this string goes to backend as dateFrom then it won’t return the transaction that happened at 2am on 20th October, and thus all transactions before 5:30am on 20th October can’t be searched with simple date filter, we need to do something more🏐🤠

So solution would be evident if you followed above excerpt i.e. subtract 5:30 hours when we are sending dateFrom from India.

So whenever we send dateFrom, we need to subtract 330 minutes from that dateString before sending it to search the database. Idea is to send 12am of the timezone from which the user is searching and while sending toDate send 11:59 pm of that region.

That means for USA, which is at time GMT-8, selecting 20 October as dateFrom, will select 2020:10:20T00:00:00 as expected which equals 8am in that local area of USA, so in such case we do addition and send 2020:10:20T08:00:00 i.e 8am GMT i.e 12am US time in that zone on 20th October when sending dateFrom

There is one more compelling reason to do the date offset correction

which is

when these transactions will be displayed on UI, we have to display the local time of that zone on UI, i.e. when user searches with dateFrom as 20th October, i.e. he is interested in getting transactions after 12am in his time zone, so even if we fetch some other transactions suppose for the case of US, a transaction with timestamp of 2020:10:20T05:00:00 i.e 20th October 5am GMT will be shown on UI as 19th October 2020 9pm in US, but user searched with dateFrom as 20th October, it is flawed search as per his experience!

We use following code in JS for the approach described

let offset =new Date().getTimezoneOffset() 
// will return -330 in India where timezone is GMT+5:30
// will return 480, in USA where timezone is GMT-8
Further we use moment library to modify the date code is as followsimport moment from 'moment-timezone'function addOffsetCorrection(dateString:string):string {
let offset =new Date().getTimezoneOffset();

return moment(dateString).add(offset,'minutes').format('DD/MM/YYYY HH:mm:ss')

}
addOffsetCorrection(dateFrom)N.B:
moment(dateFrom).add(offset,'minutes')
// changes '2020:10:20T00:00:00' to '2020:10:19T20:30:00Z' for India
// changes '2020:10:20T00:00:00' to '2020:10:20T08:00:00Z' for USA

Let me know if you have any questions!

--

--