snort/packages/app/src/Element/TrendingPosts.tsx

42 lines
1.3 KiB
TypeScript
Raw Normal View History

2023-05-10 11:32:09 +00:00
import { useEffect, useState } from "react";
2023-09-19 08:30:01 +00:00
import { NostrEvent, NostrLink, TaggedNostrEvent } from "@snort/system";
2023-11-09 12:20:53 +00:00
import { useReactions } from "@snort/system-react";
2023-05-10 11:32:09 +00:00
import PageSpinner from "Element/PageSpinner";
2023-09-28 09:26:10 +00:00
import Note from "Element/Event/Note";
2023-05-15 08:51:17 +00:00
import NostrBandApi from "External/NostrBand";
2023-10-31 15:40:12 +00:00
import { ErrorOrOffline } from "Element/ErrorOrOffline";
2023-11-10 09:54:08 +00:00
import { useLocale } from "IntlProvider";
2023-05-10 11:32:09 +00:00
export default function TrendingNotes() {
const [posts, setPosts] = useState<Array<NostrEvent>>();
2023-10-31 15:40:12 +00:00
const [error, setError] = useState<Error>();
2023-11-10 09:54:08 +00:00
const { lang } = useLocale();
2023-11-09 12:20:53 +00:00
const related = useReactions("trending", posts?.map(a => NostrLink.fromEvent(a)) ?? [], undefined, true);
2023-05-10 11:32:09 +00:00
async function loadTrendingNotes() {
const api = new NostrBandApi();
2023-11-10 09:54:08 +00:00
const trending = await api.trendingNotes(lang);
2023-05-10 11:32:09 +00:00
setPosts(trending.notes.map(a => a.event));
}
useEffect(() => {
2023-10-31 15:40:12 +00:00
loadTrendingNotes().catch(e => {
if (e instanceof Error) {
setError(e);
}
});
2023-05-10 11:32:09 +00:00
}, []);
2023-10-31 15:40:12 +00:00
if (error) return <ErrorOrOffline error={error} onRetry={loadTrendingNotes} className="p" />;
2023-05-10 11:32:09 +00:00
if (!posts) return <PageSpinner />;
return (
<>
{posts.map(e => (
2023-08-24 15:54:20 +00:00
<Note key={e.id} data={e as TaggedNostrEvent} related={related?.data ?? []} depth={0} />
2023-05-10 11:32:09 +00:00
))}
</>
);
}