IO-1551 Polling mode for unsupported browsers.

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

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()}