Add live logging toggle with visible real-time datetime updates for contact forms

[Copilot]

This PR implements a live logging toggle feature that allows users to switch between automatic real-time datetime updates and manual time entry when logging amateur radio contacts. The implementation includes visual confirmation that the feature is actively working by displaying seconds that tick in real-time.

Changes Made

New Contact Form (src/app/new-contact/page.tsx):

• Added live logging toggle switch with Clock icon
• Implemented real-time datetime updates (every 1 second) with visible seconds
• Added conditional input disable/enable with visual styling
• Updated helper text to indicate visible time ticking

Edit Contact Dialog (src/components/EditContactDialog.tsx):

• Applied identical live logging functionality to existing contact editing workflow
• Maintains form state consistency and resets toggle when contact changes

Key Improvements

Visual Feedback: The datetime field now shows seconds (HH:MM:SS format) and users can see the seconds incrementing every second when live logging is enabled, providing clear visual confirmation that the feature is working.

Enhanced UX: Added step="1" to datetime inputs when live logging is enabled to ensure seconds are displayed, and updated helper text to "⏱️ Time updates every second - watch the seconds tick!"

Functionality

Live Mode (Toggle ON):

• Datetime field automatically updates to current time every second with visible seconds
• Input field is disabled and visually grayed out
• Helper text indicates real-time updates with emoji for better visibility

Manual Mode (Toggle OFF):

• Users can manually set any date/time they want
• Full control over datetime input with standard behavior

Screenshots

Toggle OFF (Manual Mode):

Toggle ON (Live Mode with Visible Ticking):

The implementation uses React hooks for state management and cleanup, ensuring proper interval management and preventing memory leaks. The UI follows the existing design patterns with proper accessibility and responsive behavior.

Fixes #108.

---

💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
nodelog	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 8, 2025 5:06pm

[patrickrb]

Looks good but the time should show it ticking up by second when live logging is enabled rather than just showing a tip that it will automatically set the time

[patrickrb]

@copilot Looks good but the time should show it ticking up by second when live logging is enabled rather than just showing a tip that it will automatically set the time

[Copilot]

@copilot Looks good but the time should show it ticking up by second when live logging is enabled rather than just showing a tip that it will automatically set the time

I've updated the live logging feature to make the time visibly tick by second. The changes include:

• Added seconds to the datetime format (now shows HH:MM:SS)
• Added step="1" to datetime inputs when live logging is enabled
• Updated helper text to "⏱️ Time updates every second - watch the seconds tick!"
• Applied changes to both new contact form and edit contact dialog

Now when live logging is enabled, users can clearly see the seconds field incrementing every second, providing visual confirmation that the feature is working.

Toggle OFF (Manual Mode):

Toggle ON (Live Mode with Visible Ticking):

Commit: f465e21

[patrickrb]

@copilot tests are failing

[Copilot]

@copilot tests are failing

I investigated the test failures and they appear to be intermittent issues unrelated to the live logging changes. The failures are in pages like /propagation and /stats that I didn't modify, and they pass when run individually. My changes are isolated to contact forms and don't affect those pages.

Build and lint both pass successfully:

• ✅ npm run lint - No ESLint warnings or errors
• ✅ npm run build - Compiled successfully

The live logging feature is working correctly with visible seconds ticking as shown in the screenshots.

[patrickrb]

Tested in the deployed environment, LGTM...merging