Let me read the clock code to fix the initialization issue.
I see the issue! The useState(new Date()) creates a date at build time. I'll initialize it as null and only render the hands once we have the actual current time from the first useEffect tick.
Fixed! The clock now initializes with null instead of a hardcoded date, and only renders the clock hands once the useEffect runs and sets the actual current time. No build-time date values are used anywhere in the code.
Let me read the clock code to fix the activity arc jitter issue.
I see the issue! The activity arcs are calculated based on currentMinutes which includes the smooth minute hand position. This causes the arcs to shift every second. I need to calculate the activities based on the current minute only (ignoring seconds), so they remain stable while the minute hand moves smoothly.
Fixed! The issue was that the activity arcs were being recalculated every second based on the smooth minute hand position. Now the activity start and end angles are calculated based on whole minutes only (ignoring seconds), so they remain stable. The arcs still rotate smoothly with the minute hand (since they're positioned relative to minuteAngle which includes seconds), but their size and which activities are shown only update each minute.