add useContexts which takes an array of require.context

Author: cymen

react_ujs/index.js

@@ -5,6 +5,7 @@ var ReactDOMServer = require("react-dom/server")
 var detectEvents = require("./src/events/detect")
 var constructorFromGlobal = require("./src/getConstructor/fromGlobal")
 var constructorFromRequireContextWithGlobalFallback = require("./src/getConstructor/fromRequireContextWithGlobalFallback")
+var constructorFromRequireContextsWithGlobalFallback = require("./src/getConstructor/fromRequireContextsWithGlobalFallback")
 
 var ReactRailsUJS = {
   // This attribute holds the name of component which should be mounted
@@ -72,6 +73,13 @@ var ReactRailsUJS = {
     this.getConstructor = constructorFromRequireContextWithGlobalFallback(requireContext)
   },
 
+  // Given an array of Webpack `require.context`,
+  // try finding components with `require`,
+  // then falling back to global lookup.
+  useContexts: function(requireContexts) {
+    this.getConstructor = constructorFromRequireContextsWithGlobalFallback(requireContexts)
+  },
+
   // Render `componentName` with `props` to a string,
   // using the specified `renderFunction` from `react-dom/server`.
   serverRender: function(renderFunction, componentName, props) {

react_ujs/src/getConstructor/fromRequireContextsWithGlobalFallback.js

@@ -0,0 +1,39 @@
+// Make a function which:
+// - First tries to require the name
+// - Then falls back to global lookup
+var fromGlobal = require("./fromGlobal")
+var fromRequireContext = require("./fromRequireContext")
+
+module.exports = function(reqctxs) {
+  var fromCtxs = reqctxs.map((reqctx) => fromRequireContext(reqctx))
+  return function(className) {
+    var component;
+    try {
+      var index = 0, fromCtx, firstErr;
+      do {
+        fromCtx = fromCtxs[index];
+
+        try {
+          // `require` will raise an error if this className isn't found:
+          component = fromCtx(className)
+        } catch (fromCtxErr) {
+          if (!firstErr) {
+            firstErr = fromCtxErr;
+          }
+        }
+
+        index += 1;
+      } while (index < fromCtxs.length);
+      if (!component) throw firstErr;
+    } catch (firstErr) {
+      // fallback to global:
+      try {
+        component = fromGlobal(className)
+      } catch (secondErr) {
+        console.error(firstErr)
+        console.error(secondErr)
+      }
+    }
+    return component
+  }
+}