import { FC } from 'react';

import PostText from 'src/components/post/PostText';
import ReadOnly from 'src/components/RichTextEditor/ReadOnly';

type PostBodyProps = {
  body?: string;
  bodyHtml?: string;
  bodyAttributes?: any;
  maxCharacters: number;
  maxNewLines: number;
  // Text mode only
  showSeeMoreToggle?: boolean;
  onReadMore?: () => void;
  onReadLess?: () => void;
  matchText?: string;
  // Rich text extras (forwarded to ReadOnly)
  readOnlyWithShowMoreButton?: boolean;
  readOnlyShowSeeMoreButton?: boolean;
  readOnlySxContainer?: any;
};

const PostBody: FC<PostBodyProps> = props => {
  const {
    body,
    bodyHtml,
    bodyAttributes,
    maxCharacters,
    maxNewLines,
    showSeeMoreToggle,
    onReadMore,
    onReadLess,
    matchText,
    readOnlyWithShowMoreButton,
    readOnlyShowSeeMoreButton = false,
    readOnlySxContainer,
  } = props;

  if (bodyHtml) {
    return (
      <ReadOnly
        content={bodyHtml}
        maxCharacters={maxCharacters}
        maxNewLines={maxNewLines}
        withShowMoreButton={readOnlyWithShowMoreButton}
        onShowMore={onReadMore}
        onShowLess={onReadLess}
        showSeeMoreButton={readOnlyShowSeeMoreButton}
        sxContainer={readOnlySxContainer}
        matchText={matchText}
      />
    );
  }

  return (
    <PostText
      body={body as string}
      bodyAttributes={bodyAttributes}
      maxCharacters={maxCharacters}
      maxNewLines={maxNewLines}
      showSeeMoreToggle={showSeeMoreToggle}
      onReadMore={onReadMore}
      onReadLess={onReadLess}
      matchText={matchText}
    />
  );
};

export default PostBody;