From eca6aa9b049df0b8e0ccb74bfcba8036364a152e Mon Sep 17 00:00:00 2001
From: Art Lowel <art.lowel@atmire.com>
Date: Thu, 30 May 2019 10:06:06 +0200
Subject: [PATCH] refactor webpack config

---
 .../search-facet-option.component.html        |  0
 .../search-facet-option.component.ts          |  1 -
 .../search-facet-range-option.component.html  |  0
 src/app/app.component.html                    |  2 +-
 webpack/helpers.js                            | 80 +++++++++++++------
 webpack/webpack.common.js                     | 80 +++----------------
 6 files changed, 69 insertions(+), 94 deletions(-)
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html

diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
index b5d2a56e31..1fccee3736 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
@@ -13,7 +13,6 @@ import { FilterType } from '../../../../search-service/filter-type.model';
 @Component({
   selector: 'ds-search-facet-option',
   styleUrls: ['./search-facet-option.component.scss'],
-  // templateUrl: './search-facet-option.component.html',
   templateUrl: './search-facet-option.component.html',
 })
 
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/src/app/app.component.html b/src/app/app.component.html
index e368a5ab6b..4482cd02f8 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,4 +1,4 @@
-<div class="outer-wrapper mantis">
+<div class="outer-wrapper">
     <ds-admin-sidebar></ds-admin-sidebar>
     <div class="inner-wrapper"  [@slideSidebarPadding]="{
      value: (!(sidebarVisible | async) ? 'hidden' : (slideSidebarOver | async) ? 'shown' : 'expanded'),
diff --git a/webpack/helpers.js b/webpack/helpers.js
index 5b4fced7bb..7674cce152 100644
--- a/webpack/helpers.js
+++ b/webpack/helpers.js
@@ -1,40 +1,72 @@
-const {
-    join,
-    resolve,
-    normalize,
-} = require('path');
+const path = require('path');
+const fs = require('fs');
 
 
-function root(path) {
-    return resolve(__dirname, '..', path);
+function root(relativePath) {
+  return path.resolve(__dirname, '..', relativePath);
 }
 
 // const theme = '';
 const theme = 'mantis';
 
-const themePath = normalize(join(__dirname, '..', 'themes', theme));
+const themePath = path.normalize(path.join(__dirname, '..', 'themes', theme));
 
 const globalCSSImports = [
-    resolve(__dirname, '..', 'src/styles/_variables.scss'),
-    resolve(__dirname, '..', 'src/styles/_mixins.scss'),
+  path.resolve(__dirname, '..', 'src/styles/_variables.scss'),
+  path.resolve(__dirname, '..', 'src/styles/_mixins.scss'),
 ];
 
 const themeReplaceOptions =
-        {
-            multiple: [
-                {
-                    search: '$themePath$/',
-                    replace: (themePath.length ? themePath + '/' : ''),
+  {
+    multiple: [
+      {
+        search: '$themePath$/',
+        replace: (themePath.length ? themePath + '/' : ''),
 
-                }
-            ]
-        };
+      }
+    ]
+  };
+
+const srcPath = root('src');
+
+const getThemedPath = (componentPath, ext) => {
+  const parsedPath = path.parse(componentPath);
+  const relativePath = path.relative(srcPath, parsedPath.dir);
+  return path.join(themePath, relativePath, `${parsedPath.name}.${ext}`);
+};
+
+const themedTest = (origPath, extension) => {
+  if (/\.component.ts$/.test(origPath)) { // only match components
+    const themedPath = getThemedPath(origPath, extension);
+    return fs.existsSync(themedPath);
+  } else {
+    return false;
+  }
+};
+
+const themedUse = (resource, extension) => {
+  const origPath = path.parse(resource);
+  const themedPath = getThemedPath(resource, extension);
+
+  return [
+    //'debug-loader',
+    {
+      loader: 'string-replace-loader',
+      options: {
+        search: `\.\/${origPath.name}\.${extension}`,
+        replace: themedPath,
+        flags: 'g'
+      }
+    }
+  ]
+};
 
 module.exports = {
-    root: root,
-    join: join,
-    theme: theme,
-    themePath: themePath,
-    globalCSSImports: globalCSSImports,
-    themeReplaceOptions: themeReplaceOptions
+  root: root,
+  theme: theme,
+  getThemedPath: getThemedPath,
+  themedTest: themedTest,
+  themedUse: themedUse,
+  globalCSSImports: globalCSSImports,
+  themeReplaceOptions: themeReplaceOptions
 };
diff --git a/webpack/webpack.common.js b/webpack/webpack.common.js
index 477aa09835..2b13b4b4ae 100644
--- a/webpack/webpack.common.js
+++ b/webpack/webpack.common.js
@@ -1,23 +1,13 @@
 const CopyWebpackPlugin = require('copy-webpack-plugin');
 const path = require('path');
-const fs = require('fs');
 const {
   root,
-  join,
   globalCSSImports,
   themeReplaceOptions,
-  theme,
-  themePath
+  themedTest,
+  themedUse
 } = require('./helpers');
 
-const srcPath = root('src');
-
-const getThemedPath = (componentPath, ext) => {
-  const parsedPath = path.parse(componentPath);
-  const relativePath = path.relative(srcPath, parsedPath.dir);
-  return path.join(themePath, relativePath, `${parsedPath.name}.${ext}`);
-};
-
 module.exports = {
   mode: 'development',
   devtool: 'source-map',
@@ -37,58 +27,12 @@ module.exports = {
   module: {
     rules: [
       {
-        test: (filePath) => {
-          if (/\.component.ts$/.test(filePath)) {
-            const themedStylePath = getThemedPath(filePath, 'scss');
-            return fs.existsSync(themedStylePath);
-          } else {
-            return false;
-          }
-        },
-        use: (info) => {
-          const parsedPath = path.parse(info.resource);
-          const themedStylePath = getThemedPath(info.resource, 'scss');
-          console.log('themedStylePath', themedStylePath);
-          return [
-            'debug-loader',
-            {
-              loader: 'string-replace-loader',
-              options: {
-                search: `\.\/${parsedPath.name}\.scss`,
-                replace: themedStylePath,
-                flags: 'g'
-              }
-
-            }
-          ]
-        }
+        test: (filePath) => themedTest(filePath, 'scss'),
+        use: (info) => themedUse(info.resource, 'scss')
       },
       {
-        test: (filePath) => {
-          if (/\.component.ts$/.test(filePath)) {
-            const themedTemplatePath = getThemedPath(filePath, 'html');
-            return fs.existsSync(themedTemplatePath);
-          } else {
-            return false;
-          }
-        },
-        use: (info) => {
-          const parsedPath = path.parse(info.resource);
-          const themedTemplatePath = getThemedPath(info.resource, 'html');
-
-          return [
-            'debug-loader',
-            {
-              loader: 'string-replace-loader',
-              options: {
-                search: `\.\/${parsedPath.name}\.html`,
-                replace: themedTemplatePath,
-                flags: 'g'
-              }
-
-            }
-          ]
-        }
+        test: (filePath) => themedTest(filePath, 'html'),
+        use: (info) => themedUse(info.resource, 'html')
       },
       {
         test: /\.ts$/,
@@ -182,14 +126,14 @@ module.exports = {
   },
   plugins: [
     new CopyWebpackPlugin([{
-      from: join(__dirname, '..', 'node_modules', '@fortawesome', 'fontawesome-free', 'webfonts'),
-      to: join('assets', 'fonts')
+      from: path.join(__dirname, '..', 'node_modules', '@fortawesome', 'fontawesome-free', 'webfonts'),
+      to: path.join('assets', 'fonts')
     }, {
-      from: join(__dirname, '..', 'resources', 'images'),
-      to: join('assets', 'images')
+      from: path.join(__dirname, '..', 'resources', 'images'),
+      to: path.join('assets', 'images')
     }, {
-      from: join(__dirname, '..', 'resources', 'i18n'),
-      to: join('assets', 'i18n')
+      from: path.join(__dirname, '..', 'resources', 'i18n'),
+      to: path.join('assets', 'i18n')
     }
     ])
   ]