Gatsby: plugin-netlify-cms: Post Login Callbacks Not Added on /admin/ Page

[Undistraction]

Description

The plugin should add a callback to handle redirects to /admin/ after a user logs in (use of callbacks is outlined in Netlify CMS docs here), however this callback is not added, so nothing happens after a user logs in. They have to refresh the page to access the admin panel.

The relevant code is found in gatsby-browser.js. I've added a console.log and it is never called:

exports.onInitialClientRender = function(_, _ref) {
  console.log("Gatsby-plugin-netlify-cms: onInitialClientRender Called");
  var _ref$enableIdentityWi = _ref.enableIdentityWidget,
    enableIdentityWidget =
      _ref$enableIdentityWi === void 0 ? true : _ref$enableIdentityWi,
    _ref$publicPath = _ref.publicPath,
    publicPath = _ref$publicPath === void 0 ? "admin" : _ref$publicPath;

  if (enableIdentityWidget) {
    _netlifyIdentityWidget.default.on("init", function(user) {
      if (!user) {
        _netlifyIdentityWidget.default.on("login", function() {
          document.location.href = __PATH_PREFIX__ + "/" + publicPath + "/";
        });
      }
    });

    _netlifyIdentityWidget.default.init();
  }
};

So it appears that exports.onInitialClientRender is not called when the page renders, but this makes sense as Gatsby isn't involved in the rendering of the CMS's index.html, so using Gatsby's browser API callbacks cannot work. So this callback _is_ successfully run on the home page which is generated by Gatsby and will correctly redirect from there. However it isn't run on the /admin/ page because that is completely isolated from Gatsby.

Steps to reproduce

There is a repo based on the netlify-cms-starter with instructions here.

Expected result

Callbacks are added and page redirects to /admin/ after login.

Actual result

No callbacks are added and the page doesn't redirect after login.

Attempted workarounds

I tried adding the code that adds the callbacks to the cms.js file, but netlifyIdentity is undefined at that point:

if (window.netlifyIdentity) {
  window.netlifyIdentity.on(`init`, user => {
    if (!user) {
      window.netlifyIdentity.on(`login`, () => {
        document.location.href = `/admin/`
      })
    }
  })
}

Possible Solutions

Note that because this plugin doesn't allow you to define your own index.html, there is currently no way of handling this manually.

1. Allow a user to define their own index.html by placing it in static/admin. The user could then add any callbacks and customisations they need (for example if a user wanted to include a font embed from Typekit or Google Fonts), however there would need to be some kind of mechanism in place for their custom page to import any initialisation code from their cms.js module.

2. The plugin uses html-webpack-plugin to render the index.html page. The callbacks could be added as part of its setup.

Environment

  System:
    OS: macOS High Sierra 10.13.6
    CPU: x64 Intel(R) Core(TM) i5-5575R CPU @ 2.80GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 8.11.3 - ~/.nvm/versions/node/v8.11.3/bin/node
    Yarn: 1.9.4 - /usr/local/bin/yarn
    npm: 6.4.0 - ~/.nvm/versions/node/v8.11.3/bin/npm
  Browsers:
    Chrome: 68.0.3440.106
    Safari: 11.1.2
  npmPackages:
    gatsby: next => 2.0.0-rc.19
    gatsby-plugin-netlify: next => 2.0.0-rc.6
    gatsby-plugin-netlify-cms: next => 3.0.0-rc.5
    gatsby-plugin-react-helmet: next => 3.0.0-rc.1
    gatsby-plugin-sass: next => 2.0.0-rc.2
    gatsby-plugin-sharp: next => 2.0.0-rc.7
    gatsby-remark-images: next => 2.0.1-rc.5
    gatsby-source-filesystem: next => 2.0.1-rc.6
    gatsby-transformer-remark: next => 2.1.1-rc.5
    gatsby-transformer-sharp: next => 2.1.1-rc.3
  npmGlobalPackages:
    gatsby-cli: 2.0.0-beta.13

Tagging @erquhart in as requested.

[erquhart]

To clarify, the code mentioned above does work, just not on the CMS page itself. It's purpose is to redirect users who have just signed up for CMS access and arrive at the site via verification link, which goes to the site root and needs to be redirected to /admin once authenticated.

The goal of this issue is to add this script for the admin page itself.

[kakadiadarpan]

cc @pieh @m-allanson @KyleAMathews

[Undistraction]

@kakadiadarpan What do you need to get this labelled as confirmed?

[erquhart]

@kakadiadarpan this is all Netlify CMS, probably won't need a review from the Gatsby core team. Working on a fix.

[kakadiadarpan]

@erquhart Thanks for the update!