import React, {Component, Fragment} from "react";
import {withRouter} from "react-router-dom";
import {connect} from "react-redux";
import queryString from "query-string";
import Cookies from "js-cookie";

//strings
import strings from "../constants/localization";
import {MESSAGE_SHARE} from "../constants/cookieKeys";
import {ROUTE_INDEX, ROUTE_SHARE} from "../constants/routes";

//actions
import {chatModalPrompt} from "../actions/chatActions";

//components
import {threadModalListShowing} from "../actions/threadActions";
import Text from "../../../Talk-ui-kit/src/typography/Text";
import Paper from "../../../Talk-ui-kit/src/paper";
import Gap from "../../../Talk-ui-kit/src/gap";

//styling

//statics

//functions

@connect(null, null, null, {forwardRef: true})
class ModalShare extends Component {

  constructor(props) {
    super(props);
  }

  componentDidMount() {
    const {match, location, history, dispatch} = this.props;
    if (match.path === ROUTE_SHARE) {
      const {text} = queryString.parse(location.search, {ignoreQueryPrefix: true});
      if (text) {
        const extraMessage = (
          <Fragment>
            <Gap y={5} block/>
            <Paper colorBackground style={{borderRadius: "5px"}}>
              <Text size="xs">{text}</Text>
            </Paper>
          </Fragment>
        );
        dispatch(chatModalPrompt(true, `${strings.areYouSureABoutSendingThisMessage}؟`, () => {
          dispatch(threadModalListShowing(true));
          dispatch(chatModalPrompt());
          Cookies.set(MESSAGE_SHARE, text);
        }, null, strings.send, null, extraMessage));
      } else {
        history.push(ROUTE_INDEX);
      }
    }
  }

  onClose() {
    this.setState({
      showing: false
    });
  }

  render() {
    return null
  }
}

export default withRouter(ModalShare);