Skip to content

PR 3/6: React Migration — Shared & Layout Components#44

Open
devanshi-gpta wants to merge 1 commit into
react-migration/api-and-contextfrom
react-migration/shared-and-layout
Open

PR 3/6: React Migration — Shared & Layout Components#44
devanshi-gpta wants to merge 1 commit into
react-migration/api-and-contextfrom
react-migration/shared-and-layout

Conversation

@devanshi-gpta

@devanshi-gpta devanshi-gpta commented Jun 24, 2026

Copy link
Copy Markdown

Summary

Third PR in the 6-part Angular→React migration. Ports all shared/layout components used across pages.

Layout:

  • Header — nav with <NavLink> for active tab styling, renders different nav items based on authState (loading/unauthenticated/authenticated/unavailable)
  • Footer — static footer with year and attribution

Shared components:

  • ListErrors — renders Errors.errors object as <ul class="error-messages">
  • ArticleMeta — author avatar + username link + formatted date, accepts children for action buttons
  • ArticlePreview — article card with ArticleMeta, FavoriteButton, tag list, and <Link> to article
  • ArticleList — fetches paginated articles via queryArticles, renders ArticlePreview list with pagination buttons and empty-feed messaging
  • ArticleComment — comment card with author info, body, date, and conditional delete icon
  • FavoriteButton — auth-gated toggle calling favoriteArticle/unfavoriteArticle
  • FollowButton — auth-gated toggle calling followUser/unfollowUser

Link to Devin session: https://app.devin.ai/sessions/6215127f80d4463cad3055cf81b87f0c
Requested by: @devanshi-gpta


Devin Review

Status Commit
⚪ Not started

Run Devin Review

Open in Devin Review (Staging)

- Header component with NavLink for active route highlighting
- Footer component with year and attribution
- ListErrors component for form error display
- ArticleMeta component with author avatar, name, and date
- ArticlePreview component with favorite toggle
- ArticleList component with pagination and loading state
- ArticleComment component with delete option for comment authors
- FavoriteButton component with auth-gated favoriting
- FollowButton component with auth-gated following

Co-Authored-By: Devanshi Gupta <devanshi.gupta@cognition.ai>
@devin-ai-integration

Copy link
Copy Markdown

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment, CI, and merge conflict monitoring

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant