Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(badges): display print timestamps in local browser time instead of UTC

Browse Source 
The backend returns naive UTC datetime strings (no Z suffix). dayjs was treating
them as local time, so staff in ET saw UTC times. Added treat_as_utc param to
iso_datetime_formatter (default false, zero breakage to existing call sites) that
appends Z before parsing so dayjs converts to browser-local time on display.

Applied to all print timestamp call sites in badge list (first/last print visible
row + debug row) and to created_on/updated_on in the debug row.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
2026-06-09 07:56:46 -04:00
parent b8ceed69d0
commit 6e04145514
2 changed files with 29 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/lib/ae_utils/ae_utils__datetime_format.ts
View File

@@ -27,7 +27,11 @@ export const iso_datetime_formatter = function iso_datetime_formatter(
named_format: string = 'datetime_iso_no_seconds', // date_iso, datetime_iso_no_seconds
// Pass true/false to resolve to the correct 12h or 24h variant automatically.
// null (default) leaves named_format unchanged — all existing call sites unaffected.
use_12h: boolean | null = null
use_12h: boolean | null = null,
// When true, treats a naive datetime string (no Z / offset) as UTC so dayjs
// converts it to local browser time on display. Use for timestamps stored as
// UTC in the DB but returned without a timezone indicator.
treat_as_utc: boolean = false
) {
// console.log('*** iso_datetime_formatter() ***');
@@ -74,6 +78,12 @@ export const iso_datetime_formatter = function iso_datetime_formatter(
raw_datetime = new Date(); // Get the current datetime if one was not passed.
}
// Append 'Z' to naive UTC strings so dayjs converts to local browser time.
// Guards against double-appending if the backend ever adds timezone info.
if (treat_as_utc && typeof raw_datetime === 'string' && !raw_datetime.match(/Z$|[+-]\d{2}:?\d{2}$/)) {
raw_datetime = raw_datetime + 'Z';
}
if (use_12h !== null) {
named_format = use_12h
? (TO_12H[named_format] ?? named_format)

28
src/routes/events/[event_id]/(badges)/badges/ae_comp__badge_obj_li.svelte
View File

@@ -275,13 +275,13 @@ let visible_badge_obj_li = $derived(
Checked in &middot; {print_count}&times;
{#if event_badge_obj.print_first_datetime}
&middot;
{ae_util.iso_datetime_formatter(event_badge_obj.print_first_datetime, 'date_full_no_year')}
{ae_util.iso_datetime_formatter(event_badge_obj.print_first_datetime, 'time_12_long')}
{ae_util.iso_datetime_formatter(event_badge_obj.print_first_datetime, 'date_full_no_year', null, true)}
{ae_util.iso_datetime_formatter(event_badge_obj.print_first_datetime, 'time_12_long', null, true)}
{/if}
{#if event_badge_obj.print_last_datetime && event_badge_obj.print_last_datetime !== event_badge_obj.print_first_datetime}
&middot; last print:
{ae_util.iso_datetime_formatter(event_badge_obj.print_last_datetime, 'date_full_no_year')}
{ae_util.iso_datetime_formatter(event_badge_obj.print_last_datetime, 'time_12_long')}
{ae_util.iso_datetime_formatter(event_badge_obj.print_last_datetime, 'date_full_no_year', null, true)}
{ae_util.iso_datetime_formatter(event_badge_obj.print_last_datetime, 'time_12_long', null, true)}
{/if}
</span>
</div>
@@ -451,11 +451,11 @@ let visible_badge_obj_li = $derived(
<span>Printed {print_count}&times;</span>
{#if event_badge_obj.print_first_datetime}
<span class="opacity-50">&middot;</span>
<span>{ae_util.iso_datetime_formatter(event_badge_obj.print_first_datetime, 'date_full_no_year')} {ae_util.iso_datetime_formatter(event_badge_obj.print_first_datetime, 'time_12_long')}</span>
<span>{ae_util.iso_datetime_formatter(event_badge_obj.print_first_datetime, 'date_full_no_year', null, true)} {ae_util.iso_datetime_formatter(event_badge_obj.print_first_datetime, 'time_12_long', null, true)}</span>
{/if}
{#if event_badge_obj.print_last_datetime && event_badge_obj.print_last_datetime !== event_badge_obj.print_first_datetime}
<span class="opacity-50">&middot;</span>
<span>last print: {ae_util.iso_datetime_formatter(event_badge_obj.print_last_datetime, 'date_full_no_year')} {ae_util.iso_datetime_formatter(event_badge_obj.print_last_datetime, 'time_12_long')}</span>
<span>last print: {ae_util.iso_datetime_formatter(event_badge_obj.print_last_datetime, 'date_full_no_year', null, true)} {ae_util.iso_datetime_formatter(event_badge_obj.print_last_datetime, 'time_12_long', null, true)}</span>
{/if}
</div>
{/if}
@@ -472,14 +472,18 @@ let visible_badge_obj_li = $derived(
<span class="font-bold opacity-50">CR:</span>
{ae_util.iso_datetime_formatter(
event_badge_obj.created_on,
'datetime_iso_12_no_seconds'
'datetime_iso_12_no_seconds',
null,
true
)}
</span>
<span class="flex items-center gap-1">
<span class="font-bold opacity-50">UP:</span>
{ae_util.iso_datetime_formatter(
event_badge_obj.updated_on,
'datetime_iso_12_no_seconds'
'datetime_iso_12_no_seconds',
null,
true
)}
</span>
<span class="flex items-center gap-1">
@@ -491,7 +495,9 @@ let visible_badge_obj_li = $derived(
{event_badge_obj.print_first_datetime
? ae_util.iso_datetime_formatter(
event_badge_obj.print_first_datetime,
'datetime_iso_12_no_seconds'
'datetime_iso_12_no_seconds',
null,
true
)
: '—'}
</span>
@@ -500,7 +506,9 @@ let visible_badge_obj_li = $derived(
{event_badge_obj.print_last_datetime
? ae_util.iso_datetime_formatter(
event_badge_obj.print_last_datetime,
'datetime_iso_12_no_seconds'
'datetime_iso_12_no_seconds',
null,
true
)
: '—'}
</span>