Standards
Implementation rules and usage examples for date/time formatting in the frontend
👤 Rahul Bhangale📅 Updated: Mar 13, 2026🏷️ util
Standards
Implementation rule: use dt() and dtf()
Do not call moment(date).format(...) with a raw format string anywhere in the repo. Instead, always use the shared helpers:
| Helper | Use when |
|---|---|
dt(date, format) | You need to display a formatted date/time string |
dtf(format) | You need only the locale-aware format string (e.g. for placeholders, validators, or third-party components) |
is24HourFormat() | You truly need a boolean — most code should not call this directly |
This ensures:
- Consistent IN / US date ordering everywhere
- Automatic 12h / 24h selection based on session preference
- A single place to extend or adjust formatting rules
Usage examples
// ---- Displaying a formatted date/time (use dt) ----
dt(patient.created_at, "DD/MM/YYYY");
dt(order.collected_at, "DD/MM/YYYY HH:mm");
dt(report.generated_at, "DD/MM/YYYY HH:mm:ss");
dt(sample.received_at, "Do MMM, YYYY");
dt(someDate, "dd/MM/yyyy"); // lowercase variant
dt(someDate, "DDMMYYYY"); // no separators
// ---- When you only need the format string (use dtf) ----
// Placeholder for a date input
<Input placeholder={dtf("DD/MM/YYYY")} />
// Format prop on a date picker
<DatePicker format={dtf("DD/MM/YYYY HH:mm")} />
// Table column formatter
column.formatter = (value) => moment(value).format(dtf("DD/MM/YYYY"));
// Validation pattern derived from the format
const formatPattern = dtf("DD/MM/YYYY");