From b839ba7870c2872607ebf3ae41a8c08f17a7dde7 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 11 Dec 2018 18:45:25 +0300
Subject: [PATCH] Quality of Frontend Developer's Life: here to stay

---
 README.md                  |  9 +++++++++
 build/webpack.dev.conf.js  |  4 +++-
 build/webpack.prod.conf.js | 12 +++++++++---
 config/index.js            | 19 +++++++++++++++----
 src/boot/after_store.js    | 11 ++++++++++-
 src/main.js                |  6 ++++++
 6 files changed, 52 insertions(+), 9 deletions(-)

diff --git a/README.md b/README.md
index b6e5a586..181b6a0d 100644
--- a/README.md
+++ b/README.md
@@ -29,6 +29,15 @@ npm run build
 npm run unit
 ```
 
+# For Contributors:
+
+You can create file `/config/local.json` (see [example](https://git.pleroma.social/pleroma/pleroma-fe/blob/develop/config/local.example.json)) to enable some convenience dev options:
+
+* `target`: makes local dev server redirect to some existing instance's BE instead of local BE, useful for testing things in near-production environment and searching for real-life use-cases.
+* `staticConfigPreference`: makes FE's `/static/config.json` take preference of BE-served `/api/statusnet/config.json`. Only works in dev mode.
+
+FE Build process also leaves current commit hash in global variable `___pleromafe_commit_hash` so that you can easily see which pleroma-fe commit instance is running, also helps pinpointing which commit was used when FE was bundled into BE.
+
 # Configuration
 
 Edit config.json for configuration. scopeOptionsEnabled gives you input fields for CWs and the scope settings.
diff --git a/build/webpack.dev.conf.js b/build/webpack.dev.conf.js
index 7e1a104f..9f34619c 100644
--- a/build/webpack.dev.conf.js
+++ b/build/webpack.dev.conf.js
@@ -18,7 +18,9 @@ module.exports = merge(baseWebpackConfig, {
   devtool: '#eval-source-map',
   plugins: [
     new webpack.DefinePlugin({
-      'process.env': config.dev.env
+      'process.env': config.dev.env,
+      'COMMIT_HASH': JSON.stringify('DEV'),
+      'DEV_OVERRIDES': JSON.stringify(config.dev.settings)
     }),
     // https://github.com/glenjamin/webpack-hot-middleware#installation--usage
     new webpack.optimize.OccurenceOrderPlugin(),
diff --git a/build/webpack.prod.conf.js b/build/webpack.prod.conf.js
index 6119f700..b2c87e6c 100644
--- a/build/webpack.prod.conf.js
+++ b/build/webpack.prod.conf.js
@@ -7,8 +7,13 @@ var baseWebpackConfig = require('./webpack.base.conf')
 var ExtractTextPlugin = require('extract-text-webpack-plugin')
 var HtmlWebpackPlugin = require('html-webpack-plugin')
 var env = process.env.NODE_ENV === 'testing'
-  ? require('../config/test.env')
-  : config.build.env
+    ? require('../config/test.env')
+    : config.build.env
+
+let commitHash = require('child_process')
+    .execSync('git rev-parse --short HEAD')
+    .toString();
+console.log(commitHash)
 
 var webpackConfig = merge(baseWebpackConfig, {
   module: {
@@ -29,7 +34,8 @@ var webpackConfig = merge(baseWebpackConfig, {
   plugins: [
     // http://vuejs.github.io/vue-loader/workflow/production.html
     new webpack.DefinePlugin({
-      'process.env': env
+      'process.env': env,
+      'COMMIT_HASH': JSON.stringify(commitHash)
     }),
     new webpack.optimize.UglifyJsPlugin({
       compress: {
diff --git a/config/index.js b/config/index.js
index 7b0ef26c..56fa5940 100644
--- a/config/index.js
+++ b/config/index.js
@@ -1,5 +1,15 @@
 // see http://vuejs-templates.github.io/webpack for documentation.
-var path = require('path')
+const path = require('path')
+let settings = {}
+try {
+  settings = require('./local.json')
+  console.log('Using local dev server settings (/config/local.json):')
+  console.log(JSON.stringify(settings, null, 2))
+} catch (e) {
+  console.log('Local dev server settings not found (/config/local.json)')
+}
+
+const target = settings.target || 'http://localhost:4000/'
 
 module.exports = {
   build: {
@@ -19,21 +29,22 @@ module.exports = {
   dev: {
     env: require('./dev.env'),
     port: 8080,
+    settings,
     assetsSubDirectory: 'static',
     assetsPublicPath: '/',
     proxyTable: {
       '/api': {
-        target: 'http://localhost:4000/',
+        target,
         changeOrigin: true,
         cookieDomainRewrite: 'localhost'
       },
       '/nodeinfo': {
-        target: 'http://localhost:4000/',
+        target,
         changeOrigin: true,
         cookieDomainRewrite: 'localhost'
       },
       '/socket': {
-        target: 'http://localhost:4000/',
+        target,
         changeOrigin: true,
         cookieDomainRewrite: 'localhost',
         ws: true
diff --git a/src/boot/after_store.js b/src/boot/after_store.js
index a80baaf5..9ce2d7ed 100644
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@@ -38,8 +38,17 @@ const afterStoreSetup = ({store, i18n}) => {
           return {}
         })
         .then((staticConfig) => {
+          const overrides = window.___pleromafe_dev_overrides || {}
+          const env = window.___pleromafe_mode.NODE_ENV
+
           // This takes static config and overrides properties that are present in apiConfig
-          var config = Object.assign({}, staticConfig, apiConfig)
+          let config = {}
+          if (overrides.staticConfigPreference && env === 'DEV') {
+            console.warn('OVERRIDING API CONFIG WITH STATIC CONFIG')
+            config = Object.assign({}, apiConfig, staticConfig)
+          } else {
+            config = Object.assign({}, staticConfig, apiConfig)
+          }
 
           var theme = (config.theme)
           var background = (config.background)
diff --git a/src/main.js b/src/main.js
index 378fe95c..7f3746c8 100644
--- a/src/main.js
+++ b/src/main.js
@@ -69,3 +69,9 @@ createPersistedState(persistedStateOptions).then((persistedState) => {
 
   afterStoreSetup({store, i18n})
 })
+
+// These are inlined by webpack's DefinePlugin
+/* eslint-disable */
+window.___pleromafe_mode = process.env
+window.___pleromafe_commit_hash = COMMIT_HASH
+window.___pleromafe_dev_overrides = DEV_OVERRIDES