Placing time into a text component and managing the timezones

Discussion
1

So I made a text component that reads the value of a transformer and the transformer just uses moment.js to parse the time, but I am not the most familiar with js so I do not know to much what is doing on. So I want to display the time a record was updated via a text bar and have the time and timezone change based on location.

Here is the transformer code, there are more cases but I am only showing the first one for simplicity.

let text = "###### ";
let tab = {{ tabs.value }};
let doItems = moment({{ getUpdateTime.data?.ETL_UPDATED_DT?.at(0) ?? 0}});
switch (tab) {
case "DO":
text += Data updated as of ${doItems};
break;
}
return text;

So what I am noticing is that when I change my location in google chrome and check if the time is changing, it only displays my time zone (EST) but if I run moment(getUpdateTime.data?.ETL_UPDATED_DT?.at(0) ?? 0) in retool's console, the timestamp is changing in relation to the location change.

I am curious of any ways of testing this?

2

this depends on a bit on the format of what you're converting but made this you can use, maybe it will help?

import moment from "moment";
import "moment-timezone";

//****************************
// UNCOMMENT ALL LINES BELOW HERE TO ALSO TEST POSTGRESQL TIME
//****************************

// const { Client } = require("pg");
// const pgclient = new Client({
//   connectionString: process.env.PG_CONNECTION_STRING,
// });

const envFilePath =
  process.env.NODE_ENV === "development" ? "./.dev.env" : "./.env";
require("dotenv").config({ path: envFilePath });

// async function connectPGClient() {
//   try {
//     await pgclient.connect();
//     console.info("CONNECTED: PG Client");
//   } catch (err) {
//     console.error("Connection error", err.stack);
//   }
// }

// async function getPGTime() {
//   try {
//     const pg_now = "SELECT now()";
//     const pg_now_tz = "SELECT extract(epoch FROM now())";

//     const now_ret = await pgclient.query(pg_now);
//     const now_tz_ret = await pgclient.query(pg_now_tz);

//     const now_obj = now_ret.rows;
//     const now_tz_obj = now_tz_ret.rows;

//     return {
//       now: {
//         value: now_obj,
//         comment: "PG timestamp without timezone",
//       },
//       now_tz: {
//         value: now_tz_obj,
//         comment: "PG timestamp with timezone",
//       },
//     };
//   } catch (err) {
//     console.error("Query Error:", err.stack);
//     throw err;
//   }
// }

function getMomentTime(time_string, format, timezone) {
  const moment_ts = moment(time_string, format, timezone).format();
  const moment_tz = moment(time_string, format).tz(timezone).format();

  return {
    moment_ts: {
      value: moment_ts,
      comment:
        "moment converted time_string to browsers timezone THEN to " + timezone,
    },
    moment_tz: {
      value: moment_tz,
      comment: "moment converted time_string to " + timezone,
    },
  };
}

function getJSDateTime(time_string = "2024-8-23 13:00:00", timezone = "UTC") {
  const date = new Date(time_string);

  if (isNaN(date.getTime())) {
    throw new Error("Invalid time value");
  }

  const date_iso = date.toISOString();
  const date_value = date.valueOf();
  const date_locale = date.toLocaleString("en-US", { timeZone: timezone });

  return {
    date_iso: {
      value: date_iso,
      comment: "Date() using ISO String",
    },
    date_value: {
      value: date_value,
      comment: "Date() using valueOf",
    },
    date_locale: {
      value: date_locale,
      comment: "Date() using locale String",
    },
  };
}

async function getTimeComparison(
  time_string = "2024-8-23 13:00:00",
  format = "YYYY/MM/DD HH:mm:ss",
  timezone = "UTC"
) {
  // const pg_time = await getPGTime();
  const moment_time = getMomentTime(time_string, format, timezone);
  const date_time = getJSDateTime();

  return {
    // postgresql: pg_time,
    moment: moment_time,
    js_date: date_time,
  };
}

async function main() {
  //  await connectPGClient();
  const my_timestamp = "2024-8-23 13:00:00";
  const format = "YYYY/MM/DD HH:mm:ss";
  const timezone = "UTC";

  const timestamps = await getTimeComparison(my_timestamp, format, timezone);

  console.log("Input:", {
    timestamp: my_timestamp,
    format: format,
    timezone: timezone,
  });

  console.log("Output:", timestamps);
}

main();
1 Like
3

This pretty much got me into the direction to achieve what I needed. Thank you for the help friend :slight_smile: !!!!!!!!!

2 Likes