import React, { useState } from "react";
import "./style.css";

import ChatBoxProps from "./ChatBoxProps.js";
import ChatButton from "./ChatButton.js";

const ChatBox = (props) => {
  const { updateNeedForm, messages, updateMessages, token } = props.props;
  const [visible, setVisible] = useState(false);

  return (
    <div className="container">
      <div className="chatbox">
        <ChatBoxProps
          props={{ visible, updateNeedForm, messages, updateMessages, token }}
        />
        <ChatButton onClick={() => setVisible(!visible)} />
      </div>
    </div>
  );
};

export default ChatBox;