import cs from 'classnames';
import { PlaceHolder, PlaceHolderTypes } from '../ConversationPlaceHolder';
import styles from './ConversationListContent.module.scss';
import type { ConversationListContentProps } from '../../../types/conversation';

export function ConversationListContent(props: ConversationListContentProps) {
  const {
    children,
    empty = false,
    loading = false,
    error = false,
    PlaceholderEmptyList = <PlaceHolder type={PlaceHolderTypes.NO_CONVERSATIONS} />,
    PlaceholderLoading = <PlaceHolder type={PlaceHolderTypes.LOADING} />,
    PlaceholderLoadError = <PlaceHolder type={PlaceHolderTypes.WRONG} />,
    className,
    style,
  } = props;

  let content;

  if (error) {
    content = PlaceholderLoadError;
  } else if (loading) {
    content = PlaceholderLoading;
  } else if (empty) {
    content = PlaceholderEmptyList;
  } else {
    content = children;
  }

  return (
    <div
      className={cs(styles.conversationListContent, className)}
      style={style}
    >
      {content}
    </div>
  );
}

export default ConversationListContent;