import { TaskTypes } from '@material-hu/components/composed-components/learning';
import HuCardContainer from '@material-hu/components/design-system/CardContainer';

import { lazyRetry } from 'src/utils/lazyRetry';

import {
  type LessonTask,
  type ReadingTask,
  type ScormTask,
  type Task,
  type VideoTask,
} from '../../types';

const TaskLesson = lazyRetry(() => import('./TaskLesson'));
const TaskReading = lazyRetry(() => import('./TaskReading'));
const TaskVideo = lazyRetry(() => import('./TaskVideo'));
const TaskScorm = lazyRetry(() => import('./TaskScorm'));

const TASKS_CONTENT = {
  [TaskTypes.VIDEO]: ({ task }: TaskContentProps) => (
    <TaskVideo task={task as VideoTask} />
  ),
  [TaskTypes.READING]: ({ task }: TaskContentProps) => (
    <TaskReading task={task as ReadingTask} />
  ),
  [TaskTypes.BLANK]: ({ task }: TaskContentProps) => (
    <TaskLesson task={task as LessonTask} />
  ),
  [TaskTypes.SCORM]: ({ task }: TaskContentProps) => (
    <TaskScorm task={task as ScormTask} />
  ),
};

type TaskContentProps = {
  task: Task | undefined;
};

const TaskContent = ({ task }: TaskContentProps) => {
  if (!task) return null;

  const Content = TASKS_CONTENT[task.type as keyof typeof TASKS_CONTENT];

  return (
    <HuCardContainer>
      <Content task={task} />
    </HuCardContainer>
  );
};

export default TaskContent;