import React, { useEffect, useState } from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { botType } from "../botType";
import Wizard from "./Wizard";

const BotsManager = ({ bot }) => {
  const [type, setType] = useState(bot.type);

  useEffect(() => {
    if (bot.type) setType(bot.type);
  }, [bot.type]);

  return (
    <div style={{ position: "absolute" }}>
      {type === botType.wizard && <Wizard />}
    </div>
  );
};

BotsManager.propTypes = {
  bot: PropTypes.object
};

function mapStateToProps(state) {
  return {
    bot: state.bot
  };
}

function mapDispatchToProps() {
  return {};
}

export default connect(mapStateToProps, mapDispatchToProps)(BotsManager);