'use client'

interface WizardNavigationProps {
  currentStep: number
  totalSteps: number
  onPrev: () => void
  onNext: () => void
  showNext?: boolean
  isLoading?: boolean
  nextLabel?: string
  prevLabel?: string
}

export function WizardNavigation({
  currentStep,
  totalSteps,
  onPrev,
  onNext,
  showNext = true,
  isLoading = false,
  nextLabel = 'Weiter →',
  prevLabel = '← Zurueck',
}: WizardNavigationProps) {
  return (
    <div className="flex justify-between mt-8 pt-6 border-t">
      <button
        onClick={onPrev}
        disabled={currentStep === 0 || isLoading}
        className={`px-6 py-2 rounded-lg transition-colors ${
          currentStep === 0 || isLoading
            ? 'bg-gray-200 text-gray-400 cursor-not-allowed'
            : 'bg-gray-200 text-gray-700 hover:bg-gray-300'
        }`}
      >
        {prevLabel}
      </button>

      {showNext && currentStep < totalSteps - 1 && (
        <button
          onClick={onNext}
          disabled={isLoading}
          className={`px-6 py-2 rounded-lg transition-colors ${
            isLoading
              ? 'bg-blue-400 cursor-not-allowed'
              : 'bg-blue-600 text-white hover:bg-blue-700'
          }`}
        >
          {isLoading ? 'Bitte warten...' : nextLabel}
        </button>
      )}
    </div>
  )
}