52 lines
1.9 KiB
JavaScript
52 lines
1.9 KiB
JavaScript
import parsePhoneNumber from "libphonenumber-js";
|
|
import React, { useContext } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { connect } from "react-redux";
|
|
import { openChatByPhone } from "../../redux/messaging/messaging.actions";
|
|
import PhoneNumberFormatter from "../../utils/PhoneFormatter";
|
|
|
|
import { createStructuredSelector } from "reselect";
|
|
import { selectBodyshop } from "../../redux/user/user.selectors";
|
|
import { searchingForConversation } from "../../redux/messaging/messaging.selectors";
|
|
import SocketContext from "../../contexts/SocketIO/socketContext.jsx";
|
|
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
|
|
|
|
const mapStateToProps = createStructuredSelector({
|
|
bodyshop: selectBodyshop,
|
|
searchingForConversation: searchingForConversation
|
|
});
|
|
|
|
const mapDispatchToProps = (dispatch) => ({
|
|
openChatByPhone: (phone) => dispatch(openChatByPhone(phone))
|
|
});
|
|
|
|
export function ChatOpenButton({ bodyshop, searchingForConversation, phone, jobid, openChatByPhone }) {
|
|
const { t } = useTranslation();
|
|
const { socket } = useContext(SocketContext);
|
|
const notification = useNotification();
|
|
|
|
if (!phone) return <></>;
|
|
|
|
if (!bodyshop.messagingservicesid) return <PhoneNumberFormatter>{phone}</PhoneNumberFormatter>;
|
|
|
|
return (
|
|
<a
|
|
href="# "
|
|
onClick={(e) => {
|
|
e.stopPropagation();
|
|
const p = parsePhoneNumber(phone, "CA");
|
|
if (searchingForConversation) return; //This is to prevent finding the same thing twice.
|
|
if (p && p.isValid()) {
|
|
openChatByPhone({ phone_num: p.formatInternational(), jobid: jobid, socket });
|
|
} else {
|
|
notification["error"]({ message: t("messaging.error.invalidphone") });
|
|
}
|
|
}}
|
|
>
|
|
<PhoneNumberFormatter>{phone}</PhoneNumberFormatter>
|
|
</a>
|
|
);
|
|
}
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(ChatOpenButton);
|