TRCKR-305 - trckr

← TRCKR-305

enhancement web ui

Created: 2025-12-12 • Updated: 2025-12-16

Relationships Loading...

When editing an issue, the 'created' timestamp should display as a full local datetime with timezone information, not just a relative time or abbreviated format.

## Current Behavior
The created timestamp in the issue edit modal likely shows:
- A relative time ('2 days ago')
- Or an abbreviated date ('Dec 11')
- Or a UTC timestamp without timezone context

## Desired Behavior
Display the created timestamp as a full, human-readable local datetime with timezone:
- Example: 'December 11, 2025 at 5:30 PM PST'
- Or ISO-like: '2025-12-11 17:30:00 PST'
- Convert from stored UTC to user's local timezone

## Implementation

1. **Server-side option**:
   - Pass timezone info to template
   - Format datetime in Python before sending to template
   - Requires knowing user's timezone (from browser or settings)

2. **Client-side option** (recommended):
   - Send UTC timestamp to browser
   - Use JavaScript to convert and format in local timezone
   ```javascript
   const date = new Date('2025-12-11T17:30:00Z');
   const formatted = date.toLocaleString('en-US', {
     dateStyle: 'full',
     timeStyle: 'long',
     timeZoneName: 'short'
   });
   ```

3. **Template changes**:
   - Add a `<time>` element with datetime attribute
   - JavaScript formats it on page load

## Acceptance Criteria
- [ ] Created timestamp shows full date and time
- [ ] Time is converted to user's local timezone
- [ ] Timezone abbreviation is displayed (PST, EST, etc.)
- [ ] Format is human-readable (not raw ISO string)
- [ ] Read-only display (created date shouldn't be editable)

Pull Requests (comma-separated URLs)

Attachments

Comments (2)

joe · 2025-12-12

Add a formatted datetime stamp, not the raw " 2025-12-12T02:22:09.142374+00:00 " that I see now

agent · 2025-12-12

Fixed the created timestamp display in the issue edit modal. ## Changes Made **File: server/templates/modals/issue_detail.html** 1. **Line 58-67**: Changed the Created field from displaying only the first 10 characters (date only) to using a `<time>` element with the full UTC timestamp in the `datetime` attribute. 2. **Lines 281-302**: Added `formatTimestamps()` JavaScript function that: - Queries all `<time class='timestamp'>` elements on page load - Reads the UTC timestamp from the `datetime` attribute - Converts to local timezone using JavaScript's `Date.toLocaleString()` - Formats with `dateStyle: 'full', timeStyle: 'long', timeZoneName: 'short'` - Example output: 'Wednesday, December 11, 2025 at 7:22:09 PM PST' 3. The function runs automatically on page load to format all timestamps ## Testing - All 1229 tests passed (39 skipped) - No test failures - Merge conflict with TRCKR-306 (description editing) resolved successfully ## Verification The created timestamp now displays as a full, human-readable local datetime with timezone information instead of just the abbreviated date.