aboutsummaryrefslogtreecommitdiffhomepage
path: root/frontend/src/components/FeedList.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/components/FeedList.tsx')
-rw-r--r--frontend/src/components/FeedList.tsx63
1 files changed, 5 insertions, 58 deletions
diff --git a/frontend/src/components/FeedList.tsx b/frontend/src/components/FeedList.tsx
index a3ba124..364444f 100644
--- a/frontend/src/components/FeedList.tsx
+++ b/frontend/src/components/FeedList.tsx
@@ -1,58 +1,10 @@
-import { useCallback, useEffect, useState } from "react";
-import type { components } from "../api/generated";
-import { api } from "../services/api-client";
+import { useAtomValue } from "jotai";
+import { feedsAtom } from "../atoms";
import { FeedItem } from "./FeedItem";
-type Feed = components["schemas"]["Feed"];
+export function FeedList() {
+ const { data: feeds } = useAtomValue(feedsAtom);
-interface Props {
- onFeedUnsubscribed?: () => void;
-}
-
-export function FeedList({ onFeedUnsubscribed }: Props) {
- const [feeds, setFeeds] = useState<Feed[]>([]);
- const [fetching, setFetching] = useState(true);
- const [error, setError] = useState<string | null>(null);
-
- const fetchFeeds = useCallback(async () => {
- setFetching(true);
- const { data } = await api.GET("/api/feeds");
- if (data) {
- setFeeds(data);
- setError(null);
- } else {
- setError("Failed to load feeds");
- }
- setFetching(false);
- }, []);
-
- useEffect(() => {
- fetchFeeds();
- }, [fetchFeeds]);
-
- const handleFeedUnsubscribed = () => {
- fetchFeeds();
- onFeedUnsubscribed?.();
- };
-
- const handleFeedChanged = () => {
- fetchFeeds();
- };
-
- if (fetching) {
- return (
- <div className="py-8 text-center">
- <p className="text-sm text-stone-400">Loading feeds...</p>
- </div>
- );
- }
- if (error) {
- return (
- <div className="rounded-lg bg-red-50 p-4 text-sm text-red-600">
- Error: {error}
- </div>
- );
- }
if (feeds.length === 0) {
return (
<div className="py-8 text-center">
@@ -64,12 +16,7 @@ export function FeedList({ onFeedUnsubscribed }: Props) {
return (
<div className="space-y-3">
{feeds.map((feed) => (
- <FeedItem
- key={feed.id}
- feed={feed}
- onFeedUnsubscribed={handleFeedUnsubscribed}
- onFeedChanged={handleFeedChanged}
- />
+ <FeedItem key={feed.id} feed={feed} />
))}
</div>
);