refactor(frontend): improve SyncStatusButton UX with smooth async

[ivanskv2000]

✨ What’s Changed?

Refactored the SyncStatusButton.vue component to provide a more polished and reliable synchronization experience:

• Async Operation Handling: The handleRefresh method is now async and correctly awaits queryClient.invalidateQueries().
• Smooth UX (No Blinks): Introduced a minimum animation duration of 600ms using Promise.all and setTimeout. This ensures that even for very fast network responses, the refresh icon performs a deliberate, smooth rotation instead of a high-speed flash.
• Enhanced Toast Feedback: Integrated useEnhancedToast to provide contextual feedback:
  • Success: Shows a toast confirming data synchronization.
  • Error: Shows a targeted "Sync Failed" toast.
• Duplicate Toast Prevention: Implemented a silent flag on caught errors and updated the global error handler in App.vue to respect it, preventing redundant notifications for the same event.
• Improved State Tracking: Combined local isSyncing with TanStack's useIsFetching to maintain a consistent UI state during the entire refresh sequence.

🧪 How to Test It

1. Click the Refresh/Sync button in the header.
2. Verify the icon rotates smoothly for at least 600ms.
3. Observe the "Data synchronized" success toast upon completion.
4. (Optional) Simulate a network failure and verify the "Sync Failed" toast appears without a duplicate global error toast.
5. Automated tests: Run npm run test:unit -- SyncStatusButton.spec.ts in the frontend directory.

📂 Scope

• frontend
• backend
• common/shared
• CI/config

📝 Notes (Optional)

Added a new unit test file SyncStatusButton.spec.ts to ensure the async logic and toast triggering are correctly verified.

✅ Checklist

• PR title uses Conventional Commit format
• Code is clean and commented where needed
• I’ve manually tested relevant parts
• I’ve updated docs (if needed)

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud