Nada/88951/change chat url

packages/p2p/src/components/order-details/order-details.jsx

@@ -23,7 +23,7 @@ import { useModalManagerContext } from 'Components/modal-manager/modal-manager-c
 import 'Components/order-details/order-details.scss';
 
 const OrderDetails = observer(() => {
-    const { general_store, my_profile_store, order_store, sendbird_store } = useStores();
+    const { general_store, my_profile_store, order_store, sendbird_store, buy_sell_store } = useStores();
     const { hideModal, showModal, useRegisterModalProps } = useModalManagerContext();
 
     const {
@@ -85,11 +85,14 @@ const OrderDetails = observer(() => {
         order_store.setIsRecommended(undefined);
         my_profile_store.getPaymentMethodsList();
 
-        if (order_channel_url) {
-            sendbird_store.setChatChannelUrl(order_channel_url);
-        } else {
-            sendbird_store.createChatForNewOrder(order_store.order_id);
-        }
+        // TODO: remove condition check and settimeout once access chat_channel_url from p2p_order_create is activated in BO, since chat channel url response is always delayed
+        setTimeout(() => {
+            if (order_channel_url) {
+                sendbird_store.setChatChannelUrl(order_channel_url);
+            } else {
+                sendbird_store.createChatForNewOrder(order_store.order_id);
+            }
+        }, 1000);
 
         return () => {
             disposeListeners();
@@ -102,6 +105,8 @@ const OrderDetails = observer(() => {
                 redirectToOrderDetails: general_store.redirectToOrderDetails,
                 setIsRatingModalOpen: is_open => (is_open ? showRatingModal : hideModal),
             });
+            buy_sell_store.setIsCreateOrderSubscribed(false);
+            buy_sell_store.unsubscribeCreateOrder();
         };
     }, []); // eslint-disable-line react-hooks/exhaustive-deps
 

packages/p2p/src/stores/buy-sell-store.js

@@ -4,7 +4,7 @@ import { formatMoney, getDecimalPlaces, isMobile } from '@deriv/shared';
 import { Text } from '@deriv/components';
 import { localize } from 'Components/i18next';
 import { buy_sell } from 'Constants/buy-sell';
-import { requestWS } from 'Utils/websocket';
+import { requestWS, subscribeWS } from 'Utils/websocket';
 import { textValidator, lengthValidator } from 'Utils/validations';
 import { countDecimalPlaces } from 'Utils/string';
 import { removeTrailingZeros } from 'Utils/format-value';
@@ -41,6 +41,7 @@ export default class BuySellStore extends BaseStore {
     submitForm = () => {};
     table_type = buy_sell.BUY;
     form_props = {};
+    is_create_order_subscribed = false;
 
     initial_values = {
         amount: this.advert?.min_order_amount_limit,
@@ -84,6 +85,7 @@ export default class BuySellStore extends BaseStore {
             submitForm: observable,
             table_type: observable,
             form_props: observable,
+            is_create_order_subscribed: observable,
             account_currency: computed,
             advert: computed,
             has_payment_info: computed,
@@ -141,9 +143,13 @@ export default class BuySellStore extends BaseStore {
             validatePopup: action.bound,
             sort_list: computed,
             fetchAdvertiserAdverts: action.bound,
+            handleResponse: action.bound,
+            setIsCreateOrderSubscribed: action.bound,
         });
     }
 
+    create_order_subscription = {};
+
     get account_currency() {
         return this.advert?.account_currency;
     }
@@ -260,6 +266,34 @@ export default class BuySellStore extends BaseStore {
         this.setIsSortDropdownOpen(false);
     }
 
+    handleResponse = async order => {
+        const { sendbird_store, order_store, general_store, floating_rate_store } = this.root_store;
+        const { setErrorMessage, handleConfirm, handleClose } = this.form_props;
+        if (order.error) {
+            setErrorMessage(order.error.message);
+            this.setFormErrorCode(order.error.code);
+        } else {
+            if (order?.subscription?.id && !this.is_create_order_subscribed) {
+                this.setIsCreateOrderSubscribed(true);
+            }
+            setErrorMessage(null);
+            general_store.hideModal();
+            floating_rate_store.setIsMarketRateChanged(false);
+            sendbird_store.setChatChannelUrl(order?.p2p_order_create?.chat_channel_url ?? '');
+            if (order?.p2p_order_create?.id) {
+                const response = await requestWS({ p2p_order_info: 1, id: order?.p2p_order_create?.id });
+                handleConfirm(response?.p2p_order_info);
+            }
+            handleClose();
+            this.payment_method_ids = [];
+        }
+        if (order?.p2p_order_info?.id && order?.p2p_order_info?.chat_channel_url) {
+            sendbird_store.setChatChannelUrl(order?.p2p_order_info?.chat_channel_url ?? '');
+            order_store.setOrderDetails(order);
+            this.create_order_subscription.unsubscribe();
+        }
+    };
+
     handleSubmit = async (isMountedFn, values, { setSubmitting }) => {
         if (isMountedFn()) {
             setSubmitting(true);
@@ -284,20 +318,7 @@ export default class BuySellStore extends BaseStore {
             payload.rate = values.rate;
         }
 
-        const order = await requestWS({ ...payload });
-
-        if (order.error) {
-            this.form_props.setErrorMessage(order.error.message);
-            this.setFormErrorCode(order.error.code);
-        } else {
-            this.form_props.setErrorMessage(null);
-            this.root_store.general_store.hideModal();
-            this.root_store.floating_rate_store.setIsMarketRateChanged(false);
-            const response = await requestWS({ p2p_order_info: 1, id: order.p2p_order_create.id });
-            this.form_props.handleConfirm(response.p2p_order_info);
-            this.form_props.handleClose();
-            this.payment_method_ids = [];
-        }
+        this.create_order_subscription = subscribeWS({ ...payload }, [this.handleResponse]);
 
         if (isMountedFn()) {
             setSubmitting(false);
@@ -602,6 +623,10 @@ export default class BuySellStore extends BaseStore {
         this.submitForm = submitFormFn;
     }
 
+    setIsCreateOrderSubscribed(is_create_order_subscribed) {
+        this.is_create_order_subscribed = is_create_order_subscribed;
+    }
+
     showAdvertiserPage(selected_advert) {
         this.setSelectedAdState(selected_advert);
         this.setShowAdvertiserPage(true);
@@ -720,4 +745,10 @@ export default class BuySellStore extends BaseStore {
 
         return () => disposeAdvertIntervalReaction();
     }
+
+    unsubscribeCreateOrder = () => {
+        if (this.create_order_subscription.unsubscribe) {
+            this.create_order_subscription.unsubscribe();
+        }
+    };
 }

packages/p2p/src/stores/order-store.js

@@ -277,10 +277,13 @@ export default class OrderStore {
     }
 
     onOrderIdUpdate() {
+        const { buy_sell_store } = this.root_store;
         this.unsubscribeFromCurrentOrder();
 
         if (this.order_id) {
-            this.subscribeToCurrentOrder();
+            if (!buy_sell_store.is_create_order_subscribed) {
+                this.subscribeToCurrentOrder();
+            }
         }
     }
 

packages/p2p/src/stores/sendbird-store.js

@@ -71,6 +71,7 @@ export default class SendbirdStore extends BaseStore {
         this.chat_messages.push(chat_message);
     }
 
+    // TODO: remove when access chat_channel_url from p2p_order_create is activated in BO
     createChatForNewOrder(id) {
         if (!this.chat_channel_url) {
             // If order_information doesn't have chat_channel_url this is a new order