import React, { Component } from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import sessionStatus from 'ringcentral-integration/modules/Webphone/sessionStatus';
import sleep from 'ringcentral-integration/lib/sleep';
import withPhone from '../../lib/withPhone';
import callCtrlLayouts from '../../enums/callCtrlLayouts';

import {
  CallCtrlPage,
  mapToProps as mapToBaseProps,
  mapToFunctions as mapToBaseFunctions,
} from '../CallCtrlPage';

function mapToProps(_, {
  phone,
  phone: {
    webphone,
    conferenceCall,
    callMonitor,
  },
  ...props
}) {
  const baseProps = mapToBaseProps(_, {
    phone,
    ...props,
  });

  const currentSession = webphone.activeSession || {};
  const isOnConference = conferenceCall.isConferenceSession(currentSession.id);
  const layout = isOnConference ? callCtrlLayouts.conferenceCtrl : callCtrlLayouts.mergeCtrl;
  const lastCallInfo = callMonitor.lastCallInfo;
  let mergeDisabled = !!baseProps.mergeDisabled;
  if (
    layout === callCtrlLayouts.mergeCtrl
    && (!lastCallInfo || lastCallInfo.status === sessionStatus.finished)
  ) {
    mergeDisabled = true;
  }
  return {
    ...baseProps,
    layout,
    mergeDisabled,
    lastCallInfo,
  };
}

function mapToFunctions(_, {
  phone,
  ...props
}) {
  const baseProps = mapToBaseFunctions(_, {
    phone,
    ...props,
  });
  return {
    ...baseProps,
  };
}

class ConferenceCallMergeContainer extends Component {
  constructor(props) {
    super(props);
    this.mounted = false;
    this.onLastCallEnded = this::this.onLastCallEnded;
  }

  static isLastCallEnded({ lastCallInfo }) {
    return !!(
      lastCallInfo && lastCallInfo.status === sessionStatus.finished
    );
  }

  componentWillReceiveProps(nextProps) {
    if (
      ConferenceCallMergeContainer.isLastCallEnded(this.props) === false
      && ConferenceCallMergeContainer.isLastCallEnded(nextProps) === true
      && this.mounted
    ) {
      this.onLastCallEnded();
    }
  }

  async onLastCallEnded() {
    await sleep(2000);
    if (this.mounted) {
      this.props.onLastCallEnded();
    }
  }

  componentDidMount() {
    this.mounted = true;
  }

  componentWillUnmount() {
    this.mounted = false;
  }

  render() {
    return (
      <CallCtrlPage {...this.props} />
    );
  }
}

ConferenceCallMergeContainer.propTypes = {
  onLastCallEnded: PropTypes.func.isRequired,
};

const ConferenceCallMergeCtrlPage = withPhone(connect(
  mapToProps,
  mapToFunctions,
)(ConferenceCallMergeContainer));

export {
  mapToProps,
  mapToFunctions,
  ConferenceCallMergeCtrlPage as default,
};

@@ -2161,24 +2161,250 @@
 ted = true;%0A
+    /**%0A     * if the last has already been terminated after rendering, need to trigger the callback at the point%0A     */%0A    if (ConferenceCallMergeContainer.isLastCallEnded(this.props)) %7B%0A      this.onLastCallEnded();%0A    %7D%0A
   %7D%0A%0A  compo

check and trigger the router after mounting (#1048)