le8i2digy: Add a refresh button to the Home feed header and singularize one comment

src/components/Feed.tsx

@@ -25,6 +25,7 @@ export function Feed({
   const [status, setStatus] = useState<FeedStatus>("loading");
   const [nextCursor, setNextCursor] = useState<string | null>(null);
   const [loadingMore, setLoadingMore] = useState(false);
+  const [refreshing, setRefreshing] = useState(false);
   const [loadMoreFailed, setLoadMoreFailed] = useState(false);
   const [pending, setPending] = useState<CardPost[]>([]);
   const [likeBusy, setLikeBusy] = useState<ReadonlySet<string>>(new Set());
@@ -54,10 +55,12 @@ export function Feed({
     [onSignedOut],
   );
 
-  const loadFirst = useCallback(async () => {
+  // quiet: a refresh keeps the list on screen instead of swapping in the spinner.
+  const loadFirst = useCallback(async (quiet = false) => {
     if (busy.current) return;
     busy.current = true;
-    setStatus("loading");
+    if (quiet) setRefreshing(true);
+    else setStatus("loading");
     setLoadMoreFailed(false);
     try {
       const page = await fetchFeedPage(null);
@@ -70,6 +73,7 @@ export function Feed({
       setStatus("error");
     } finally {
       busy.current = false;
+      setRefreshing(false);
     }
   }, [fail]);
 
@@ -240,6 +244,13 @@ export function Feed({
     list.current?.scrollTo({ top: 0, behavior: calm ? "auto" : "smooth" });
   }
 
+  function refresh() {
+    if (busy.current) return;
+    const calm = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+    list.current?.scrollTo({ top: 0, behavior: calm ? "auto" : "smooth" });
+    void loadFirst(true);
+  }
+
   return (
     <FeedView
       posts={posts}
@@ -249,6 +260,8 @@ export function Feed({
       newCount={pending.length}
       onRetry={() => (status === "error" ? void loadFirst() : void loadMore())}
       onShowNew={showNew}
+      onRefresh={refresh}
+      refreshing={refreshing}
       onToggleLike={(p) => void toggleLike(p)}
       likeBusy={likeBusy}
       likeErrors={likeErrors}