display version

Author: 0la0

package.json

@@ -1,6 +1,6 @@
 {
   "name": "PhaseScript",
-  "version": "0.0.1",
+  "version": "0.1.0",
   "description": "",
   "main": "dist/index.js",
   "scripts": {

src/app/components/settings-editor/index.js

@@ -1,5 +1,6 @@
 import BaseComponent from 'common/util/base-component';
 import dataStore from 'services/Store';
+import version from 'common/util/version';
 import style from './settings-editor.css';
 import markup from './settings-editor.html';
 
@@ -9,8 +10,9 @@ export default class SettingsEditor extends BaseComponent {
   }
 
   constructor(closeCallback) {
-    super(style, markup, []);
+    super(style, markup, [ 'version', ]);
     this.handleClose = closeCallback;
+    this.dom.version.innerText = version;
   }
 
   handleFontSizeChange(event) {

src/app/components/settings-editor/settings-editor.css

@@ -23,3 +23,10 @@
   justify-content: flex-start;
   padding: 8px;
 }
+
+.version {
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  padding: 8px;
+}

src/app/components/settings-editor/settings-editor.html

@@ -19,3 +19,8 @@
   >
   </text-input>
 </div>
+
+<p class="version">
+  <span>Version</span>
+  <span id="version"></span>
+</p>

src/app/components/sound-root/sound-root.css

@@ -30,7 +30,7 @@
   background-color: var(--color-black-light);
   border: var(--border-default);
   width: 400px;
-  height: calc(100% - var(--topbar-height));
+  height: calc(100% - var(--topbar-height) - 2px);
   transform: translateX(-100%);
   transition: transform 0.15s ease-out;
 }

src/common/util/Version.js

@@ -0,0 +1,3 @@
+// eslint-disable-next-line no-undef
+const version = VERSION;
+export default version;

webpack.config.js

@@ -1,5 +1,8 @@
 const webpack = require('webpack');
 const path = require('path');
+const packageJson = require('./package.json');
+
+const { version } = packageJson;
 
 const webpackConfig = {
   context: path.resolve(__dirname, 'src'),
@@ -35,6 +38,9 @@ const webpackConfig = {
     port: 3001
   },
   mode: process.env.WEBPACK_SERVE ? 'development' : 'production',
+  plugins: [
+    new webpack.DefinePlugin({ VERSION: JSON.stringify(version) })
+  ]
 };
 
 module.exports = webpackConfig;