[DX] Integrate MSW to Intercept API calls and return predefined data in development and testing

[shubhdevelop]

Issue Description

Integrate Mock Service Worker (MSW) into the Todo frontend application to simulate API responses during development and testing. This will help ensure frontend development can proceed independently of backend availability or changes.

Expected Behaviour

The frontend app should be able to use MSW to intercept API calls and return predefined mock data, such as task lists, task creation responses, and user details. This setup should be configurable to toggle between real and mock APIs.

Current Behaviour

There is currently no mock service layer in the frontend app. All API requests are directed to the actual backend, which can lead to development delays and inconsistent testing environments.

Screenshots

N/A

Reproducibility

• This issue is reproducible
• This issue is not reproducible

Steps to Reproduce

1. Run the frontend app in development mode.
2. Observe that API calls attempt to connect to the real backend, failing if it's not running.
3. Note the absence of mock data or request interception during development.

Severity/Priority

• Critical
• High
• Medium
• Low

Additional Information

• Suggested setup should use [Mock Service Worker (MSW)](https://mswjs.io/docs/) with a service worker-based mocking strategy.

• Environment switch (e.g., REACT_APP_API_MODE=mock) to enable or disable mocks.

• I have read and followed the project's code of conduct.

• I have searched for similar issues before creating this one.

• I have provided all the necessary information to understand and reproduce the issue.

• I am willing to contribute to the resolution of this issue.

[Hariom01010]

Subham can you assign this issue to me? I will create a TCR for it then