import {EFlag} from '../../types/api/enums';
import {cn} from '../../utils/cn';
import {StatusIcon} from '../StatusIcon/StatusIcon';

import './EntityPageTitle.scss';

const b = cn('ydb-entity-page-title');

interface EntityPageTitleProps {
    entityName: React.ReactNode;
    status?: EFlag;
    id: React.ReactNode;
    className?: string;
    metaInfo?: React.ReactNode;
}

export function EntityPageTitle({
    entityName,
    status = EFlag.Grey,
    id,
    className,
    metaInfo,
}: EntityPageTitleProps) {
    return (
        <div className={b(null, className)}>
            <span className={b('prefix')}>{entityName}</span>
            <StatusIcon className={b('icon')} status={status} size="s" />
            {id}
            {metaInfo}
        </div>
    );
}