import {
  AncillaryStepEnum,
  useAddAncillaryStore,
} from "@/stores/my-stay/add-ancillary-flow"

import ConfirmationStep from "../ConfirmationStep"
import DeliveryMethodStep from "../DeliveryDetailsStep"
import SelectQuantityStep from "../SelectQuantityStep"

import type { StepsProps } from "@/types/components/myPages/myStay/ancillaries"

export default function Mobile({ user, savedCreditCards }: StepsProps) {
  const { currentStep, selectedAncillary } = useAddAncillaryStore((state) => ({
    currentStep: state.currentStep,
    selectedAncillary: state.selectedAncillary,
  }))

  if (currentStep === AncillaryStepEnum.selectQuantity) {
    return (
      <>
        <SelectQuantityStep user={user} />
        {selectedAncillary?.requiresDeliveryTime && <DeliveryMethodStep />}
      </>
    )
  }
  return <ConfirmationStep savedCreditCards={savedCreditCards} user={user} />
}
