BUG: Missing React Error Boundary causes app crashes

### Is there an existing issue for this?

- [x] I have searched the existing issues

### What happened?

Hi @rahulharpal1603 ,
While checking out the new steps to run the sync-microservice separately i encountere sometimes the app crahesh bluntly leaving a white screen after it i come to know that the application has no React Error Boundary Component.

How to reproduce:
- Run the command: npm run tauri dev and other backend & sync-microservice command
- trigger any unhandled javascript error(as the error happens rarely so we need to triger manually)
- for ex. add this to Home.tsx
const brokenData = undefined;
return

// Crashes!
- The entire app crashes and turns into a blank white screen

Real world scenarios where this could possibly happen:
- Image path is missing
- Networks fails mid-load (most probably happened in my case)

The Solution:
- Create an ErrorBoundary component
- Wrap the main component with the ErrorBoundary in main.tsx
- Display a fallback UI with error details and a “Reload” button

Reference: https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary

### Record

- [x] I agree to follow this project's Code of Conduct