chore(angular-react): Migrate FavoriteButtonComponent to React

[devin-ai-integration]

Summary

Adds a React equivalent of the Angular FavoriteButtonComponent at src/app/features/article/components/FavoriteButton.tsx. This is a 1:1 migration as part of an Angular-to-React conversion effort. The original Angular component is not removed.

Key translation decisions:

• Angular signal() (isSubmitting) → useState
• @Output() toggle EventEmitter → onToggle callback prop
• @Input() article → article prop with locally-defined Article interface
• RxJS switchMap / takeUntilDestroyed → async/await with useCallback
• <ng-content> → props.children
• Injected services (ArticlesService, UserService, Router) → callback props (onFavorite, onUnfavorite, isAuthenticated, onNavigateToRegister) with TODO comments for future wiring

Updates since last revision

• Fixed false onToggle emission: When onFavorite/onUnfavorite callbacks are not provided, the component now returns early instead of falling through to onToggle, which would have falsely signalled a state change to the parent. This matches the Angular original where toggle.emit() only fires after a real service response.

Review & Testing Checklist for Human

• Article interface duplication: The Article interface is redefined locally instead of importing from the existing shared model. Verify it matches the canonical Article type in src/app/core/api-types/ and decide whether to extract a shared type file.
• Silent error swallowing: The catch {} block (L85) is a no-op, matching the Angular version's empty error callback. Confirm this is acceptable or if errors should be surfaced/logged.
• No type-checking in current project: React and @types/react are not installed in this Angular project, so this file cannot be compiled or rendered yet. Manually review the TypeScript for correctness.
• Test plan: Once React is bootstrapped in the project, render <FavoriteButton article={mockArticle} isAuthenticated={true} onFavorite={...} onUnfavorite={...}>♥ 5</FavoriteButton> and verify: (1) correct CSS class toggles between btn-primary/btn-outline-primary based on favorited, (2) button disables during submission, (3) unauthenticated users trigger onNavigateToRegister, (4) omitting onFavorite/onUnfavorite does not fire onToggle.

Notes

• The Angular component uses ChangeDetectionStrategy.OnPush with signals — the React equivalent relies on standard React reconciliation, which is functionally equivalent for this use case.
• favoritesCount is included in the Article interface but not rendered directly by this component (it was rendered by the parent via <ng-content> in Angular, and via children in React). This is intentional.
• Service integration is deferred: onFavorite/onUnfavorite are optional callback props with TODO comments. The component safely no-ops when they are absent.

Link to Devin session: https://app.devin.ai/sessions/f9f1660d80a8458aa947e102c96b7405
Requested by: @lburgers

---

[devin-ai-integration]

🤖 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 and CI monitoring