Description:

The goal of this task is to replace the existing state management and API interaction logic involving localItems, client.js, serviceApi, and processingStatus with React Query's built-in mutation and refetching mechanisms.

Acceptance Criteria:

• Use React Query's mutation instead of client.js and serviceApi
• Optimistic Updates.
• Delete the local state (localItems and processingStatus) while maintaining functionality
• Implement refetching logic for updated data after mutations, ensuring that the UI remains consistent.
• Verify that the application handles errors gracefully using React Query's error handling features.
• Ensure tests are updated or added to cover the refactored functionality.

Notes:

Use React Query's useMutation for mutation operations and queryClient.invalidateQueries for refetching updated data.
Align the implementation with existing patterns in the codebase for consistency.
This refactor will improve data fetching consistency, reduce manual state management, and leverage React Query's powerful caching and synchronization features.