feat: show firmware version of the device/modules on firmware page (#589)

packages/uhk-web/src/app/components/device/firmware/device-firmware.component.html

@@ -7,12 +7,19 @@
                 <span>Firmware</span>
             </h1>
 
-            <p><i>
-                Please note that the firmware update process may sometimes fail. If if fails then
-                simply retry until it succeeds. If the left half becomes unresponsive after a failed
-                update then retry and follow the instructions displayed during the update to fix it.
-                We'll make the firmware update process more robust.
-            </i></p>
+            <p>
+                Firmware {{ hardwareModules.leftModuleInfo.firmwareVersion }} is running on the left keyboard half.<br>
+                Firmware {{ hardwareModules.rightModuleInfo.firmwareVersion }} is running on the right keyboard half.
+            </p>
+
+            <p>
+                <i>
+                    Please note that the firmware update process may sometimes fail. If if fails then
+                    simply retry until it succeeds. If the left half becomes unresponsive after a failed
+                    update then retry and follow the instructions displayed during the update to fix it.
+                    We'll make the firmware update process more robust.
+                </i>
+            </p>
 
             <p>
                 <button class="btn btn-primary"

packages/uhk-web/src/app/components/device/firmware/device-firmware.component.ts

@@ -2,9 +2,16 @@ import { Component, ElementRef, OnDestroy, ViewChild } from '@angular/core';
 import { Store } from '@ngrx/store';
 import { Observable } from 'rxjs/Observable';
 import { Subscription } from 'rxjs/Subscription';
-import { VersionInformation } from 'uhk-common';
+import { HardwareModules, VersionInformation } from 'uhk-common';
 
-import { AppState, firmwareOkButtonDisabled, flashFirmwareButtonDisbabled, getAgentVersionInfo, xtermLog } from '../../../store';
+import {
+    AppState,
+    firmwareOkButtonDisabled,
+    flashFirmwareButtonDisbabled,
+    getAgentVersionInfo,
+    getHardwareModules,
+    xtermLog
+} from '../../../store';
 import { UpdateFirmwareAction, UpdateFirmwareOkButtonAction, UpdateFirmwareWithAction } from '../../../store/actions/device';
 import { XtermLog } from '../../../models/xterm-log';
 
@@ -22,6 +29,8 @@ export class DeviceFirmwareComponent implements OnDestroy {
     xtermLogSubscription: Subscription;
     getAgentVersionInfo$: Observable<VersionInformation>;
     firmwareOkButtonDisabled$: Observable<boolean>;
+    hardwareModulesSubscription: Subscription;
+    hardwareModules: HardwareModules;
 
     @ViewChild('scrollMe') divElement: ElementRef;
 
@@ -37,10 +46,14 @@ export class DeviceFirmwareComponent implements OnDestroy {
         });
         this.getAgentVersionInfo$ = store.select(getAgentVersionInfo);
         this.firmwareOkButtonDisabled$ = store.select(firmwareOkButtonDisabled);
+        this.hardwareModulesSubscription = store.select(getHardwareModules).subscribe(data => {
+            this.hardwareModules = data;
+        });
     }
 
     ngOnDestroy(): void {
         this.xtermLogSubscription.unsubscribe();
+        this.hardwareModulesSubscription.unsubscribe();
     }
 
     onUpdateFirmware(): void {

packages/uhk-web/src/app/store/actions/device.ts

@@ -1,5 +1,6 @@
 import { Action } from '@ngrx/store';
 import { DeviceConnectionState, IpcResponse, type } from 'uhk-common';
+import { HardwareModules } from '../../../../../uhk-common/src/models';
 
 const PREFIX = '[device] ';
 
@@ -22,7 +23,8 @@ export const ActionTypes = {
     UPDATE_FIRMWARE_REPLY: type(PREFIX + 'update firmware reply'),
     UPDATE_FIRMWARE_SUCCESS: type(PREFIX + 'update firmware success'),
     UPDATE_FIRMWARE_FAILED: type(PREFIX + 'update firmware failed'),
-    UPDATE_FIRMWARE_OK_BUTTON: type(PREFIX + 'update firmware ok button click')
+    UPDATE_FIRMWARE_OK_BUTTON: type(PREFIX + 'update firmware ok button click'),
+    MODULES_INFO_LOADED: type(PREFIX + 'module info loaded')
 };
 
 export class SetPrivilegeOnLinuxAction implements Action {
@@ -114,6 +116,13 @@ export class ResetMouseSpeedSettingsAction implements Action {
     type = ActionTypes.RESET_MOUSE_SPEED_SETTINGS;
 }
 
+export class HardwareModulesLoadedAction implements Action {
+    type = ActionTypes.MODULES_INFO_LOADED;
+
+    constructor(public payload: HardwareModules) {
+    }
+}
+
 export type Actions
     = SetPrivilegeOnLinuxAction
     | SetPrivilegeOnLinuxReplyAction
@@ -132,4 +141,5 @@ export type Actions
     | UpdateFirmwareSuccessAction
     | UpdateFirmwareFailedAction
     | UpdateFirmwareOkButtonAction
+    | HardwareModulesLoadedAction
     ;

packages/uhk-web/src/app/store/effects/user-config.ts

@@ -43,7 +43,7 @@ import {
     ShowNotificationAction,
     UndoLastAction
 } from '../actions/app';
-import { ShowSaveToKeyboardButtonAction } from '../actions/device';
+import { HardwareModulesLoadedAction, ShowSaveToKeyboardButtonAction } from '../actions/device';
 import { DeviceRendererService } from '../../services/device-renderer.service';
 import { UndoUserConfigData } from '../../models/undo-user-config-data';
 import { UploadFileData } from '../../models/upload-file-data';
@@ -173,6 +173,8 @@ export class UserConfigEffects {
                     }));
             }
 
+            result.push(new HardwareModulesLoadedAction(data.modules));
+
             this.router.navigate(['/']);
 
             return result;

packages/uhk-web/src/app/store/index.ts

@@ -77,3 +77,4 @@ export const xtermLog = createSelector(deviceState, fromDevice.xtermLog);
 export const firmwareOkButtonDisabled = createSelector(deviceState, fromDevice.firmwareOkButtonDisabled);
 // tslint:disable-next-line: max-line-length
 export const flashFirmwareButtonDisbabled = createSelector(runningInElectron, deviceState, (electron, state: fromDevice.State) => !electron || state.updatingFirmware);
+export const getHardwareModules = createSelector(deviceState, fromDevice.getHardwareModules);

packages/uhk-web/src/app/store/reducers/device.ts

@@ -1,8 +1,10 @@
 import { Action } from '@ngrx/store';
+import { HardwareModules } from 'uhk-common';
 
 import {
     ActionTypes,
     ConnectionStateChangedAction,
+    HardwareModulesLoadedAction,
     SaveConfigurationAction,
     UpdateFirmwareFailedAction
 } from '../actions/device';
@@ -16,6 +18,7 @@ export interface State {
     saveToKeyboard: ProgressButtonState;
     updatingFirmware: boolean;
     firmwareUpdateFinished: boolean;
+    modules: HardwareModules;
     log: Array<XtermLog>;
 }
 
@@ -25,6 +28,15 @@ export const initialState: State = {
     saveToKeyboard: initProgressButtonState,
     updatingFirmware: false,
     firmwareUpdateFinished: false,
+    modules: {
+        leftModuleInfo: {
+            firmwareVersion: '',
+            moduleProtocolVersion: ''
+        },
+        rightModuleInfo: {
+            firmwareVersion: ''
+        }
+    },
     log: [{message: '', cssClass: XtermCssClass.standard}]
 };
 
@@ -148,6 +160,13 @@ export function reducer(state = initialState, action: Action) {
                 log: [...state.log, logEntry]
             };
         }
+
+        case ActionTypes.MODULES_INFO_LOADED:
+            return {
+                ...state,
+                modules: (action as HardwareModulesLoadedAction).payload
+            };
+
         default:
             return state;
     }
@@ -159,3 +178,4 @@ export const hasDevicePermission = (state: State) => state.hasPermission;
 export const getSaveToKeyboardState = (state: State) => state.saveToKeyboard;
 export const xtermLog = (state: State) => state.log;
 export const firmwareOkButtonDisabled = (state: State) => !state.firmwareUpdateFinished;
+export const getHardwareModules = (state: State) => state.modules;