UI: Add a modern dashboard loading spinner during API fetch requests

[knoxiboy]

🐞 Description

Resolves #1300.
Adds a loading state to task fetching and surfaces it in the Dashboard, displaying a modern animated spinner instead of an empty screen while data is retrieved.

💻 Expected Behavior

• Extracts loading state from useTasks hook.
• Conditionally renders a reusable LoadingSpinner component while loading is true.
• Integrated role=status and aria-live=polite tags for optimal accessibility.

🖼️ Screenshots / Logs (if applicable)

N/A

✅ Checklist

• Added generic LoadingSpinner component
• Implemented loading state toggle during API fetch operations
• Added ARIA accessibility tags to the spinner
• Tested locally

[Copilot]

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

Adds a loading state to task fetching and surfaces it in the Dashboard to display a spinner while tasks are being loaded.

Changes:

• Extend useTasks to expose a loading boolean and manage it around getTasks().
• Update Dashboard to render a LoadingSpinner while tasks are loading.
• Introduce a reusable LoadingSpinner component.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 3 comments.

File	Description
frontend/src/pages/Dashboard.jsx	Uses useTasks().loading to conditionally render a spinner vs. the stats content
frontend/src/hooks/useTasks.js	Adds and returns loading state, toggled around task fetch lifecycle
frontend/src/components/common/LoadingSpinner.jsx	New shared spinner component for loading UI

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.