Skip to content

Add global 24-hour time format setting#2704

Merged
jmthomas merged 4 commits intomainfrom
24-hour-time-picker-setting
Jan 3, 2026
Merged

Add global 24-hour time format setting#2704
jmthomas merged 4 commits intomainfrom
24-hour-time-picker-setting

Conversation

@jmthomas
Copy link
Copy Markdown
Member

@jmthomas jmthomas commented Jan 1, 2026

Summary

Closes #1812
Closes #2268

  • Add a new Time Format setting in Admin Settings (next to Time Zone) that allows users to choose between 12-hour (AM/PM) and 24-hour time display format
  • Create a new OpenC3TimePicker component that respects the global setting and replaces all native HTML5 time inputs
  • Support both direct text input and visual clock picker with OK/Cancel buttons
  • Parse both 24-hour (HH:mm:ss) and 12-hour (HH:mm:ss AM/PM) input formats

Affected tools: Data Viewer, Data Extractor, Telemetry Viewer, Calendar (Activities, Notes, Metadata), Graph Edit Dialog, TimeWidget

Test plan

  • Go to Admin > Settings and verify the new "Time Format" setting appears below "Time Zone"
  • Set to "24-hour" and verify time pickers display in 24-hour format (e.g., 14:30:00)
  • Set to "12-hour (AM/PM)" and verify time pickers display with AM/PM (e.g., 02:30:00 PM)
  • Click the clock icon to open visual picker, select time, click OK - verify it saves
  • Click the clock icon, select time, click Cancel - verify it reverts
  • Type time directly in the field (both formats) and verify it parses correctly
  • Test in Data Viewer, Data Extractor, Telemetry Viewer playback, and Calendar dialogs

🤖 Generated with Claude Code

Add a new Time Format setting in Admin Settings that allows users to
choose between 12-hour (AM/PM) and 24-hour time display format for all
time pickers in COSMOS.

Changes:
- Add TimeFormatSettings.vue component in Admin Settings tab
- Create OpenC3TimePicker.vue component that respects the global setting
- Replace all v-text-field type="time" inputs with OpenC3TimePicker
- Support both direct text input and visual clock picker
- Parse both 24-hour (HH:mm:ss) and 12-hour (HH:mm:ss AM/PM) input formats

Affected tools: Data Viewer, Data Extractor, Telemetry Viewer,
Calendar (Activities, Notes, Metadata), Graph Edit Dialog, TimeWidget

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <[email protected]>
@jmthomas
Copy link
Copy Markdown
Member Author

jmthomas commented Jan 1, 2026

Screenshot 2026-01-01 at 4 08 12 PM Screenshot 2026-01-01 at 4 08 32 PM

@codecov
Copy link
Copy Markdown

codecov bot commented Jan 1, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 78.27%. Comparing base (f3d5ff5) to head (6813e44).
⚠️ Report is 25 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #2704      +/-   ##
==========================================
- Coverage   79.31%   78.27%   -1.04%     
==========================================
  Files         662      473     -189     
  Lines       52588    34164   -18424     
  Branches      734      734              
==========================================
- Hits        41708    26743   -14965     
+ Misses      10800     7341    -3459     
  Partials       80       80              
Flag Coverage Δ
python 96.00% <ø> (+14.62%) ⬆️
ruby-api 84.76% <ø> (-0.06%) ⬇️
ruby-backend 82.15% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Copy link
Copy Markdown
Contributor

@clayandgen clayandgen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Took a bit of time to get used to it, but I like it!
Looks like Command History and Log Explorer use a different time picker -- I can add a follow-up ticket after this one is merged. I do like the time picker in Command History, but I don't think it supports 24 hr format.

I think we can say this one also closes #2268

@jmthomas jmthomas merged commit 5661422 into main Jan 3, 2026
45 of 49 checks passed
@jmthomas jmthomas deleted the 24-hour-time-picker-setting branch January 3, 2026 00:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

When time is UTC, time pickers should be 24hr All time pickers can be set to 24 hour mode

2 participants