git diff GitHub/develop...feature/migrate_dashboard_with_external_modules -- . ':(exclude)*/legacy/*' ':(exclude)*.lock' ':(exclude)*/dist/*'

cc.diff

diff --git a/app/javascript/components/pages/DashboardView/index.js b/app/javascript/components/pages/DashboardView/index.js
index daf195608..94b5721a6 100644
--- a/app/javascript/components/pages/DashboardView/index.js
+++ b/app/javascript/components/pages/DashboardView/index.js
@@ -1 +1,3 @@
-export { default } from './DashboardView'
+import { Dashboard } from 'xfers-dashboard'
+
+export default Dashboard
diff --git a/client_app/packages/xfers-dashboard/.gitignore b/client_app/packages/xfers-dashboard/.gitignore
new file mode 100644
index 000000000..ea1fc8ced
--- /dev/null
+++ b/client_app/packages/xfers-dashboard/.gitignore
@@ -0,0 +1,8 @@
+# dependencies
+/node_modules
+
+# misc
+.DS_Store
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
diff --git a/client_app/packages/xfers-dashboard/package.json b/client_app/packages/xfers-dashboard/package.json
new file mode 100644
index 000000000..2d860b68e
--- /dev/null
+++ b/client_app/packages/xfers-dashboard/package.json
@@ -0,0 +1,50 @@
+{
+  "name": "xfers-dashboard",
+  "version": "1.0.0",
+  "main": "dist/index.js",
+  "license": "MIT",
+  "private": true,
+  "scripts": {
+    "build": "webpack --mode production --progress",
+    "build/dev": "webpack --mode production --watch --progress"
+  },
+  "peerDependencies": {
+    "react": "^16.11.0",
+    "react-dom": "^16.11.0",
+    "lodash": "^4.17.15",
+    "@xfers/xfers-components": "^1.4.2",
+    "@xfers/xfers-js-sdk": "^1.5.4"
+  },
+  "devDependencies": {
+    "css-loader": "^3.2.0",
+    "file-loader": "^4.2.0",
+    "node-sass": "^4.13.0",
+    "sass-loader": "^8.0.0",
+    "style-loader": "^1.0.0",
+    "webpack": "^4.41.2",
+    "webpack-cli": "^3.3.10"
+  },
+  "dependencies": {
+    "camel-case": "^3.0.0",
+    "classnames": "^2.2.6",
+    "clipboard": "^2.0.4",
+    "moment": "^2.24.0",
+    "prismjs": "^1.17.1",
+    "prop-types": "^15.7.2",
+    "react-bootstrap": "^1.0.0-beta.14",
+    "react-datepicker": "^2.10.0",
+    "react-dropzone": "^10.1.10",
+    "react-frame-component": "^4.1.1",
+    "react-ga": "^2.7.0",
+    "react-icons": "^3.8.0",
+    "react-onclickoutside": "^6.9.0",
+    "react-redux": "^7.1.3",
+    "react-table": "^6.10.3",
+    "react-virtualized": "^9.21.2",
+    "redux": "^4.0.4",
+    "redux-thunk": "^2.3.0",
+    "reselect": "^4.0.0",
+    "snake-case": "^2.1.0",
+    "whatwg-fetch": "^3.0.0"
+  }
+}
diff --git a/client_app/packages/xfers-dashboard/src/index.js b/client_app/packages/xfers-dashboard/src/index.js
new file mode 100644
index 000000000..c734b0a9a
--- /dev/null
+++ b/client_app/packages/xfers-dashboard/src/index.js
@@ -0,0 +1,5 @@
+import Dashboard from './legacy/pages/DashboardView'
+
+export {
+  Dashboard
+}
diff --git a/client_app/packages/xfers-dashboard/webpack.config.js b/client_app/packages/xfers-dashboard/webpack.config.js
new file mode 100644
index 000000000..e268e79b0
--- /dev/null
+++ b/client_app/packages/xfers-dashboard/webpack.config.js
@@ -0,0 +1,99 @@
+const path = require('path')
+
+module.exports = {
+  entry: './src/index.js',
+
+  output: {
+    path: path.resolve(__dirname, './dist'),
+    filename: 'index.js',
+    library: '',
+    libraryTarget: 'commonjs'
+  },
+
+  // NOTE needs to list those as peer dependency
+  externals: {
+    react: {
+      commonjs: "react",
+      commonjs2: "react",
+      amd: "React",
+      root: "React"
+    },
+    "react-dom": {
+      commonjs: "react-dom",
+      commonjs2: "react-dom",
+      amd: "ReactDOM",
+      root: "ReactDOM"
+    },
+    "lodash": {
+      commonjs: "lodash",
+      commonjs2: "lodash",
+    },
+    "@xfers/xfers-components": {
+      commonjs: "@xfers/xfers-components",
+      commonjs2: "@xfers/xfers-components",
+    },
+    "@xfers/xfers-js-sdk": {
+      commonjs: "@xfers/xfers-js-sdk",
+      commonjs2: "@xfers/xfers-js-sdk"
+    }
+  },
+
+  cache: true,
+
+  performance: {
+    hints: false,
+  },
+
+  optimization: {
+    minimize: true,
+    removeAvailableModules: true,
+  },
+
+  plugins: [
+  ],
+
+  resolve: {
+    extensions: ['.js'],
+    modules: [
+      'src/legacy/',
+      'src/legacy/pages',
+      'src/legacy/styles',
+      'src/legacy/images',
+      'src/legacy/commons',
+      'node_modules'
+    ]
+  },
+
+  module: {
+    rules: [
+      {
+        test: /\.(js)$/,
+        exclude: /node_modules/,
+        use: {
+          loader: 'babel-loader',
+        },
+      },
+      {
+        test: /\.(png)$/i,
+        use: [
+          {
+            loader: 'file-loader',
+          },
+        ],
+      },
+      {
+        test: /\.(scss|css)$/i,
+        use: [
+          'style-loader',
+          {
+            loader: 'css-loader',
+            options: {
+              modules: true,
+            },
+          },
+          'sass-loader',
+        ],
+      },
+    ],
+  },
+}
diff --git a/package.json b/package.json
index 575d40a07..91a6f4d46 100644
--- a/package.json
+++ b/package.json
@@ -51,11 +51,11 @@
     "prismjs": "^1.15.0",
     "prop-types": "^15.5.10",
     "qs": "^6.6.0",
-    "react": "^16.0.0",
+    "react": "^16.11.0",
     "react-bootstrap": "^0.31.5",
     "react-datepicker": "^2.9.6",
     "react-dimensions": "^1.3.1",
-    "react-dom": "^16.0.0",
+    "react-dom": "^16.11.0",
     "react-dropzone": "^4.2.9",
     "react-frame-component": "^2.0.0",
     "react-ga": "^2.5.2",
@@ -73,7 +73,8 @@
     "redux-thunk": "^2.2.0",
     "reselect": "^3.0.1",
     "snake-case": "^1.1.1",
-    "whatwg-fetch": "^2.0.3"
+    "whatwg-fetch": "^2.0.3",
+    "xfers-dashboard": "link:./client_app/packages/xfers-dashboard"
   },
   "devDependencies": {
     "autoprefixer": "^7.1.5",