import CustomCodeBlock from '../CustomCodeBlock/CustomCodeBlock';

type CustomPreBlockProps = {
  children: JSX.Element | JSX.Element[];
};

const CustomPreBlock = ({ children, ...rest }: CustomPreBlockProps): JSX.Element => {
  const child = Array.isArray(children) ? children[0] : children;
  if (child && typeof child === 'object' && 'type' in child && child.type === 'code') {
    return (
      <CustomCodeBlock
        className={(child.props as { className?: string }).className}
      >
        {(child.props as { children?: string }).children as string}
      </CustomCodeBlock>
    );
  }

  return <pre {...rest}>{children}</pre>;
};

export default CustomPreBlock;
