Merged in release/2021-12-10 (pull request #295)

release/2021-12-10

Approved-by: Patrick Fic

bodyshop_translations.babel

@@ -29927,6 +29927,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>nopush</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description></description>
+                                        <comment></comment>
+                                        <default_text></default_text>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>es-MX</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>fr-CA</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
                                     <concept_node>
                                         <name>phonenumber</name>
                                         <definition_loaded>false</definition_loaded>

client/public/firebase-messaging-sw.js

@@ -48,7 +48,6 @@ firebase.initializeApp(firebaseConfig);
 const messaging = firebase.messaging();
 
 messaging.onBackgroundMessage(function (payload) {
-  console.log("FCM BG MSG", payload);
   // Customize notification here
   const channel = new BroadcastChannel("imex-sw-messages");
   channel.postMessage(payload);

client/src/components/chat-affix/chat-affix.container.jsx

@@ -46,11 +46,8 @@ export function ChatAffixContainer({ bodyshop, chatVisible }) {
             <Space>
               <Button
                 onClick={async () => {
-                  const resp = await requestForToken();
+                  await requestForToken();
-                  console.log(
+
-                    "🚀  ~ file: chat-affix.container.jsx  ~ line 44  ~ resp",
-                    resp
-                  );
                   SubscribeToTopic();
                 }}
               >
@@ -84,12 +81,17 @@ export function ChatAffixContainer({ bodyshop, chatVisible }) {
         payload: (payload && payload.data && payload.data.data) || payload.data,
       });
     }
-    const stopMessageListenr = onMessage(messaging, handleMessage);
+    let stopMessageListenr, channel;
-    const channel = new BroadcastChannel("imex-sw-messages");
+    try {
-    channel.addEventListener("message", handleMessage);
+      stopMessageListenr = onMessage(messaging, handleMessage);
+      channel = new BroadcastChannel("imex-sw-messages");
+      channel.addEventListener("message", handleMessage);
+    } catch (error) {
+      console.log("Unable to set event listeners.");
+    }
     return () => {
-      stopMessageListenr();
+      stopMessageListenr && stopMessageListenr();
-      channel.removeEventListener("message", handleMessage);
+      channel && channel.removeEventListener("message", handleMessage);
     };
   }, [client]);
 

client/src/components/chat-popup/chat-popup.component.jsx

@@ -1,27 +1,26 @@
 import {
-  ShrinkOutlined,
   InfoCircleOutlined,
+  MessageOutlined,
+  ShrinkOutlined,
   SyncOutlined,
 } from "@ant-design/icons";
-
+import { useQuery } from "@apollo/client";
-import { Col, Row, Tooltip, Space, Typography, Badge, Card } from "antd";
+import { Badge, Card, Col, Row, Space, Tag, Tooltip, Typography } from "antd";
-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { CONVERSATION_LIST_QUERY } from "../../graphql/conversations.queries";
 import { toggleChatVisible } from "../../redux/messaging/messaging.actions";
-import ChatConversationListComponent from "../chat-conversation-list/chat-conversation-list.component";
-import ChatConversationContainer from "../chat-conversation/chat-conversation.container";
 import {
   selectChatVisible,
   selectSelectedConversation,
 } from "../../redux/messaging/messaging.selectors";
-import "./chat-popup.styles.scss";
+import ChatConversationListComponent from "../chat-conversation-list/chat-conversation-list.component";
+import ChatConversationContainer from "../chat-conversation/chat-conversation.container";
 import ChatNewConversation from "../chat-new-conversation/chat-new-conversation.component";
-import { CONVERSATION_LIST_QUERY } from "../../graphql/conversations.queries";
-import { useQuery } from "@apollo/client";
 import LoadingSpinner from "../loading-spinner/loading-spinner.component";
-import { MessageOutlined } from "@ant-design/icons";
+import "./chat-popup.styles.scss";
 
 const mapStateToProps = createStructuredSelector({
   selectedConversation: selectSelectedConversation,
@@ -37,11 +36,20 @@ export function ChatPopupComponent({
   toggleChatVisible,
 }) {
   const { t } = useTranslation();
+  const [pollInterval, setpollInterval] = useState(0);
+  const { loading, data, refetch, called } = useQuery(CONVERSATION_LIST_QUERY, {
+    ...(pollInterval > 0 ? { pollInterval } : {}),
+  });
 
-  const { loading, data, refetch, called } = useQuery(
+  const fcmToken = sessionStorage.getItem("fcmtoken");
-    CONVERSATION_LIST_QUERY,
+
-    {}
+  useEffect(() => {
-  );
+    if (fcmToken) {
+      setpollInterval(0);
+    } else {
+      setpollInterval(60000);
+    }
+  }, [fcmToken]);
 
   useEffect(() => {
     if (called && chatVisible) refetch();
@@ -71,6 +79,9 @@ export function ChatPopupComponent({
                 style={{ cursor: "pointer" }}
                 onClick={() => refetch()}
               />
+              {pollInterval > 0 && (
+                <Tag color="yellow">{t("messaging.labels.nopush")}</Tag>
+              )}
             </Space>
             <ShrinkOutlined
               onClick={() => toggleChatVisible()}

client/src/firebase/firebase.utils.js

@@ -38,8 +38,14 @@ export const updateCurrentPassword = async (password) => {
 
   return updatePassword(currentUser, password);
 };
+let messaging;
+try {
+  messaging = getMessaging();
+} catch (error) {
+  console.log(error);
+}
 
-export const messaging = getMessaging();
+export { messaging };
 
 export const requestForToken = () => {
   return getToken(messaging, {
@@ -48,6 +54,7 @@ export const requestForToken = () => {
     .then((currentToken) => {
       if (currentToken) {
         console.log("current token for client: ", currentToken);
+        window.sessionStorage.setItem("fcmtoken", currentToken);
         // Perform any other necessary action with the token
       } else {
         // Show permission request UI

client/src/pages/manage/manage.page.component.jsx

@@ -185,7 +185,11 @@ export function Manage({ match, conflict, bodyshop }) {
   useEffect(() => {
     const widgetId = "IABVNO4scRKY11XBQkNr";
     window.noticeable.render("widget", widgetId);
-    requestForToken();
+    try {
+      requestForToken();
+    } catch (error) {
+      console.log("Unable to request for token.", error);
+    }
   }, []);
 
   useEffect(() => {

client/src/translations/en_us/common.json

@@ -1766,6 +1766,7 @@
 				"messaging": "Messaging",
 				"noallowtxt": "This customer has not indicated their permission to be messaged.",
 				"nojobs": "Not associated to any job.",
+				"nopush": "Polling Mode Enabled",
 				"phonenumber": "Phone #",
 				"presets": "Presets",
 				"recentonly": "Only your most recent 50 conversations will be shown here. If you are looking for an older conversation, find the related contact and click their phone number to view the conversation.",

client/src/translations/es/common.json

@@ -1766,6 +1766,7 @@
 				"messaging": "Mensajería",
 				"noallowtxt": "",
 				"nojobs": "",
+				"nopush": "",
 				"phonenumber": "",
 				"presets": "",
 				"recentonly": "",

client/src/translations/fr/common.json

@@ -1766,6 +1766,7 @@
 				"messaging": "Messagerie",
 				"noallowtxt": "",
 				"nojobs": "",
+				"nopush": "",
 				"phonenumber": "",
 				"presets": "",
 				"recentonly": "",