feat: display version number on settings page #170

src/app/pages/config-page/config-page.component.html

@@ -42,3 +42,7 @@
     </div>
   </div>
 </div>
+
+<footer class="version-footer">
+  Super Productivity {{appVersion}}
+</footer>

src/app/pages/config-page/config-page.component.scss

@@ -14,9 +14,6 @@
       background-color: $dark-theme-bg-lighter;
     }
 
-    //@include darkTheme {
-    //  background-color: $dark-theme-bg-lighter;
-    //}
     .md-title {
       margin-top: 0;
     }
@@ -52,18 +49,12 @@
     .keyboard-settings {
       display: none;
     }
-
-    //.md-button,
-    //button {
-    //  &:not(.md-icon-button) {
-    //    width: 100%;
-    //    max-width: 100%;
-    //    overflow: hidden;
-    //    text-overflow: ellipsis;
-    //    margin-left: 0;
-    //    margin-right: 0;
-    //  }
-    //}
   }
 }
 
+.version-footer {
+  margin-top: auto;
+  text-align: center;
+  font-style: italic;
+  padding: $s*3;
+}

src/app/pages/config-page/config-page.component.ts

@@ -15,6 +15,7 @@ import { DEFAULT_JIRA_CFG } from '../../features/issue/jira/jira.const';
 import { DEFAULT_GITHUB_CFG } from '../../features/issue/github/github.const';
 import { dirtyDeepCopy } from '../../util/dirtyDeepCopy';
 import { IS_ELECTRON } from '../../app.constants';
+import { environment } from '../../../environments/environment';
 
 @Component({
   selector: 'config-page',
@@ -33,6 +34,8 @@ export class ConfigPageComponent implements OnInit, OnDestroy {
   issueIntegrationCfgs: IssueIntegrationCfgs;
   globalCfg: GlobalConfig;
 
+  appVersion: string = environment.version;
+
   private _subs = new Subscription();
 
   constructor(

src/environments/environment.prod.ts

@@ -1,3 +1,5 @@
+import { version } from '../../package.json';
 export const environment = {
-  production: true
+  production: true,
+  version,
 };

src/environments/environment.ts

@@ -1,9 +1,11 @@
 // This file can be replaced during build by using the `fileReplacements` array.
 // `ng build ---prod` replaces `environment.ts` with `environment.prod.ts`.
 // The list of file replacements can be found in `angular.json`.
+import { version } from '../../package.json';
 
 export const environment = {
-  production: false
+  production: false,
+  version,
 };
 
 /*

tsconfig.json

@@ -10,6 +10,7 @@
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
     "target": "es5",
+    "resolveJsonModule": true,
     "typeRoots": [
       "node_modules/@types"
     ],