Add storybooks and refactor UI

Makefile

@@ -56,7 +56,7 @@ endif
 .PHONY: npm
 npm:
 	# Run the NPM commands from the UI folder.
-	cd ${GOPATH}/src/app/ui && npm run $(ARGS)
+	cd ${GOPATH}/src/app/ui && npm $(ARGS)
 
 .PHONY: api-dep
 api-dep:

docs/docs/tutorial/env-prep.md

@@ -18,7 +18,7 @@ You should install [NodeJS and npm](https://nodejs.org/).
 These are the current versions on the front-end components:
 
 - Mithril [v2.0.4](https://github.com/MithrilJS/mithril.js/releases/tag/v2.0.4) - [docs](https://mithril.js.org/)
-- Bulma [v0.8.1](https://www.npmjs.com/package/bulma/v/0.8.1) - [docs](https://bulma.io/documentation/)
+- Bulma [v0.8.2](https://www.npmjs.com/package/bulma/v/0.8.2) - [docs](https://bulma.io/documentation/)
 
 ## Visual Studio Code (VSCode) Setup
 

src/app/api/cmd/api/main.go

@@ -23,8 +23,9 @@ func main() {
 	config.LoadRoutes(core)
 
 	// Start the web server.
-	l.Printf("Server started.")
-	err := http.ListenAndServe(fmt.Sprintf(":%v", settings.Port), config.Middleware(core))
+	socket := fmt.Sprintf(":%v", settings.Port)
+	l.Printf("Server started on %v", socket)
+	err := http.ListenAndServe(socket, config.Middleware(core))
 	if err != nil {
 		l.Printf(err.Error())
 	}

src/app/ui/.storybook/main.js

@@ -1,3 +1,6 @@
+const path = require('path');
+const rootWebpack = require('../webpack.config.js');
+
 module.exports = {
     stories: ['../src/**/*.stories.js'],
     addons: [
@@ -6,4 +9,26 @@ module.exports = {
         '@storybook/addon-knobs/register',
         '@storybook/addon-a11y/register',
     ],
+    webpackFinal: (config) => {
+        return {
+            ...config,
+            plugins: [
+                ...config.plugins,
+                ...rootWebpack.plugins,
+            ],
+            resolve: {
+                alias: {
+                    ...config.resolve.alias,
+                    ...rootWebpack.resolve.alias,
+                },
+            },
+            module: {
+                ...config.module,
+                rules: [
+                    ...config.module.rules,
+                    ...rootWebpack.module.rules,
+                ]
+            }
+        };
+    },
 };

src/app/ui/jsconfig.json

@@ -0,0 +1,23 @@
+{
+    "compilerOptions": {
+        "target": "es5",
+        "allowSyntheticDefaultImports": true,
+        "esModuleInterop": true,
+        "baseUrl": "./",
+        "checkJs": false,
+        "paths": {
+            "@/*": [
+                "src/*"
+            ],
+            "~/*": [
+                "*"
+            ],
+        },
+    },
+    "include": [
+        "src/**/*",
+        ".storybook/**/*",
+        "test/**/*",
+        "node_modules/cypress/**/*",
+    ]
+}