import { Container } from "reactstrap";
import Stepper from "../components/Stepper";
import Header from "../components/Header";
import AddressStep from "../components/steps/address/AddressStep";
import SoilStep from "../components/steps/soilvariant/SoilStep";
import HabitatStep from "../components/steps/habitat/HabitatStep";
import ZoneStep from "../components/steps/zone/ZoneStep";
import SummaryStep from "../components/steps/summary/SummaryStep";

const ApplyPage = () => (
  <Container fluid className="main-container p-0">
    <Header />
    <Stepper
      steps={[
        {
          label: "Enter address",
          component: AddressStep,
          tooltip: "Enter your address",
        },
        {
          label: "Choose soil",
          component: SoilStep,
          tooltip: "Describe the moisture content of your soil",
        },
        {
          label: "Choose habitat",
          component: HabitatStep,
          tooltip: "Specify type of landscape to be planted",
        },
        {
          label: "Select zone",
          component: ZoneStep,
          tooltip: "Specify geographical detail",
        },
        {
          label: "Submit",
          component: SummaryStep,
          tooltip: "Submit your application",
        },
      ]}
    />
  </Container>
);

export default ApplyPage;