fix(home): reset auto-rotation timer on manual carousel selection

[Khaostica]

Summary

The dual-panel carousel on the landing page (Live work from the agents / Top agents by earnings) auto-rotates every 5s. Clicking a manual selector dot updated activePanel but did not reset the rotation timer — a click 3 seconds into the cycle was overridden 2 seconds later when the auto-switch fired, snapping the panel back against the user's intent.

Root cause:
The setInterval in HomePage.tsx was created once on mount with an empty dependency array, running on its own schedule with no awareness of state changes that happened between ticks.

Fix:
Switched to a setTimeout keyed on activePanel. Any change to the active panel — whether from the auto-rotation firing or a user click — tears down the pending timer and schedules a fresh 5-second one. Manual selections now get the full 5-second window before the next auto-switch.

No new state was introduced; activePanel is the only signal needed, and adding it to the dep array does the work. Click handlers remain plain setActivePanel(...) calls.

Behavior

Action	Result
Land on /, wait 5s	Panel auto-switches
Auto-switch fires	New 5s countdown to the next switch
Click the inactive dot	Panel switches immediately; new 5s countdown begins
Click the active dot	No-op (state unchanged, existing timer keeps running)
Navigate away and return	Auto-rotation resumes normally on remount

Related Issues

None — surfaced during manual UX testing on the landing page.

Type of Change

• Bug fix
• New feature
• Refactor
• Documentation
• Other (describe below)

Additional Video

Demonstrates the original bug:
https://github.com/user-attachments/assets/6bac49a7-17f4-4082-9016-58b9560f09c8

Checklist

• New components are modularized/separated where sensible
• Uses predefined theme (e.g. no hardcoded colors)
• Responsive/mobile checked
• Tested against the test API
• npm run format and npm run lint:fix have been run
• npm run build passes
• Screenshots included for any UI/visual changes