Use source-specific default layouts (gatsbyjs#36)

* set up test content

* backwards compatibility for defaultLayout

* use source default layout and fallback to default

packages/gatsby-plugin-mdx/gatsby-node.js

@@ -17,12 +17,12 @@ exports.setFieldsOnGraphQLNodeType = require("./extend-node-type");
  * Add the webpack config for loading MDX files
  */
 exports.onCreateWebpackConfig = (
-  { stage, rules, loaders, plugins, actions },
+  { stage, rules, loaders, plugins, actions, getNodes },
   pluginOptions
 ) => {
-  const { extensions } = defaultOptions(pluginOptions);
+  const options = defaultOptions(pluginOptions);
   const testPattern = new RegExp(
-    extensions.map(ext => `${escapeStringRegexp(ext)}$`).join("|")
+    options.extensions.map(ext => `${escapeStringRegexp(ext)}$`).join("|")
   );
 
   actions.setWebpackConfig({
@@ -34,7 +34,10 @@ exports.onCreateWebpackConfig = (
             loaders.js(),
             {
               loader: "gatsby-mdx/mdx-loader",
-              options: pluginOptions
+              options: {
+                getNodes,
+                pluginOptions: options
+              }
             }
           ]
         }

packages/gatsby-plugin-mdx/mdx-loader.js

@@ -1,3 +1,4 @@
+const _ = require("lodash");
 const { getOptions } = require("loader-utils");
 const mdx = require("./utils/mdx");
 const debug = require("debug")("gatsby-mdx:mdx-loader");
@@ -6,22 +7,38 @@ const hasDefaultExport = str => /\nexport default/.test(str);
 
 module.exports = async function(content) {
   const callback = this.async();
-  const options = getOptions(this);
+  const { getNodes, pluginOptions } = getOptions(this);
+
+  const fileNode = _.first(
+    getNodes().filter(
+      node =>
+        node.internal.type === `File` && node.absolutePath === this.resourcePath
+    )
+  );
+
+  const source = fileNode && fileNode.sourceInstanceName;
+
+  // get the default layout for the file source group, or if it doesn't
+  // exist, the overall default layout
+  const defaultLayout = _.get(
+    pluginOptions.defaultLayouts, source,
+    _.get(pluginOptions.defaultLayouts, "default")
+  );
 
   let code = content;
   // after running mdx, the code *always* has a default export, so this
   // check needs to happen first.
-  if (!hasDefaultExport(content) && !!options.defaultLayout) {
-    debug("inserting default layout", options.defaultLayout);
-    code = `import DefaultLayout from "${options.defaultLayout}"
+  if (!hasDefaultExport(content) && !!defaultLayout) {
+    debug("inserting default layout", defaultLayout);
+    code = `import DefaultLayout from "${defaultLayout}"
 
 
 export default DefaultLayout
 
 ${content}`;
   }
 
-  code = await mdx(code, options);
+  code = await mdx(code, pluginOptions);
 
   return callback(
     null,

packages/gatsby-plugin-mdx/utils/default-options.js

@@ -1,9 +1,18 @@
-module.exports = pluginOptions =>
-  Object.assign(
+module.exports = pluginOptions => {
+  const options = Object.assign(
     {
       extensions: [".mdx"],
       mdPlugins: [],
-      hastPlugins: []
+      hastPlugins: [],
+      defaultLayouts: {}
     },
     pluginOptions
   );
+
+  // backwards compatibility for `defaultLayout`
+  if (options.defaultLayout && !options.defaultLayouts.default) {
+    options.defaultLayouts.default = options.defaultLayout;
+  }
+
+  return options;
+};