Updated service workers and disabled FCM SW IO-195

This commit is contained in:
Patrick Fic
2021-02-24 11:18:40 -08:00
parent 19207013e2
commit d646ba4525
3 changed files with 59 additions and 68 deletions

View File

@@ -1,41 +0,0 @@
import { AlertOutlined } from "@ant-design/icons";
import { Button, notification } from "antd";
import i18n from "i18next";
import React from "react";
import * as serviceWorker from "../serviceWorker";
const onServiceWorkerUpdate = (registration) => {
console.log("onServiceWorkerUpdate", registration);
const key = `open${Date.now()}`;
const btn = (
<Button
type="primary"
onClick={async () => {
if (registration && registration.waiting) {
await registration.unregister();
// Makes Workbox call skipWaiting()
registration.waiting.postMessage({ type: "SKIP_WAITING" });
// Once the service worker is unregistered, we can reload the page to let
// the browser download a fresh copy of our app (invalidating the cache)
window.location.reload();
}
}}
>
{i18n.t("general.actions.refresh")}
</Button>
);
notification.open({
icon: <AlertOutlined />,
message: i18n.t("general.messages.newversiontitle"),
description: i18n.t("general.messages.newversionmessage"),
duration: 0,
btn,
key,
});
};
// if (process.env.NODE_ENV === "production") {
// console.log("SWR Registering SW...");
serviceWorker.register({ onUpdate: onServiceWorkerUpdate });
// }

View File

@@ -1,9 +1,8 @@
import React, { Component } from "react";
import { withApollo } from "@apollo/client/react/hoc";
import React, { Component } from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { logImEXEvent, messaging } from "../../firebase/firebase.utils";
import { UPDATE_FCM_TOKEN } from "../../graphql/user.queries";
import { selectCurrentUser } from "../../redux/user/user.selectors";
const mapStateToProps = createStructuredSelector({
@@ -15,17 +14,17 @@ const mapDispatchToProps = (dispatch) => ({
class FcmNotificationComponent extends Component {
async componentDidMount() {
const { client, currentUser } = this.props;
//const { client, currentUser } = this.props;
if (!!!messaging) return; //Skip all of the notification functionality if the firebase SDK could not start.
messaging
.requestPermission()
.then(async function () {
const token = await messaging.getToken();
client.mutate({
mutation: UPDATE_FCM_TOKEN,
variables: { authEmail: currentUser.email, token: { [token]: true } },
});
// const token = await messaging.getToken();
// client.mutate({
// mutation: UPDATE_FCM_TOKEN,
// variables: { authEmail: currentUser.email, token: { [token]: true } },
// });
})
.catch(function (err) {
console.log("Unable to get permission to notify.", err);
@@ -44,19 +43,19 @@ export default connect(
)(withApollo(FcmNotificationComponent));
//Firebase Service Worker Register
if ("serviceWorker" in navigator) {
navigator.serviceWorker
.register("/firebase-messaging-sw.js")
.then(function (registration) {
console.log(
"[FCM] Registration successful, scope is:",
registration.scope
);
navigator.serviceWorker.addEventListener("message", (event) => {
console.log("Handler for Navigator Service Worker.", event);
});
})
.catch(function (err) {
console.log("[FCM] Service worker registration failed, error:", err);
});
}
// if ("serviceWorker" in navigator) {
// navigator.serviceWorker
// .register("/firebase-messaging-sw.js")
// .then(function (registration) {
// console.log(
// "[FCM] Registration successful, scope is:",
// registration.scope
// );
// navigator.serviceWorker.addEventListener("message", (event) => {
// console.log("Handler for Navigator Service Worker.", event);
// });
// })
// .catch(function (err) {
// console.log("[FCM] Service worker registration failed, error:", err);
// });
// }

View File

@@ -1,15 +1,17 @@
import { AlertOutlined } from "@ant-design/icons";
import { Button, notification } from "antd";
import Dinero from "dinero.js";
import i18n from "i18next";
import React from "react";
import ReactDOM from "react-dom";
import { Provider } from "react-redux";
import { BrowserRouter } from "react-router-dom";
import { PersistGate } from "redux-persist/integration/react";
import AppContainer from "./App/App.container";
import "./App/registerServiceWorker.component";
import LoadingSpinner from "./components/loading-spinner/loading-spinner.component";
import "./index.css";
import { persistor, store } from "./redux/store";
//import * as serviceWorker from "./serviceWorker"; //This is registered in a separate component to track notifications.
import * as serviceWorker from "./serviceWorker";
import "./translations/i18n";
import "./utils/CleanAxios";
@@ -33,4 +35,35 @@ ReactDOM.render(
document.getElementById("root")
);
//serviceWorker.register();
const onServiceWorkerUpdate = (registration) => {
console.log("onServiceWorkerUpdate", registration);
const key = `open${Date.now()}`;
const btn = (
<Button
type="primary"
onClick={async () => {
if (registration && registration.waiting) {
await registration.unregister();
// Makes Workbox call skipWaiting()
registration.waiting.postMessage({ type: "SKIP_WAITING" });
// Once the service worker is unregistered, we can reload the page to let
// the browser download a fresh copy of our app (invalidating the cache)
window.location.reload();
}
}}
>
{i18n.t("general.actions.refresh")}
</Button>
);
notification.open({
icon: <AlertOutlined />,
message: i18n.t("general.messages.newversiontitle"),
description: i18n.t("general.messages.newversionmessage"),
duration: 0,
btn,
key,
});
};
serviceWorker.register({ onUpdate: onServiceWorkerUpdate });