Version Info

bizmatch/package.json

@@ -4,8 +4,9 @@
   "scripts": {
     "ng": "ng",
     "start": "ng serve & http-server ../bizmatch-server",
-    "build": "ng build",
-    "build.dev": "ng build --configuration dev",
+    "prebuild": "node version.js",
+    "build": "node version.js && ng build",
+    "build.dev": "node version.js && ng build --configuration dev",
     "watch": "ng build --watch --configuration development",
     "test": "ng test",
     "serve:ssr:bizmatch": "node dist/bizmatch/server/server.mjs"
@@ -33,6 +34,7 @@
     "angular-mixed-cdk-drag-drop": "^2.2.3",
     "browser-bunyan": "^1.8.0",
     "cropperjs": "^1.6.1",
+    "dayjs": "^1.11.11",
     "express": "^4.18.2",
     "jwt-decode": "^4.0.0",
     "keycloak-js": "^23.0.7",
@@ -64,4 +66,4 @@
     "karma-jasmine-html-reporter": "~2.1.0",
     "typescript": "~5.3.3"
   }
-}
+}

bizmatch/src/app/app.component.html

@@ -6,18 +6,26 @@
     <router-outlet></router-outlet>
   </div>
   <footer></footer>
+  <p-confirmDialog #cd>
+    <ng-template pTemplate="headless" let-message>
+      <div class="flex flex-column align-items-center p-5 surface-overlay border-round">
+        <span class="font-bold text-2xl block mb-2 mt-4">
+          {{ message.header }}
+        </span>
+        <p class="mb-0">{{ message.message }}</p>
+        <div class="flex align-items-center gap-2 mt-4">
+          <button pButton label="OK" (click)="cd.accept()" size="small"></button>
+        </div>
+      </div>
+    </ng-template>
+  </p-confirmDialog>
 </div>
-<!-- @if (loadingService.isLoading$ | async) { -->
-<!-- <div class="progress-spinner flex h-full align-items-center justify-content-center">
-  <div class="spinner-text">Please wait - we're processing your image...</div>
-  <p-progressSpinner></p-progressSpinner>
-</div> -->
-<!-- } -->
-@if (loadingService.isLoading$ | async) { 
+
+@if (loadingService.isLoading$ | async) {
 <div class="spinner-overlay">
   <div class="spinner-container">
     <p-progressSpinner></p-progressSpinner>
-    <div class="spinner-text" *ngIf="loadingService.loadingText$ | async as loadingText">{{loadingText}}</div>
+    <div class="spinner-text" *ngIf="loadingService.loadingText$ | async as loadingText">{{ loadingText }}</div>
   </div>
 </div>
-}
+}

bizmatch/src/app/app.component.ts

@@ -1,31 +1,42 @@
 import { CommonModule } from '@angular/common';
-import { Component } from '@angular/core';
+import { Component, HostListener } from '@angular/core';
 import { ActivatedRoute, NavigationEnd, Router, RouterOutlet } from '@angular/router';
 import onChange from 'on-change';
+import { ConfirmationService } from 'primeng/api';
+import { ConfirmDialogModule } from 'primeng/confirmdialog';
 import { ProgressSpinnerModule } from 'primeng/progressspinner';
 import { filter } from 'rxjs/operators';
 import { ListingCriteria } from '../../../bizmatch-server/src/models/main.model';
+import build from '../build';
 import { FooterComponent } from './components/footer/footer.component';
 import { HeaderComponent } from './components/header/header.component';
 import { KeycloakService } from './services/keycloak.service';
 import { LoadingService } from './services/loading.service';
 import { UserService } from './services/user.service';
 import { createDefaultListingCriteria } from './utils/utils';
-
 @Component({
   selector: 'app-root',
   standalone: true,
-  imports: [CommonModule, RouterOutlet, HeaderComponent, ProgressSpinnerModule, FooterComponent],
+  imports: [CommonModule, RouterOutlet, HeaderComponent, ProgressSpinnerModule, FooterComponent, ConfirmDialogModule],
+  providers: [ConfirmationService],
   templateUrl: './app.component.html',
   styleUrl: './app.component.scss',
 })
 export class AppComponent {
+  build = build;
   title = 'bizmatch';
   actualRoute = '';
   listingCriteria: ListingCriteria = onChange(createDefaultListingCriteria(), (path, value, previousValue, applyData) => {
     sessionStorage.setItem('criteria', JSON.stringify(value));
   });
-  public constructor(public loadingService: LoadingService, private router: Router, private activatedRoute: ActivatedRoute, private keycloakService: KeycloakService, private userService: UserService) {
+  public constructor(
+    public loadingService: LoadingService,
+    private router: Router,
+    private activatedRoute: ActivatedRoute,
+    private keycloakService: KeycloakService,
+    private userService: UserService,
+    private confirmationService: ConfirmationService,
+  ) {
     this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe(() => {
       let currentRoute = this.activatedRoute.root;
       while (currentRoute.children[0] !== undefined) {
@@ -36,4 +47,21 @@ export class AppComponent {
     });
   }
   ngOnInit() {}
+  @HostListener('window:keydown', ['$event'])
+  handleKeyboardEvent(event: KeyboardEvent) {
+    if (event.shiftKey && event.ctrlKey && event.key === 'V') {
+      this.showVersionDialog();
+    }
+  }
+
+  showVersionDialog() {
+    this.confirmationService.confirm({
+      target: event.target as EventTarget,
+      message: `App Version: ${this.build.timestamp}`,
+      header: 'Version Info',
+      icon: 'pi pi-info-circle',
+      accept: () => {},
+      reject: () => {},
+    });
+  }
 }