import React, { ReactNode } from 'react'
import { useTranslation } from 'react-i18next'
import { translateCrudLabel } from '../helpers/translateCrudLabel'

type Props = {
  title: string
  children?: ReactNode
}

const CardBoxComponentTitle = ({ title, children }: Props) => {
  const { t } = useTranslation('common')

  return (
    <div className="flex items-center justify-center mb-3">
      <h1 className="text-2xl">{translateCrudLabel(title, t)}</h1>
      {children}
    </div>
  )
}

export default CardBoxComponentTitle
