Phase 1: Angular to React Migration - Setup and Foundation#159
Open
devin-ai-integration[bot] wants to merge 1 commit intomasterfrom
Open
Phase 1: Angular to React Migration - Setup and Foundation#159devin-ai-integration[bot] wants to merge 1 commit intomasterfrom
devin-ai-integration[bot] wants to merge 1 commit intomasterfrom
Conversation
- Set up React + TypeScript project using Vite for fast development - Configure React Router with all routes from Angular app: - Feed routes: /news/:page, /newest/:page, /show/:page, /ask/:page, /jobs/:page - Item details: /item/:id (lazy loaded) - User profile: /user/:id (lazy loaded) - Default redirect from / to /news/1 - Port HackerNewsAPIService to React: - Created services/hackerNewsApi.ts with fetch-based API calls - Created hooks/useHackerNews.ts with React Query hooks - Supports fetchFeed, fetchItemContent, fetchPollContent, fetchUser - Port SettingsService to React Context API: - Created context/SettingsContext.tsx with full settings management - Supports theme switching (default, night, amoled) - localStorage persistence for all settings - System preferred color scheme detection - Add TypeScript type definitions for all models: - Story, User, Comment, PollResult, FeedType, Settings Co-Authored-By: piyush@cognition.ai <piyush@cognition.ai>
Author
🤖 Devin AI EngineerI'll be helping with this pull request! Here's what you should know: ✅ I will automatically:
Note: I can only respond to comments from users who have write access to this repository. ⚙️ Control Options:
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Phase 1: Angular to React Migration - Setup and Foundation
Summary
This PR establishes the React foundation for migrating the Angular 9 Hacker News PWA to React. A new
react-app/directory contains a complete React + TypeScript project with Vite, implementing the core services and routing structure from the original Angular application.Key changes include:
/item/:idand/user/:idroutesHackerNewsAPIServiceported to a fetch-based service with React Query hooks (useFeed,useItem,useUser)SettingsServiceported to React Context API with localStorage persistence and system color scheme detectionThis is Phase 1 only - no UI styling or component migration is included.
Review & Testing Checklist for Human
https://node-hnapi.herokuapp.com- confirm this API is still operational (Heroku free tier was deprecated)UserProfile.tsxusesdangerouslySetInnerHTMLfor user.about field - assess XSS risk from API responsescd react-app && npm install && npm run devand verify routes work:/news/1,/newest/1,/show/1,/ask/1,/jobs/1/item/:id)/user/:id)Notes
fetchItemContentassumes sequential poll IDs (matching Angular implementation) - this may need validation against actual poll itemspackage-lock.jsonwas committed - recommend runningnpm installto generate one for reproducible buildsnpm run buildandnpm run lintboth succeedLink to Devin run: https://app.devin.ai/sessions/c5d7b7af4e534d9297f47b69695b2786
Requested by: piyush@cognition.ai