import React from "react"; import { connect } from "react-redux"; import CopyClipboard from "../utils/CopyClipboard.js"; import { Modal, Form, Input } from "antd"; const InviteModal = (props) => { let baseURL = process.env.REACT_APP_FRONT_END_URL || "https://www.alpacavids.com/"; let URL = baseURL.concat("invite/", props.inviteCode); const handleOk = (e) => { e.preventDefault(); props.setVisibility(false); CopyClipboard("team-link"); }; function handleCancel() { props.setVisibility(false); } return ( <Modal title="Team Invitation Link" visible={props.isVisible} okText="Copy" onOk={handleOk} onCancel={handleCancel} okButtonProps={{ style: { backgroundColor: "#6954EA", color: "white", border: "none" } }}> <Form> <Form.Item label="Copy Link"> <Input readOnly id="team-link" value={URL} /> </Form.Item> </Form> </Modal> ); }; const mapStateToProps = (state) => ({ inviteCode: state.Team.inviteCode, }); export default connect(mapStateToProps)(InviteModal);