import React, { memo } from 'react'

interface TestHeaderProps {
  title: string
  cefr: string
  className?: string
}

export const TestHeader = memo<TestHeaderProps>(({
  title,
  cefr,
  className = ''
}) => {
  return (
    <div className={`flex justify-between items-start mb-6 ${className}`}>
      <h2 className="text-2xl font-bold text-gray-900">{title}</h2>
      <span className="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded-full">
        {cefr}
      </span>
    </div>
  )
})

TestHeader.displayName = 'TestHeader'