From 631a77158c26f71fab2adac89b14e44f18c17b66 Mon Sep 17 00:00:00 2001 From: Scott Idem Date: Fri, 15 May 2026 14:29:57 -0400 Subject: [PATCH] feat(pres_mgmt): replace time_hours/time_format/datetime_format with single use_12h toggle MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Three redundant store fields encoding the same AM/PM choice replaced with a single `use_12h: boolean` in PresMgmtLocState. iso_datetime_formatter gains a third param (use_12h: boolean | null = null) that auto-resolves 24h↔12h format name variants via a symmetric FORMAT_PAIRS lookup — null default leaves all ~100 existing call sites intact. Toggle surfaces in three places: Clock icon in session time chip (hidden button, same visual), event Options modal Display section, and session Options modal Display section. Co-Authored-By: Claude Sonnet 4.6 --- src/lib/ae_utils/ae_utils__datetime_format.ts | 32 ++++++++++++++++++- .../ae_events_stores__pres_mgmt_defaults.ts | 8 ++--- .../(pres_mgmt)/event_page_menu.svelte | 20 ++++++++++++ .../[session_id]/session_page_menu.svelte | 29 ++++++++++++++++- .../session/[session_id]/session_view.svelte | 23 +++++++++---- .../ae_comp__event_presentation_obj_li.svelte | 25 ++++----------- 6 files changed, 104 insertions(+), 33 deletions(-) diff --git a/src/lib/ae_utils/ae_utils__datetime_format.ts b/src/lib/ae_utils/ae_utils__datetime_format.ts index 3b9dd24d..926ed635 100644 --- a/src/lib/ae_utils/ae_utils__datetime_format.ts +++ b/src/lib/ae_utils/ae_utils__datetime_format.ts @@ -1,9 +1,33 @@ import dayjs from 'dayjs'; +// Format pairs: [24h base, 12h variant]. Only formats with both variants are listed. +// Formats without a counterpart (ISO, date-only, week, etc.) are intentionally omitted — +// iso_datetime_formatter passes those through unchanged regardless of use_12h. +const FORMAT_PAIRS: [string, string][] = [ + ['datetime_iso_no_seconds', 'datetime_iso_12_no_seconds'], + ['datetime_short', 'datetime_12_short'], + ['datetime_medium', 'datetime_12_medium'], + ['datetime_long', 'datetime_12_long'], + ['datetime_medium_sec', 'datetime_12_medium_sec'], + ['time_long', 'time_12_long'], + ['time_short', 'time_12_short'], + ['time_short_no_leading', 'time_12_short_no_leading'], +]; + +// Build lookup maps from the pairs above. Both directions are derived from the same source. +const TO_12H: Record = Object.fromEntries( + FORMAT_PAIRS.map(([h24, h12]) => [h24, h12]) +); +const TO_24H: Record = Object.fromEntries( + FORMAT_PAIRS.map(([h24, h12]) => [h12, h24]) +); + export const iso_datetime_formatter = function iso_datetime_formatter( raw_datetime: null | string | Date = null, named_format: string = 'datetime_iso_no_seconds', // date_iso, datetime_iso_no_seconds - time_24_hours: boolean = false + // 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 ) { // console.log('*** iso_datetime_formatter() ***'); @@ -50,6 +74,12 @@ export const iso_datetime_formatter = function iso_datetime_formatter( raw_datetime = new Date(); // Get the current datetime if one was not passed. } + if (use_12h !== null) { + named_format = use_12h + ? (TO_12H[named_format] ?? named_format) + : (TO_24H[named_format] ?? named_format); + } + let datetime_string = null; switch (named_format) { diff --git a/src/lib/stores/ae_events_stores__pres_mgmt_defaults.ts b/src/lib/stores/ae_events_stores__pres_mgmt_defaults.ts index 27d1652d..0b323396 100644 --- a/src/lib/stores/ae_events_stores__pres_mgmt_defaults.ts +++ b/src/lib/stores/ae_events_stores__pres_mgmt_defaults.ts @@ -84,9 +84,7 @@ export interface PresMgmtLocState { lock_config: boolean; // --- Query / search preferences --- - datetime_format: string; - time_format: string; - time_hours: 12 | 24; + use_12h: boolean; qry_enabled: 'all' | 'not_enabled' | 'enabled'; qry_hidden: 'all' | 'hidden' | 'not_hidden'; qry_limit__files: number; @@ -265,9 +263,7 @@ export const pres_mgmt_loc_defaults: PresMgmtLocState = { lock_config: false, // Query / search - datetime_format: 'datetime_12_long', - time_format: 'time_12_short', - time_hours: 12, + use_12h: true, qry_enabled: 'enabled', qry_hidden: 'not_hidden', qry_limit__files: 75, diff --git a/src/routes/events/[event_id]/(pres_mgmt)/event_page_menu.svelte b/src/routes/events/[event_id]/(pres_mgmt)/event_page_menu.svelte index d666fdb4..3042d76c 100644 --- a/src/routes/events/[event_id]/(pres_mgmt)/event_page_menu.svelte +++ b/src/routes/events/[event_id]/(pres_mgmt)/event_page_menu.svelte @@ -10,6 +10,7 @@ import { goto } from '$app/navigation'; import { Modal } from 'flowbite-svelte'; import { Archive, + Clock, Info, MapPin, Plane, @@ -194,6 +195,25 @@ async function on_delete(method: 'delete' | 'disable') { + + +
+

+ Display +

+ +
+ {#if $ae_loc.trusted_access}
diff --git a/src/routes/events/[event_id]/(pres_mgmt)/session/[session_id]/session_view.svelte b/src/routes/events/[event_id]/(pres_mgmt)/session/[session_id]/session_view.svelte index 933c42ad..aef30513 100644 --- a/src/routes/events/[event_id]/(pres_mgmt)/session/[session_id]/session_view.svelte +++ b/src/routes/events/[event_id]/(pres_mgmt)/session/[session_id]/session_view.svelte @@ -220,8 +220,8 @@ $effect(() => { {:else} -
-
+ {/if} @@ -229,19 +229,28 @@ $effect(() => {
- + {ae_util.iso_datetime_formatter( $lq__event_session_obj.start_datetime, 'dddd' )}, {ae_util.iso_datetime_formatter( $lq__event_session_obj.start_datetime, - pres_mgmt_loc.current.datetime_format + 'datetime_long', + pres_mgmt_loc.current.use_12h )} – {ae_util.iso_datetime_formatter( $lq__event_session_obj.end_datetime, - pres_mgmt_loc.current.time_format + 'time_short', + pres_mgmt_loc.current.use_12h )}
@@ -270,7 +279,7 @@ $effect(() => { })}> Start: - {ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, pres_mgmt_loc.current.datetime_format)} + {ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'datetime_long', pres_mgmt_loc.current.use_12h)} @@ -290,7 +299,7 @@ $effect(() => { })}> End: - {ae_util.iso_datetime_formatter($lq__event_session_obj.end_datetime, pres_mgmt_loc.current.datetime_format)} + {ae_util.iso_datetime_formatter($lq__event_session_obj.end_datetime, 'datetime_long', pres_mgmt_loc.current.use_12h)} diff --git a/src/routes/events/ae_comp__event_presentation_obj_li.svelte b/src/routes/events/ae_comp__event_presentation_obj_li.svelte index 1b3893d3..5b4391cb 100644 --- a/src/routes/events/ae_comp__event_presentation_obj_li.svelte +++ b/src/routes/events/ae_comp__event_presentation_obj_li.svelte @@ -171,11 +171,10 @@ import { 'dddd' )} @ - - {ae_util.iso_datetime_formatter( event_presentation_obj.start_datetime, - pres_mgmt_loc.current.time_format + 'time_short', + pres_mgmt_loc.current.use_12h )} @@ -247,19 +246,7 @@ import { @@ -283,7 +270,8 @@ import { )} {ae_util.iso_datetime_formatter( event_presentation_obj.start_datetime, - pres_mgmt_loc.current.time_format + 'time_short', + pres_mgmt_loc.current.use_12h )} - @@ -301,7 +289,8 @@ import { })}> {ae_util.iso_datetime_formatter( event_presentation_obj.end_datetime, - pres_mgmt_loc.current.time_format + 'time_short', + pres_mgmt_loc.current.use_12h )}