Fix/issue 3931 progress bar jitter

[pradeep0153]

Closes #3931.

Description

This PR fixes a highly distracting visual glitch where the global "Course Completion %" circular progress bar in the main navigation header would rapidly flicker back and forth when a student manually skipped ahead on a video timeline.

Changes Made

• Audited the timeupdate event handler inside the video player that calculates the percentage watched and emits state updates to the global Redux store.
• Discovered a flawed mathematical calculation: the logic was calculating the watched percentage simply by taking the raw currentTime and dividing it by duration. When a user clicked ahead, unbuffered and unwatched segments of the video temporarily confused the browser's internal timer, causing currentTime to rapidly fluctuate wildly for a few milliseconds while it buffered.
• Refactored the tracking logic. The percentage is now calculated based on the cumulative accumulation of actual viewed segments tracked in a dedicated array, completely ignoring the raw, volatile currentTime property during active seeking.
• Implemented a Redux debouncer so that the global state (and the resulting expensive UI re-render of the header) is only dispatched every 5 seconds, rather than 4 times a second.

Impact

• Polished UI & Performance: Constant, erratic flickering of a high-visibility UI element makes the entire application feel cheap, broken, and poorly engineered. Furthermore, forcing the global application header to re-render 4 times a second based on micro-updates to the video timeline was wasting massive amounts of CPU cycles. By smoothing out the mathematical tracking logic and throttling the global state updates, the progress bar now increments smoothly and reliably, saving battery life and providing a much more premium feel.