'use strict';
'use client';
import { jsxs, jsx } from 'react/jsx-runtime';
import { useState, useEffect } from 'react';
import { useAsyncEffect } from '../../../../fd-toolbox/hooks/use-async-effect.js';
import { FeedEntryComponent } from './FeedEntry.js';
import '../../../fd-component-toolbox/client/framework/index.js';
import { initFeed, observerFeed } from './Feed.funcs.js';
import { useEmptyRef } from '../../../../fd-toolbox/hooks/use-empty-ref.js';
import FrameworkImage from 'next/image.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
const postsPerFetch = 5;
function Feed() {
  const [feedEntries, setFeedEntries] = useState([]);
  const [comments, setComments] = useState([]);
  const [hasMore, setHasMore] = useState(true);
  const observerRef = useEmptyRef();
  const [isFetching, setIsFetching] = useState(false);
  useAsyncEffect(async () => {
    await initFeed(setFeedEntries, setComments, postsPerFetch, setIsFetching);
  }, []);
  useEffect(() => {
    observerFeed(hasMore, isFetching, setIsFetching, feedEntries, postsPerFetch, setFeedEntries, setHasMore, observerRef?.current ?? void 0);
  }, [isFetching, hasMore, feedEntries]);
  return /* @__PURE__ */jsxs("div", {
    children: [feedEntries?.map(entry => /* @__PURE__ */jsx(FeedEntryComponent, {
      feedEntry: entry,
      comments
    }, entry.id)), hasMore ? /* @__PURE__ */jsx("div", {
      ref: observerRef,
      className: "flex h-20 w-full items-center justify-center bg-transparent",
      children: /* @__PURE__ */jsx(FrameworkImage, {
        src: "/logo.svg",
        alt: "Logo",
        layout: "intrinsic",
        width: 100,
        height: 100,
        priority: true,
        className: "size-10 animate-pulse"
      })
    }) : /* @__PURE__ */jsx("div", {
      className: "text-muted-foreground mx-auto w-full max-w-xl text-center text-sm",
      children: "No more posts left."
    })]
  });
}
__name(Feed, "Feed");

export { Feed };
