import React from 'react';
import { Text } from 'folds';
import * as theme from './forumTheme.css';

type ForumMessageBodyProps = {
  body: string;
  bodyHtml?: string;
};

export function ForumMessageBody({ body, bodyHtml }: ForumMessageBodyProps) {
  const plain = body.trim();
  if (bodyHtml) {
    return (
      <div
        className={theme.ForumMessageBodyRich}
        // eslint-disable-next-line react/no-danger
        dangerouslySetInnerHTML={{ __html: bodyHtml }}
      />
    );
  }
  if (!plain) return null;
  return (
    <Text as="p" className={theme.ForumMessageBody} size="T400">
      {body}
    </Text>
  );
}