fix: type fix

components/social/collection-scroll-card.tsx

@@ -54,22 +54,23 @@ export function CollectionScrollCard({
 }) {
   const scrollRef = useRef<HTMLDivElement>(null);
   const cardRef = useRef<HTMLElement>(null);
-  const [posts, setPosts] = useState<Post[]>(initialPosts ?? []);
+  // `fetched` only holds posts pulled by the lazy IntersectionObserver
+  // fetch. When the parent supplies `initialPosts`, we derive `posts`
+  // from it directly — no mirror-into-state effect required, which means
+  // fresh data from the parent (e.g. after an edit) shows up on the very
+  // next render without a setState-cascade.
+  const [fetched, setFetched] = useState<Post[]>([]);
   const [fetchState, setFetchState] = useState<FetchState>(
     initialPosts ? "loaded" : "idle",
   );
   const [activeIndex, setActiveIndex] = useState(0);
 
-  // Reconcile when the parent supplies fresh posts (e.g. after editing).
-  useEffect(() => {
-    if (!initialPosts) return;
-    setPosts(initialPosts);
-    setFetchState("loaded");
-  }, [initialPosts]);
+  const posts = initialPosts ?? fetched;
 
   // Fetch posts the first time the carousel enters the viewport (with a
   // 200px rootMargin so we kick it off just before it's visible). Skipped
-  // entirely when `initialPosts` was provided.
+  // entirely when `initialPosts` was provided (fetchState starts at
+  // "loaded" in that case so the early-return below fires).
   useEffect(() => {
     if (fetchState !== "idle") return;
     const el = cardRef.current;
@@ -83,7 +84,7 @@ export function CollectionScrollCard({
             collections
               .get(c.id)
               .then(({ posts: rows }) => {
-                setPosts(rows ?? []);
+                setFetched(rows ?? []);
                 setFetchState("loaded");
               })
               .catch(() => setFetchState("error"));