fix(gatsby-plugin-netlify-cms): dynamically import netlify-identity-w…

…idget (#9565)
gatsbyjs · Nov 29, 2018 · 49100e9 · 49100e9
1 parent b7d4656
commit 49100e9
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 8 deletions.
diff --git a/packages/babel-preset-gatsby-package/__tests__/index.js b/packages/babel-preset-gatsby-package/__tests__/index.js
@@ -32,6 +32,9 @@ it(`Specifies proper presets and plugins in Node mode`, () => {
       path.join(`@babel`, `plugin-proposal-optional-chaining`)
     ),
     expect.stringContaining(path.join(`@babel`, `plugin-transform-runtime`)),
+    expect.stringContaining(
+      path.join(`@babel`, `plugin-syntax-dynamic-import`)
+    ),
   ])
 })
 
@@ -66,6 +69,9 @@ it(`Specifies proper presets and plugins in debug Node mode`, () => {
       path.join(`@babel`, `plugin-proposal-optional-chaining`)
     ),
     expect.stringContaining(path.join(`@babel`, `plugin-transform-runtime`)),
+    expect.stringContaining(
+      path.join(`@babel`, `plugin-syntax-dynamic-import`)
+    ),
   ])
 })
 
@@ -100,6 +106,9 @@ it(`Specifies proper presets and plugins in browser mode`, () => {
       path.join(`@babel`, `plugin-proposal-optional-chaining`)
     ),
     expect.stringContaining(path.join(`@babel`, `plugin-transform-runtime`)),
+    expect.stringContaining(
+      path.join(`@babel`, `plugin-syntax-dynamic-import`)
+    ),
   ])
 })
 
@@ -134,5 +143,8 @@ it(`Specifies proper presets and plugins in debug browser mode`, () => {
       path.join(`@babel`, `plugin-proposal-optional-chaining`)
     ),
     expect.stringContaining(path.join(`@babel`, `plugin-transform-runtime`)),
+    expect.stringContaining(
+      path.join(`@babel`, `plugin-syntax-dynamic-import`)
+    ),
   ])
 })
diff --git a/packages/babel-preset-gatsby-package/index.js b/packages/babel-preset-gatsby-package/index.js
@@ -43,6 +43,7 @@ function preset(context, options = {}) {
       r(`@babel/plugin-proposal-class-properties`),
       r(`@babel/plugin-proposal-optional-chaining`),
       r(`@babel/plugin-transform-runtime`),
+      r(`@babel/plugin-syntax-dynamic-import`),
     ],
   }
 }

diff --git a/packages/babel-preset-gatsby-package/package.json b/packages/babel-preset-gatsby-package/package.json
@@ -5,6 +5,7 @@
   "dependencies": {
     "@babel/plugin-proposal-class-properties": "^7.0.0",
     "@babel/plugin-proposal-optional-chaining": "^7.0.0",
+    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
     "@babel/plugin-transform-runtime": "^7.0.0",
     "@babel/preset-env": "^7.0.0",
     "@babel/preset-flow": "^7.0.0",

diff --git a/packages/gatsby-plugin-netlify-cms/src/gatsby-browser.js b/packages/gatsby-plugin-netlify-cms/src/gatsby-browser.js
@@ -1,18 +1,33 @@
 /* global __PATH_PREFIX__ */
-import netlifyIdentityWidget from "netlify-identity-widget"
+
+// Taken from https://github.com/netlify/netlify-identity-widget
+const routes = /(confirmation|invite|recovery|email_change)_token=([^&]+)/
+const errorRoute = /error=access_denied&error_description=403/
+const accessTokenRoute = /access_token=/
 
 exports.onInitialClientRender = (
   _,
   { enableIdentityWidget = true, publicPath = `admin` }
 ) => {
-  if (enableIdentityWidget) {
-    netlifyIdentityWidget.on(`init`, user => {
-      if (!user) {
-        netlifyIdentityWidget.on(`login`, () => {
-          document.location.href = `${__PATH_PREFIX__}/${publicPath}/`
+  const hash = (document.location.hash || ``).replace(/^#\/?/, ``)
+
+  if (
+    enableIdentityWidget &&
+    (hash.match(routes) ||
+      hash.match(errorRoute) ||
+      hash.match(accessTokenRoute))
+  ) {
+    import(`netlify-identity-widget`).then(
+      ({ default: netlifyIdentityWidget }) => {
+        netlifyIdentityWidget.on(`init`, user => {
+          if (!user) {
+            netlifyIdentityWidget.on(`login`, () => {
+              document.location.href = `${__PATH_PREFIX__}/${publicPath}/`
+            })
+          }
         })
+        netlifyIdentityWidget.init()
       }
-    })
-    netlifyIdentityWidget.init()
+    )
   }
 }