'use strict';
import { c } from 'react/compiler-runtime';
import { jsxs, jsx } from 'react/jsx-runtime';
import { useState } from 'react';
import { FeedHeader } from './FeedHeader.js';
import { FeedEntryActions } from './FeedActions.js';
import { FeedReactionsSummary } from './FeedReactionsSummary.js';
import { FeedComments } from './FeedComments.js';
import { Button } from '../../../fd-component-toolbox/button/Button.js';
import { Image } from '../../../fd-component-toolbox/image/Image.js';
import { formatUserFrendlyRelativeTime, parseToUtc } from '../../../../fd-toolbox/dates/date-time.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
function FeedEntryComponent(t0) {
  const $ = c(18);
  const {
    feedEntry,
    comments
  } = t0;
  const [expanded, setExpanded] = useState(false);
  const [showComments, setShowComments] = useState(false);
  const shouldTruncate = feedEntry.textContent.length > 250;
  let t1;
  if ($[0] !== expanded || $[1] !== feedEntry.textContent || $[2] !== shouldTruncate) {
    t1 = shouldTruncate && !expanded ? `${feedEntry.textContent.slice(0, 250)}...` : feedEntry.textContent;
    $[0] = expanded;
    $[1] = feedEntry.textContent;
    $[2] = shouldTruncate;
    $[3] = t1;
  } else {
    t1 = $[3];
  }
  const displayText = t1;
  let t2;
  if ($[4] !== comments.length || $[5] !== displayText || $[6] !== expanded || $[7] !== feedEntry.createdDate || $[8] !== feedEntry.id || $[9] !== feedEntry.imageUrl || $[10] !== feedEntry.user.firstName || $[11] !== feedEntry.user.imageUrl || $[12] !== feedEntry.user.lastName || $[13] !== shouldTruncate || $[14] !== showComments) {
    let t3;
    if ($[16] !== showComments) {
      t3 = () => setShowComments(!showComments);
      $[16] = showComments;
      $[17] = t3;
    } else {
      t3 = $[17];
    }
    t2 = jsxs("div", {
      className: "bg-background mx-auto w-full max-w-xl rounded-xl shadow-sm transition-all duration-200 hover:shadow-md sm:my-4",
      children: [jsx(FeedHeader, {
        authorName: `${feedEntry.user.firstName} ${feedEntry.user.lastName}`,
        timestamp: formatUserFrendlyRelativeTime(parseToUtc(feedEntry.createdDate)),
        avatarUrl: feedEntry.user.imageUrl
      }), jsx("div", {
        className: "px-4 pb-3",
        children: jsxs("p", {
          className: "text-foreground leading-relaxed break-words",
          children: [displayText, shouldTruncate && jsx(Button, {
            variant: "ghost",
            onClick: () => setExpanded(!expanded),
            className: "text-muted-foreground p-0 ps-1 hover:bg-transparent",
            children: expanded ? "See less" : "See more"
          })]
        })
      }), feedEntry.imageUrl && jsx("div", {
        className: "relative aspect-video w-full",
        children: jsx(Image, {
          src: feedEntry.imageUrl,
          alt: `Content from ${feedEntry.user.firstName} ${feedEntry.user.lastName}`,
          fill: true,
          className: "object-cover",
          sizes: "(max-width: 37rem) 100vw, 37rem"
        })
      }), jsx(FeedReactionsSummary, {
        commentCount: comments.length || 0
      }), jsx(FeedEntryActions, {
        onComment: t3
      }), showComments && jsx(FeedComments, {
        postId: feedEntry.id
      })]
    });
    $[4] = comments.length;
    $[5] = displayText;
    $[6] = expanded;
    $[7] = feedEntry.createdDate;
    $[8] = feedEntry.id;
    $[9] = feedEntry.imageUrl;
    $[10] = feedEntry.user.firstName;
    $[11] = feedEntry.user.imageUrl;
    $[12] = feedEntry.user.lastName;
    $[13] = shouldTruncate;
    $[14] = showComments;
    $[15] = t2;
  } else {
    t2 = $[15];
  }
  return t2;
}
__name(FeedEntryComponent, "FeedEntryComponent");

export { FeedEntryComponent };
