import React from 'react';

interface ProgressBarProps {
  completionPercentage: number;
}

export function ProgressBar({ completionPercentage }: ProgressBarProps) {
  return (
    <div className="mb-4 h-1.5 w-full overflow-hidden rounded-full bg-gray-200 md:mb-2 md:h-2">
      <div
        className="h-full bg-green-500 transition-all duration-300"
        style={{ width: `${completionPercentage}%` }}
      ></div>
    </div>
  );
}
