@quintype/framework 7.3.2-node16.5 → 7.3.2-node16.6

package/README.md

@@ -145,23 +145,30 @@ startApp(renderApplication, CUSTOM_REDUCERS, {
 
 Steps to Integrate FCM in your project
 
-1. While executing startApp in your project set enableFCM to true.
+1. app/client/app.js While executing startApp in your project send the firebaseConfig via opts. `firebaseConfig` can either be an object or a function that returns the firebase config object
 
-An Example
+Example:
 
-```
+```js
 startApp(renderApplication,
   CUSTOM_REDUCERS,
   {
   enableServiceWorker: process.env.NODE_ENV === "production",
-  fcmMessagingSenderId: (page) => <MessageSenderId> || fcmMessagingSenderId: <MessageSenderId> {(function|string)}
+  firebaseConfig: {
+    messagingSenderId: --YOUR KEY-- ,
+    projectId: --YOUR KEY--,
+    apiKey: --YOUR KEY--,
+    storageBucket: --YOUR KEY--,
+    authDomain: --YOUR KEY--,
+    appId: --YOUR KEY--,
+  }
   ...
 })
 ```
 
 2. app/server/app.js should have the fcm configuration as below:
 
-```
+```js
 isomorphicRoutes(app, {
   ...
   fcmServerKey: (config) => <ServerKey> || fcmServerKey: <ServerKey> {(function|string)}
@@ -174,28 +181,45 @@ isomorphicRoutes(app, {
 
    Example of the script:
 
-   ```
-       importScripts("https://www.gstatic.com/firebasejs/4.8.1/firebase-app.js");
-       importScripts("https://www.gstatic.com/firebasejs/4.8.1/firebase-messaging.js");
-       firebase.initializeApp({
-         messagingSenderId: <your message sender Id>
-       });
-       const messaging = firebase.messaging();
-       function messageHandler(payload) {
-         const data = payload["data"];
-
-         var notificationTitle = data.title;
-         var notificationOptions = {
-           body: data.body,
-           icon: data["hero_image_s3_url"],
-           image: data["hero_image_s3_url"],
-           data: data
-         };
-
-         return self.registration.showNotification(notificationTitle,
-           notificationOptions);
-       }
-       messaging.setBackgroundMessageHandler(messageHandler);
+   ```js
+    importScripts("https://www.gstatic.com/firebasejs/9.6.10/firebase-app-compat.js");
+    importScripts("https://www.gstatic.com/firebasejs/9.6.10/firebase-messaging-compat.js");
+
+    firebase.initializeApp({
+      messagingSenderId: --YOUR KEY-- ,
+      projectId: --YOUR KEY--,
+      apiKey: --YOUR KEY--,
+      storageBucket: --YOUR KEY--,
+      authDomain: --YOUR KEY--,
+      appId: --YOUR KEY--,
+    });
+    self.addEventListener('notificationclick', (event) => {
+
+      const url = event.notification.data.url;
+      if(url) {
+        clients.openWindow(url);
+      }
+      clients.openWindow(-- YOUR Sketches Host --);
+    }, false);
+
+    const messaging = firebase.messaging();
+
+    messaging.onBackgroundMessage(function(payload) {
+      const data = payload["data"];
+      const notificationTitle = data.title || ""
+      const notificationOptions = {
+        body: data.body,
+        icon: data["hero_image_s3_url"],
+        image: data["hero_image_s3_url"],
+        data: {
+          url: data["click_action"],
+        }
+      };
+
+      self.registration.showNotification(notificationTitle,
+        notificationOptions);
+    });
+
    ```
 
 4. Make sure that the page data should have config with key fcmMessageSenderId refer doStartApp function in app/client/start.js.

package/client/impl/fcm.js

@@ -1,8 +1,4 @@
 export function initializeFCM(firebaseConfig) {
-  if (!firebaseConfig.messagingSenderId) {
-    console.log("messagingSenderId is required");
-    return false;
-  }
   Promise.all([
     import(/* webpackChunkName: "firebase-app" */ "firebase/app"),
     import(/* webpackChunkName: "firebase-messaging" */ "firebase/messaging"),

package/client/start.js

@@ -286,7 +286,9 @@ export function startApp(renderApplication, reducers, opts) {
       const fcm = typeof opts.firebaseConfig === "function" ? opts.firebaseConfig(page) : opts.firebaseConfig;
       if (fcm) {
         const mssgSenderId = fcm.messagingSenderId;
-        mssgSenderId && initializeFCM(fcm);
+        const projectId = fcm.projectId;
+        const apiKey = fcm.apiKey;
+        if (mssgSenderId && projectId && apiKey) initializeFCM(fcm);
       }
     }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quintype/framework",
-  "version": "7.3.2-node16.5",
+  "version": "7.3.2-node16.6",
   "description": "Libraries to help build Quintype Node.js apps",
   "main": "index.js",
   "scripts": {
@@ -27,7 +27,7 @@
   "homepage": "https://github.com/quintype/quintype-node-framework#readme",
   "dependencies": {
     "@ampproject/toolbox-optimizer": "2.8.3",
-    "@quintype/amp": "^2.4.19",
+    "@quintype/amp": "^2.4.20-amp-date-translation.1",
     "@quintype/backend": "^2.3.1",
     "@quintype/components": "^3.0.0",
     "@quintype/prerender-node": "^3.2.24",