Twitter, IG Lazy load, rename service worker

Author: thandaanda

gatsby-wordpress-theme-libre/gatsby-browser.js

@@ -1,13 +1,92 @@
 import "./src/styles/global.css";
 /* global window, document */
+const instaEmbedClasses = [".instagram-media"].join(",");
+const twitterEmbedClasses = [
+  ".twitter-tweet",
+  ".twitter-timeline",
+  ".twitter-follow-button",
+  ".twitter-share-button",
+].join(",");
 const scrollTo = (id) => () => {
   const el = document.querySelector(id);
   if (el) return window.scrollTo(0, el.offsetTop - 20);
   return false;
 };
 
+const injectScript = function injectScript() {
+  var js = document.createElement("script");
+  var firstScript = document.getElementsByTagName("script")[0];
+  js.id = "gatsby-plugin-instagram";
+  js.src = "https://instagram.com/embed.js";
+  firstScript.parentNode.insertBefore(js, firstScript);
+  injected = true;
+  if (
+    typeof instgrm !== "undefined" &&
+    window.instgrm.Embeds &&
+    typeof window.instgrm.Embeds.process === "function"
+  ) {
+    // manual process
+    window.instgrm.Embeds.process();
+  }
+  return true;
+};
+
+var injectTwitterScript = function injectTwitterScript() {
+  function addJS(jsCode) {
+    var s = document.createElement("script");
+    s.type = "text/javascript";
+    s.innerText = jsCode;
+    document.getElementsByTagName("head")[0].appendChild(s);
+    injectedTwitterScript = true;
+
+    if (
+      typeof twttr !== "undefined" &&
+      window.twttr.widgets &&
+      typeof window.twttr.widgets.load === "function"
+    ) {
+      window.twttr.widgets.load();
+    }
+  }
+
+  addJS(
+    '\n    window.twttr = (function(d, s, id) {\n      var js,\n        fjs = d.getElementsByTagName(s)[0],\n        t = window.twttr || {};\n      if (d.getElementById(id)) return t;\n      js = d.createElement(s);\n      js.id = id;\n      js.src = "https://platform.twitter.com/widgets.js";\n      fjs.parentNode.insertBefore(js, fjs);\n      t._e = [];\n      t.ready = function(f) {\n        t._e.push(f);\n      };\n      return t;\n    })(document, "script", "twitter-wjs");\n  '
+  );
+};
+let injected = false;
+let injectedTwitterScript = false;
+
 export const onRouteUpdate = ({ location: { hash } }) => {
   if (hash) {
     window.setTimeout(scrollTo(hash), 10);
   }
+
+  if (document.querySelector(instaEmbedClasses) !== null) {
+    setTimeout(() => {
+      if (!injected) {
+        window.addEventListener(
+          "scroll",
+          function () {
+            injectScript();
+          },
+          { once: true }
+        );
+      }
+    }, 2000);
+  }
+
+  if (document.querySelector(twitterEmbedClasses) !== null) {
+    setTimeout(() => {
+      if (!injectedTwitterScript) {
+        window.addEventListener(
+          "scroll",
+          function () {
+            injectTwitterScript();
+          },
+          { once: true }
+        );
+      }
+    }, 2000);
+  }
 };
+
+export const registerServiceWorker = () => true;

gatsby-wordpress-theme-libre/gatsby-config.js

@@ -110,7 +110,6 @@ module.exports = (themeOptions) => {
           icon: "static/favicon.png",
         },
       },
-      'gatsby-plugin-remove-serviceworker',
       {
         resolve: `gatsby-plugin-feed`,
         options: {

gatsby-wordpress-theme-libre/gatsby-ssr.js

@@ -58,13 +58,13 @@
     "gatsby-plugin-manifest": "^2.2.48",
     "gatsby-plugin-react-helmet": "^3.1.23",
     "gatsby-plugin-remove-generator": "^1.0.5",
-    "gatsby-plugin-remove-serviceworker": "^1.0.0",
     "gatsby-plugin-sharp": "^2.4.11",
     "gatsby-plugin-typescript": "^2.2.3",
     "gatsby-source-filesystem": "^2.1.53",
     "gatsby-source-wordpress": "^3.1.69",
     "gatsby-transformer-sharp": "^2.3.18",
     "html-to-text": "^5.1.1",
+    "lodash": "^4.17.19",
     "node-fetch": "^2.6.0",
     "react-helmet": "^5.2.1",
     "react-intersection-observer": "^8.26.2",

gatsby-wordpress-theme-libre/package.json

@@ -6294,11 +6294,6 @@ gatsby-plugin-remove-generator@^1.0.5:
   resolved "https://registry.yarnpkg.com/gatsby-plugin-remove-generator/-/gatsby-plugin-remove-generator-1.0.5.tgz#ca1da320b7a860fb6e7a1974e9b433acc45bdc39"
   integrity sha512-9Iq8JBHcc9BOp/uDCF0ctI9ntr6LjGUTgHkmwEiYiuHG6DQxutwCFQ9OVT9bomYKF/nDFQW0MfbC4eP9il4YCA==
 
-gatsby-plugin-remove-serviceworker@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/gatsby-plugin-remove-serviceworker/-/gatsby-plugin-remove-serviceworker-1.0.0.tgz#9fb433bc8bd766e14e1d3711c4ac6f051e1dff7c"
-  integrity sha1-n7QzvIvXZuFOHTcRxKxvBR4d/3w=
-
 gatsby-plugin-sharp@^2.4.11:
   version "2.4.13"
   resolved "https://registry.yarnpkg.com/gatsby-plugin-sharp/-/gatsby-plugin-sharp-2.4.13.tgz#da47cfd8a0d80fc35b7bb072d8a84f6f4f29116d"
@@ -8855,6 +8850,11 @@ lodash@4.17.15, lodash@^4.11.1, lodash@^4.13.1, lodash@^4.17.11, lodash@^4.17.12
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.15.tgz#b447f6670a0455bbfeedd11392eff330ea097548"
   integrity sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==
 
+lodash@^4.17.19:
+  version "4.17.19"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.19.tgz#e48ddedbe30b3321783c5b4301fbd353bc1e4a4b"
+  integrity sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ==
+
 log-update@^3.0.0:
   version "3.4.0"
   resolved "https://registry.yarnpkg.com/log-update/-/log-update-3.4.0.tgz#3b9a71e00ac5b1185cc193a36d654581c48f97b9"
@@ -12216,7 +12216,7 @@ shallowequal@^1.0.1, shallowequal@^1.1.0:
   resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
   integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
 
-sharp@0.23.4, sharp@^0.23.4:
+sharp@^0.23.4:
   version "0.23.4"
   resolved "https://registry.yarnpkg.com/sharp/-/sharp-0.23.4.tgz#ca36067cb6ff7067fa6c77b01651cb9a890f8eb3"
   integrity sha512-fJMagt6cT0UDy9XCsgyLi0eiwWWhQRxbwGmqQT6sY8Av4s0SVsT/deg8fobBQCTDU5iXRgz0rAeXoE2LBZ8g+Q==