import React from "react"
import useInstallState from "../useInstallState"
import EnableNotifications from "./EnableNotifications"
import OpenSafari from "./OpenSafari"
import InstallPWA from "./InstallPWA"
import Unsupported from "./Unsupported"
import PermissionDenied from "./PermissionDenied"

interface InstallPromptsProps {
  isMobileSafari: boolean
  isSupported: boolean
  notificationsEnabled: boolean
  onInstallComplete: () => void
}

export default function InstallPrompts({
  isSupported,
  isMobileSafari,
  onInstallComplete,
}: InstallPromptsProps) {
  const { step } = useInstallState({ isSupported, isMobileSafari })

  const steps = {
    "open safari": <OpenSafari />,
    install: <InstallPWA />,
    "enable notifications": (
      <EnableNotifications onSubscribe={onInstallComplete} />
    ),
    unsupported: <Unsupported />,
    "permission denied": <PermissionDenied />,
  }

  return steps[step as keyof typeof steps] ?? null
}