30 lines
866 B
TypeScript
30 lines
866 B
TypeScript
import IconFont from '@/components/icon-font';
|
|
import { UserOutlined } from '@ant-design/icons';
|
|
import { useIntl } from '@umijs/max';
|
|
import React from 'react';
|
|
import { Roles } from '../../config';
|
|
import '../../style/content-item.less';
|
|
|
|
const ContentItem: React.FC<{ data: { role: string; content: string } }> = ({
|
|
data
|
|
}) => {
|
|
const intl = useIntl();
|
|
return (
|
|
<div className="content-item">
|
|
<div className="content-item-role">
|
|
<span className="m-r-5">
|
|
{Roles.User === data.role ? (
|
|
<UserOutlined></UserOutlined>
|
|
) : (
|
|
<IconFont type="icon-AIzhineng"></IconFont>
|
|
)}
|
|
</span>
|
|
{intl.formatMessage({ id: `playground.${data.role}` })}
|
|
</div>
|
|
<div className="content-item-content">{data.content}</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default React.memo(ContentItem);
|