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

Package updates and firebase refactor to SDK 9.

Browse Source
This commit is contained in:
Patrick Fic
2021-08-30 15:09:11 -07:00
parent 529eb24d76
commit 81daad35d8
9 changed files with 965 additions and 725 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
client/src/components/fcm-notification/fcm-notification.component.jsx
View File

@@ -2,7 +2,7 @@ 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 { logImEXEvent, messaging } from "../../firebase/firebase.utils";
import { selectCurrentUser } from "../../redux/user/user.selectors";
const mapStateToProps = createStructuredSelector({
@@ -15,21 +15,20 @@ const mapDispatchToProps = (dispatch) => ({
class FcmNotificationComponent extends Component {
async componentDidMount() {
//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 } },
// });
})
.catch(function (err) {
console.log("Unable to get permission to notify.", err);
logImEXEvent("fcm_permission_denied", { message: err });
});
// 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 } },
// // });
// })
// .catch(function (err) {
// console.log("Unable to get permission to notify.", err);
// logImEXEvent("fcm_permission_denied", { message: err });
// });
}
render() {

12
client/src/components/payments-export-all-button/payments-export-all-button.component.jsx
View File

@@ -37,15 +37,9 @@ export function PaymentsExportAllButton({
let QbXmlResponse;
try {
QbXmlResponse = await axios.post(
"/accounting/qbxml/payments",
{ payments: paymentIds },
{
headers: {
Authorization: `Bearer ${await auth.currentUser.getIdToken()}`,
},
}
);
QbXmlResponse = await axios.post("/accounting/qbxml/payments", {
payments: paymentIds,
});
} catch (error) {
console.log("Error getting QBXML from Server.", error);
notification["error"]({

3
client/src/components/user-validate-pw-reset/user-validate-pw-reset.component.jsx
View File

@@ -7,6 +7,7 @@ import { Link } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import ImEXOnlineLogo from "../../assets/logo192.png";
import { auth } from "../../firebase/firebase.utils";
import { checkActionCode } from "@firebase/auth";
import { validatePasswordResetStart } from "../../redux/user/user.actions";
import { selectPasswordReset } from "../../redux/user/user.selectors";
import AlertComponent from "../alert/alert.component";
@@ -35,7 +36,7 @@ export function UserValidatePwReset({
useEffect(() => {
async function checkCodeValid() {
try {
const codeValid = await auth.checkActionCode(oobCode);
const codeValid = await checkActionCode(auth, oobCode);
console.log("codeValid :>> ", codeValid);
setCodeValid({ loading: false, ...codeValid });
} catch (error) {

138
client/src/firebase/firebase.utils.js
View File

@@ -1,20 +1,18 @@
import "firebase/analytics";
import firebase from "firebase/app";
import "firebase/auth";
import "firebase/database";
import "firebase/firestore";
import "firebase/messaging";
import { getAnalytics, logEvent } from "firebase/analytics";
import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";
import { getFirestore } from "firebase/firestore";
//import { getMessaging } from "firebase/messaging";
import { store } from "../redux/store";
const config = JSON.parse(process.env.REACT_APP_FIREBASE_CONFIG);
firebase.initializeApp(config);
initializeApp(config);
export const auth = firebase.auth();
export const firestore = firebase.firestore();
export const analytics = firebase.analytics();
export default firebase;
export const auth = getAuth();
export const firestore = getFirestore();
export const analytics = getAnalytics();
//export default firebase;
export const getCurrentUser = () => {
return new Promise((resolve, reject) => {
const unsubscribe = auth.onAuthStateChanged((userAuth) => {
@@ -53,17 +51,17 @@ export const updateCurrentPassword = async (password) => {
// });
};
let messaging;
try {
messaging = firebase.messaging();
// Project Settings => Cloud Messaging => Web Push certificates
messaging.usePublicVapidKey(process.env.REACT_APP_FIREBASE_PUBLIC_VAPID_KEY);
console.log("[FCM UTIL] FCM initialized successfully.");
} catch {
console.log("[FCM UTIL] Firebase Messaging is likely unsupported.");
}
//let messaging;
// try {
// messaging = getMessaging();
// // Project Settings => Cloud Messaging => Web Push certificates
// messaging.usePublicVapidKey(process.env.REACT_APP_FIREBASE_PUBLIC_VAPID_KEY);
// console.log("[FCM UTIL] FCM initialized successfully.");
// } catch {
// console.log("[FCM UTIL] Firebase Messaging is likely unsupported.");
// }
export { messaging };
// export { messaging };
export const logImEXEvent = (eventName, additionalParams, stateProp = null) => {
const state = stateProp || store.getState();
@@ -82,59 +80,59 @@ export const logImEXEvent = (eventName, additionalParams, stateProp = null) => {
eventName,
eventParams
);
analytics.logEvent(eventName, eventParams);
logEvent(analytics, eventName, eventParams);
};
if (messaging) {
messaging.onMessage(async (payload) => {
console.log("[FCM] UTILS Message received. ", payload);
navigator.serviceWorker.getRegistration().then((registration) => {
return registration.showNotification(
"[UTIL]" + payload.notification.title,
payload.notification
);
});
// if (messaging) {
// onMessage(async (payload) => {
// console.log("[FCM] UTILS Message received. ", payload);
// navigator.serviceWorker.getRegistration().then((registration) => {
// return registration.showNotification(
// "[UTIL]" + payload.notification.title,
// payload.notification
// );
// });
// if (!payload.clientId) return;
// // if (!payload.clientId) return;
// // Get the client.
// const client = await clients.get(payload.clientId);
// // Exit early if we don't get the client.
// // Eg, if it closed.
// if (!client) return;
// // // Get the client.
// // const client = await clients.get(payload.clientId);
// // // Exit early if we don't get the client.
// // // Eg, if it closed.
// // if (!client) return;
// // Send a message to the client.
// console.log("Posting to client.");
// client.postMessage({
// msg: "Hey I just got a fetch from you!",
// url: payload.request.url,
// });
// // // Send a message to the client.
// // console.log("Posting to client.");
// // client.postMessage({
// // msg: "Hey I just got a fetch from you!",
// // url: payload.request.url,
// // });
// [START_EXCLUDE]
// Update the UI to include the received message.
//appendMessage(payload);
// // [START_EXCLUDE]
// // Update the UI to include the received message.
// //appendMessage(payload);
// [END_EXCLUDE]
});
// // [END_EXCLUDE]
// });
messaging.onTokenRefresh(() => {
messaging
.getToken()
.then((refreshedToken) => {
console.log("[FCM] Token refreshed.");
// Indicate that the new Instance ID token has not yet been sent to the
// app server.
// setTokenSentToServer(false);
// // Send Instance ID token to app server.
// sendTokenToServer(refreshedToken);
// // [START_EXCLUDE]
// // Display new Instance ID token and clear UI of all previous messages.
// resetUI();
// [END_EXCLUDE]
})
.catch((err) => {
console.log("[FCM] Unable to retrieve refreshed token ", err);
// showToken("Unable to retrieve refreshed token ", err);
});
});
}
// messaging.onTokenRefresh(() => {
// messaging
// .getToken()
// .then((refreshedToken) => {
// console.log("[FCM] Token refreshed.");
// // Indicate that the new Instance ID token has not yet been sent to the
// // app server.
// // setTokenSentToServer(false);
// // // Send Instance ID token to app server.
// // sendTokenToServer(refreshedToken);
// // // [START_EXCLUDE]
// // // Display new Instance ID token and clear UI of all previous messages.
// // resetUI();
// // [END_EXCLUDE]
// })
// .catch((err) => {
// console.log("[FCM] Unable to retrieve refreshed token ", err);
// // showToken("Unable to retrieve refreshed token ", err);
// });
// });
// }

39
client/src/redux/user/user.sagas.js
View File

@@ -1,12 +1,20 @@
import Fingerprint2 from "@fingerprintjs/fingerprintjs";
import * as Sentry from "@sentry/browser";
import { notification } from "antd";
import { auth, analytics, firestore } from "../../firebase/firebase.utils";
import { setUserId, setUserProperties } from "firebase/analytics";
import {
checkActionCode,
confirmPasswordReset,
signInWithEmailAndPassword,
signOut,
} from "firebase/auth";
import { doc } from "firebase/firestore";
import i18next from "i18next";
import LogRocket from "logrocket";
import { all, call, delay, put, select, takeLatest } from "redux-saga/effects";
import { tracker } from "../../App/App.container";
import {
analytics,
auth,
firestore,
getCurrentUser,
logImEXEvent,
updateCurrentUser,
@@ -28,8 +36,6 @@ import {
validatePasswordResetSuccess,
} from "./user.actions";
import UserActionTypes from "./user.types";
import * as Sentry from "@sentry/browser";
import { tracker } from "../../App/App.container";
export function* onEmailSignInStart() {
yield takeLatest(UserActionTypes.EMAIL_SIGN_IN_START, signInWithEmail);
@@ -38,7 +44,7 @@ export function* signInWithEmail({ payload: { email, password } }) {
try {
logImEXEvent("redux_sign_in_attempt", { user: email });
const { user } = yield auth.signInWithEmailAndPassword(email, password);
const { user } = yield signInWithEmailAndPassword(auth, email, password);
yield put(
signInSuccess({
@@ -90,7 +96,7 @@ export function* signOutStart() {
try {
logImEXEvent("redux_sign_out");
yield auth.signOut();
yield signOut(auth);
yield put(signOutSuccess());
localStorage.removeItem("token");
} catch (error) {
@@ -104,10 +110,7 @@ export function* onUpdateUserDetails() {
export function* updateUserDetails(userDetails) {
try {
const updatedDetails = yield updateCurrentUser(userDetails.payload);
console.log(
"🚀 ~ file: user.sagas.js ~ line 104 ~ updatedDetails",
updatedDetails
);
yield put(updateUserDetailsSuccess(updatedDetails));
notification.open({
type: "success",
@@ -122,7 +125,7 @@ export function* onSetInstanceId() {
}
export function* setInstanceIdSaga({ payload: uid }) {
try {
const userInstanceRef = firestore.doc(`userInstance/${uid}`);
const userInstanceRef = doc(firestore, `userInstance/${uid}`);
const fingerprint = Fingerprint2.x64hash128(
(yield Fingerprint2.getPromise({})).map((c) => c.value).join(""),
@@ -147,7 +150,7 @@ export function* onCheckInstanceId() {
}
export function* checkInstanceIdSaga({ payload: uid }) {
try {
const userInstanceRef = firestore.doc(`userInstance/${uid}`);
const userInstanceRef = doc(firestore, `userInstance/${uid}`);
const snapshot = yield userInstanceRef.get();
let fingerprint = yield select((state) => state.user.fingerprint);
@@ -193,8 +196,8 @@ export function* signInSuccessSaga({ payload }) {
}
// if (!payload.email.includes("@imex.")) yield put(setInstanceId(payload.uid));
analytics.setUserId(payload.email);
analytics.setUserProperties(payload);
setUserId(analytics, payload.email);
setUserProperties(analytics, payload);
yield logImEXEvent("redux_sign_in_success");
}
@@ -210,7 +213,7 @@ export function* onSendPasswordResetStart() {
}
export function* sendPasswordResetEmail({ payload }) {
try {
yield auth.sendPasswordResetEmail(payload, {
yield sendPasswordResetEmail(payload, {
url: "https://imex.online/passwordreset",
});
@@ -228,8 +231,8 @@ export function* onValidatePasswordResetStart() {
}
export function* validatePasswordResetStart({ payload: { password, code } }) {
try {
auth.checkActionCode(code);
yield auth.confirmPasswordReset(code, password);
checkActionCode(auth, code);
yield confirmPasswordReset(auth, code, password);
yield put(validatePasswordResetSuccess());
} catch (error) {
console.log("function*validatePasswordResetStart -> error", error);