feat: Phase 1 - Angular to React Service Layer Migration #1
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
feat: Phase 1 - Angular to React Service Layer Migration
Summary
This PR implements Phase 1 of migrating the service layer from Angular to React-native patterns. Creates new React service implementations for
AuthorService
andCommentService
that use the nativefetch
API instead of Angular's$http
service, while maintaining identical API contracts and caching behavior.Key changes:
src/services/AuthorService/reactService.js
- Replaces$http.get()
withfetch()
, preserves ID-based caching via reducesrc/services/CommentService/reactService.js
- Replaces$http.get()
withfetch()
, preserves array-based cachingqueryComments()
,getComments()
,setComments()
for CommentService andqueryAuthors()
,getAuthor(id)
,setAuthors()
for AuthorServicethis.authors = {}
, CommentService leavesthis.comments
undefined until first setCritical implementation detail: Angular's
$http.get(URI)
returns{data: response}
whilefetch(URI)
returns a Response object requiring.json()
to extract data. The new services handle this withfetch(URI).then(resp => resp.json()).then(data => ...)
.Note: These are standalone React service files that are not yet integrated into the application. React components still use
getAngularService()
to access the Angular services. Integration will be a future phase.Review & Testing Checklist for Human
Risk Level: 🟡 Medium - No automated tests exist for service behavioral equivalence
npm run api
) and manually test both new React services in browser console to verify they fetch and cache data correctlythis.authors = {}
while CommentService leavesthis.comments
undefined (matching Angular behavior)Notes
These React services maintain identical API contracts but are completely separate from the existing Angular services. Future phases will integrate them into React components and eventually replace the Angular services entirely.
Link to Devin run: https://app.devin.ai/sessions/092892afdcd043f8b5bbe4509847c6f6
Requested by: @benc-a11y