admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

IO-1551 Polling mode for unsupported browsers.

Browse Source
This commit is contained in:
Patrick Fic
2021-12-08 17:05:44 -08:00
parent 76ea8ca2ed
commit 58848481c9
9 changed files with 74 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
client/src/components/chat-affix/chat-affix.container.jsx
View File

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

39
client/src/components/chat-popup/chat-popup.component.jsx
View File

@@ -1,27 +1,26 @@
import {
ShrinkOutlined,
InfoCircleOutlined,
MessageOutlined,
ShrinkOutlined,
SyncOutlined,
} from "@ant-design/icons";
import { Col, Row, Tooltip, Space, Typography, Badge, Card } from "antd";
import React, { useEffect } from "react";
import { useQuery } from "@apollo/client";
import { Badge, Card, Col, Row, Space, Tag, Tooltip, Typography } from "antd";
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(
CONVERSATION_LIST_QUERY,
{}
);
const fcmToken = sessionStorage.getItem("fcmtoken");
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()}