import React from 'react';
import { Flex, Typo } from '@/atoms';

interface CurriculumItemTitleProps {
  title: string;
  subText: string;
  duration?: number;
}

function CurriculumItemTitle({
  title,
  subText,
  duration,
}: CurriculumItemTitleProps): React.ReactNode {
  return (
    <Flex direction="column" gap="1">
      <Typo color="gray" weight="bold">
        {title}
      </Typo>
      <Typo color="gray" variant="caption">
        {subText}
        {duration ? ` | ${duration}분` : ''}
      </Typo>
    </Flex>
  );
}

export default CurriculumItemTitle;
