import { useMemo } from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";

import { selectBodyshop } from "../../redux/user/user.selectors";

import RRCustomerSelector from "./rr-customer-selector";
import FortellisCustomerSelector from "./fortellis-customer-selector";
import CDKCustomerSelector from "./cdk-customer-selector";
import PBSCustomerSelector from "./pbs-customer-selector";
import { DMS_MAP } from "../../utils/dmsUtils";

const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop
});
const mapDispatchToProps = () => ({});
export default connect(mapStateToProps, mapDispatchToProps)(DmsCustomerSelector);

/**
 * DMS Customer Selector component that renders the appropriate customer selector
 * @param props
 * @returns {JSX.Element|null}
 * @constructor
 */
export function DmsCustomerSelector(props) {
  const { bodyshop, jobid, job, socket, rrOptions = {} } = props;

  // Centralized "mode" (provider + transport)
  const mode = props.mode;

  // Stable base props for children
  const base = useMemo(() => ({ bodyshop, jobid, job, socket }), [bodyshop, jobid, job, socket]);

  switch (mode) {
    case DMS_MAP.reynolds: {
      // Map rrOptions to current RR prop shape (you can also just pass rrOptions through and unpack in RR)
      const rrProps = {
        rrOpenRoLimit: rrOptions.openRoLimit,
        onRrOpenRoFinished: rrOptions.onOpenRoFinished,
        rrValidationPending: rrOptions.validationPending,
        onValidationFinished: rrOptions.onValidationFinished
      };
      return <RRCustomerSelector {...base} {...rrProps} />;
    }
    case DMS_MAP.fortellis:
      return <FortellisCustomerSelector {...base} />;
    case DMS_MAP.cdk:
      return <CDKCustomerSelector {...base} />;
    case DMS_MAP.pbs:
      return <PBSCustomerSelector {...base} />;
    default:
      return null;
  }
}