I am looking to showcase the date of each entry (date, text, question, answer) stored in a json database within a lit element in a js module. The format for the date in the json db is compliant (refer to this post). For example:
"2021-12-24T21:06:06.773Z"
Here is the relevant code:
import { formatWithOptions } from "date-fns/fp";
import compose from "crocks/helpers/compose";
...
const newDate = (x) => new Date(x);
const formatDateWithOptions = formatWithOptions(
{
awareOfUnicodeTokens: true,
},
"d MMMM, yyyy, h:mm a"
);
const prettyDate = compose(formatDateWithOptions, newDate); // however, this is throwing an error indicating an invalid date
When ${prettyDate(date)}
is used within a lit element, it triggers
RangeError: Invalid time value.
As per the date-fns documentation, calling formatWithOptions()
with "d MMMM, yyyy, h:mm a"
should work. There's a discussion on this post addressing the same error but using a different function (formatDistanceToNow
). Can you identify where I might be making mistakes with my variables?