From c99a86d8abc31082709e4473588df21c8354ae68 Mon Sep 17 00:00:00 2001
From: FieryCod <kwcharllie379@gmail.com>
Date: Sun, 15 Oct 2017 21:31:01 +0200
Subject: [PATCH] Adds support for folders in /layouts

---
 lib/builder/builder.js                        |  4 ++--
 .../with-config/layouts/desktop/default.vue   | 20 ++++++++++++++++++
 .../with-config/layouts/mobile/default.vue    | 21 +++++++++++++++++++
 test/fixtures/with-config/pages/desktop.vue   | 12 +++++++++++
 test/fixtures/with-config/pages/mobile.vue    | 12 +++++++++++
 test/with-config.test.js                      | 18 +++++++++++++++-
 6 files changed, 84 insertions(+), 3 deletions(-)
 create mode 100644 test/fixtures/with-config/layouts/desktop/default.vue
 create mode 100644 test/fixtures/with-config/layouts/mobile/default.vue
 create mode 100644 test/fixtures/with-config/pages/desktop.vue
 create mode 100644 test/fixtures/with-config/pages/mobile.vue

diff --git a/lib/builder/builder.js b/lib/builder/builder.js
index a9ec11e2dd..fb543a95e6 100644
--- a/lib/builder/builder.js
+++ b/lib/builder/builder.js
@@ -227,10 +227,10 @@ export default class Builder extends Tapable {
 
     // -- Layouts --
     if (fs.existsSync(resolve(this.options.srcDir, 'layouts'))) {
-      const layoutsFiles = await glob('layouts/*.vue', { cwd: this.options.srcDir })
+      const layoutsFiles = await glob('layouts/**/*.vue', { cwd: this.options.srcDir })
       let hasErrorLayout = false
       layoutsFiles.forEach((file) => {
-        let name = file.split('/').slice(-1)[0].replace(/\.vue$/, '')
+        let name = file.split('/').slice(1).join('/').replace(/\.vue$/, '')
         if (name === 'error') {
           hasErrorLayout = true
           return
diff --git a/test/fixtures/with-config/layouts/desktop/default.vue b/test/fixtures/with-config/layouts/desktop/default.vue
new file mode 100644
index 0000000000..329274e836
--- /dev/null
+++ b/test/fixtures/with-config/layouts/desktop/default.vue
@@ -0,0 +1,20 @@
+<template>
+  <div>
+    <h1>Default desktop layout</h1>
+    <nuxt/>
+  </div>
+</template>
+
+<style>
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Roboto'), local('Roboto-Regular'), url(~/assets/roboto.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
+}
+
+body {
+  font-family: 'Roboto';
+}
+</style>
diff --git a/test/fixtures/with-config/layouts/mobile/default.vue b/test/fixtures/with-config/layouts/mobile/default.vue
new file mode 100644
index 0000000000..548fe9b27b
--- /dev/null
+++ b/test/fixtures/with-config/layouts/mobile/default.vue
@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <h1>Default mobile layout</h1>
+    <nuxt/>
+  </div>
+</template>
+
+<style>
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Roboto'), local('Roboto-Regular'), url(~/assets/roboto.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
+}
+
+body {
+  font-family: 'Roboto';
+}
+</style>
+
diff --git a/test/fixtures/with-config/pages/desktop.vue b/test/fixtures/with-config/pages/desktop.vue
new file mode 100644
index 0000000000..4c0951062e
--- /dev/null
+++ b/test/fixtures/with-config/pages/desktop.vue
@@ -0,0 +1,12 @@
+<template>
+  <div>
+    <h1>Desktop page</h1>
+  </div>
+</template>
+
+<script>
+export default {
+  layout: 'desktop/default'
+}
+</script>
+
diff --git a/test/fixtures/with-config/pages/mobile.vue b/test/fixtures/with-config/pages/mobile.vue
new file mode 100644
index 0000000000..915e603c6e
--- /dev/null
+++ b/test/fixtures/with-config/pages/mobile.vue
@@ -0,0 +1,12 @@
+<template>
+  <div>
+    <h1>Mobile page</h1>
+  </div>
+</template>
+
+<script>
+export default {
+  layout: 'mobile/default'
+}
+</script>
+
diff --git a/test/with-config.test.js b/test/with-config.test.js
index 579affa5cd..c0bfe0674b 100644
--- a/test/with-config.test.js
+++ b/test/with-config.test.js
@@ -61,6 +61,22 @@ test('/test/about (custom layout)', async t => {
   t.true(html.includes('<h1>About page</h1>'))
 })
 
+test('/test/desktop (custom layout in desktop folder)', async t => {
+  const window = await nuxt.renderAndGetWindow(url('/test/desktop'))
+  const html = window.document.body.innerHTML
+  t.is(window.__NUXT__.layout, 'desktop/default')
+  t.true(html.includes('<h1>Default desktop layout</h1>'))
+  t.true(html.includes('<h1>Desktop page</h1>'))
+})
+
+test('/test/mobile (custom layout in mobile folder)', async t => {
+  const window = await nuxt.renderAndGetWindow(url('/test/mobile'))
+  const html = window.document.body.innerHTML
+  t.is(window.__NUXT__.layout, 'mobile/default')
+  t.true(html.includes('<h1>Default mobile layout</h1>'))
+  t.true(html.includes('<h1>Mobile page</h1>'))
+})
+
 test('/test/env', async t => {
   const window = await nuxt.renderAndGetWindow(url('/test/env'))
   const html = window.document.body.innerHTML
@@ -95,7 +111,7 @@ test('/test/about-bis (added with extendRoutes)', async t => {
 
 test('Check stats.json generated by build.analyze', t => {
   const stats = require(resolve(__dirname, 'fixtures/with-config/.nuxt/dist/stats.json'))
-  t.is(stats.assets.length, 27)
+  t.is(stats.assets.length, 35)
 })
 
 test('Check /test/test.txt with custom serve-static options', async t => {