refactor(frontend): migrate state management to jotai and jotai-tanstack-query

Replace React Context + manual useEffect data fetching with jotai atoms
for state management and jotai-tanstack-query for server state caching.

- Add jotai, jotai-tanstack-query, @tanstack/query-core dependencies
- Create atoms for auth (primitive + action), feeds (suspense query),
  and articles (infinite query with cursor-based pagination)
- Wire up Provider, HydrateQueryClient, and StoreInitializer in main.tsx
- Migrate all components from useAuth() context to jotai atoms
- Replace manual fetch logic in FeedSidebar/FeedList with feedsAtom
- Replace usePaginatedArticles hook with articlesInfiniteAtom
- Add queryClient.invalidateQueries() after mutations for automatic
  cache refresh
- Add ErrorBoundary and LoadingSpinner components for Suspense support
- Remove callback prop chains (onFeedAdded, onFeedChanged, etc.)
  in favor of query invalidation

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

1 files changed, 10 insertions, 6 deletions

diff --git a/frontend/src/components/FeedItem.tsx b/frontend/src/components/FeedItem.tsx
index 1fb9001..adc7623 100644
--- a/frontend/src/components/FeedItem.tsx
+++ b/frontend/src/components/FeedItem.tsx
@@ -1,29 +1,33 @@
 import { faCheck, faCircle, faTrash } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import type { components } from "../api/generated";
+import { queryClient } from "../queryClient";
 import { api } from "../services/api-client";
 
 type Feed = components["schemas"]["Feed"];
 
 interface Props {
 	feed: Feed;
-	onFeedUnsubscribed?: () => void;
-	onFeedChanged?: () => void;
 }
 
-export function FeedItem({ feed, onFeedUnsubscribed, onFeedChanged }: Props) {
+export function FeedItem({ feed }: Props) {
+	const invalidate = () => {
+		queryClient.invalidateQueries({ queryKey: ["feeds"] });
+		queryClient.invalidateQueries({ queryKey: ["articles"] });
+	};
+
 	const handleMarkAllRead = async (feedId: string) => {
 		await api.POST("/api/feeds/{feedId}/read", {
 			params: { path: { feedId } },
 		});
-		onFeedChanged?.();
+		invalidate();
 	};
 
 	const handleMarkAllUnread = async (feedId: string) => {
 		await api.POST("/api/feeds/{feedId}/unread", {
 			params: { path: { feedId } },
 		});
-		onFeedChanged?.();
+		invalidate();
 	};
 
 	const handleUnsubscribeFeed = async (feedId: string) => {
@@ -34,7 +38,7 @@ export function FeedItem({ feed, onFeedUnsubscribed, onFeedChanged }: Props) {
 			await api.DELETE("/api/feeds/{feedId}", {
 				params: { path: { feedId } },
 			});
-			onFeedUnsubscribed?.();
+			invalidate();
 		}
 	};