NXP-32252: admin-console-nuxeo-server-information

src/app/app.module.ts

@@ -37,6 +37,8 @@ import { AdminSystemInformationModule } from "./features/admin-system-informatio
 import { HyDialogBoxModule, HyDialogModule } from "@hyland/ui";
 import { MatCheckboxModule } from "@angular/material/checkbox";
 import { MatListModule } from "@angular/material/list";
+import { adminHomeReducer } from "../app/features/admin-home/store/reducers";
+import * as AdminEffects from "../app/features/admin-home/store/effects";
 
 @NgModule({
   declarations: [
@@ -59,9 +61,10 @@ import { MatListModule } from "@angular/material/list";
     StoreModule.forRoot({
       router: routerReducer,
       auth: authReducer,
+      admin: adminHomeReducer,
     }),
     StoreRouterConnectingModule.forRoot(),
-    EffectsModule.forRoot(authEffects),
+    EffectsModule.forRoot(authEffects, AdminEffects),
     MatIconModule,
     MatToolbarModule,
     MatButtonModule,

src/app/features/admin-home/components/admin-registration-version/admin-registration-version.component.html

@@ -1,4 +1,15 @@
-<mat-card role="region" aria-label="registration-version">
-    <mat-card-content>Registration and Version Info</mat-card-content>
-    <button mat-flat-button color="primary">Details</button>
-</mat-card>
+<mat-card role="region" aria-label="registration-version" class="registration-version registration-version--mdc">
+  <mat-card-content class="registration-version__content registration-version__content--first">
+    Registration and Version Info
+  </mat-card-content>
+  <ng-container *ngIf="probesInfo$ | async as probesInfo">
+    <p class="registration-version__version">
+      <span class="registration-version__label">Server Version:</span> {{ probesInfo.version }}
+    </p>
+    <p class="registration-version__cluster">
+      <span class="registration-version__label">Cluster Enabled:</span>
+      {{ probesInfo.clusterEnabled }}
+    </p>
+  </ng-container>
+  <button mat-flat-button color="primary" class="registration-version__button">Details</button>
+</mat-card>

src/app/features/admin-home/components/admin-registration-version/admin-registration-version.component.scss

@@ -1,19 +1,40 @@
-mat-card {
+.registration-version {
   height: 100%;
-  button {
-    border-radius: 4px;
-    width: 79px;
-    height: 36px;
-    position: absolute;
-    bottom: 8%;
-    right: 4%;
-  }
-}
-mat-card.mat-mdc-card:not([class*="mat-elevation-z"]) {
+}
+
+.registration-version__button {
+  border-radius: 4px;
+  width: 79px;
+  height: 36px;
+  position: absolute;
+  bottom: 8%;
+  right: 4%;
+}
+
+.registration-version--mdc {
   box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.14), 0px 3px 4px rgba(0, 0, 0, 0.12),
     0px 1px 5px rgba(0, 0, 0, 0.2);
   border-radius: 4px;
 }
-.mat-mdc-card-content:first-child {
+
+.registration-version__content {
+  display: block;
+  padding: 0 0 !important;
+}
+
+.registration-version__content--first {
   padding-top: 0;
 }
+
+.registration-version__cluster {
+  margin-top: 6px;
+}
+
+.registration-version__version {
+  margin-top: 10px;
+}
+
+.registration-version__label {
+  font-weight: bold;
+  margin-right: 10px;
+}

src/app/features/admin-home/components/admin-registration-version/admin-registration-version.component.ts

@@ -1,8 +1,31 @@
-import { Component } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
+import { Store, select } from "@ngrx/store";
+import { Observable } from "rxjs";
+import { AdminHomeService } from "../../services/admin-home-service";
+import * as AdminHomeActions from "../../store/actions";
+import { AdminState } from "../../store/reducers";
+import { probesInfo } from "../../../../shared/types/probes-info.interface";
 
 @Component({
   selector: "admin-registration-version",
   templateUrl: "./admin-registration-version.component.html",
   styleUrls: ["./admin-registration-version.component.scss"],
 })
-export class AdminRegistrationVersionComponent {}
+export class AdminRegistrationVersionComponent implements OnInit {
+  probesInfo$: Observable<probesInfo>;
+  error$: Observable<any>;
+
+  constructor(
+    private store: Store<{ admin: AdminState }>,
+    private adminHomeService: AdminHomeService
+  ) {
+    this.probesInfo$ = this.store.pipe(
+      select((state) => state.admin?.probesInfo)
+    );
+    this.error$ = this.store.pipe(select((state) => state.admin?.error));
+  }
+
+  ngOnInit(): void {
+    this.store.dispatch(AdminHomeActions.fetchProbesInfo());
+  }
+}

src/app/features/admin-home/services/admin-home-service.ts

@@ -0,0 +1,18 @@
+import { Injectable } from "@angular/core";
+import { HttpClient } from "@angular/common/http";
+import { Observable } from "rxjs";
+import { environment } from "../../../../environments/environment";
+import { probesInfo } from "../../../shared/types/probes-info.interface";
+
+@Injectable({
+  providedIn: "root",
+})
+export class AdminHomeService {
+  private readonly jsonFilePath = environment.apiUrl + "/version-info.json";
+
+  constructor(private http: HttpClient) {}
+
+  getProbesInfo(): Observable<probesInfo> {
+    return this.http.get<probesInfo>(this.jsonFilePath);
+  }
+}

src/app/features/admin-home/store/actions.ts

@@ -0,0 +1,12 @@
+import { createAction, props } from "@ngrx/store";
+import { probesInfo } from "../../../shared/types/probes-info.interface";
+
+export const fetchProbesInfo = createAction("[Admin] Fetch Version Info");
+export const fetchProbesInfoSuccess = createAction(
+  "[Admin] Fetch Probes Info Success",
+  props<{ probesInfo: probesInfo }>()
+);
+export const fetchProbesInfoFailure = createAction(
+  "[Admin] Fetch Probes Info Failure",
+  props<{ error: any }>()
+);

src/app/features/admin-home/store/effects.ts

@@ -0,0 +1,30 @@
+import { HttpErrorResponse } from "@angular/common/http";
+import { inject } from "@angular/core";
+import { Actions, createEffect, ofType } from "@ngrx/effects";
+import { catchError, map, of, switchMap } from "rxjs";
+import { AdminHomeService } from "../services/admin-home-service";
+import * as AdminHomeActions from "../store/actions";
+
+export const loadVersionInfoEffect = createEffect(
+  (actions$ = inject(Actions), adminHomeService = inject(AdminHomeService)) => {
+    return actions$.pipe(
+      ofType(AdminHomeActions.fetchProbesInfo),
+      switchMap(() => {
+        return adminHomeService.getProbesInfo().pipe(
+          map((data) => {
+            return AdminHomeActions.fetchProbesInfoSuccess({
+              probesInfo: {
+                version: data?.version,
+                clusterEnabled: data?.clusterEnabled,
+              },
+            });
+          }),
+          catchError((error: HttpErrorResponse) => {
+            return of(AdminHomeActions.fetchProbesInfoFailure({ error }));
+          })
+        );
+      })
+    );
+  },
+  { functional: true }
+);

src/app/features/admin-home/store/reducers.ts

@@ -0,0 +1,37 @@
+import { createReducer, on } from "@ngrx/store";
+import * as AdminHomeActions from "./actions";
+
+export interface AdminState {
+  probesInfo: {
+    version: string | null;
+    clusterEnabled: boolean | null;
+  };
+  error: any;
+}
+
+export const initialState: AdminState = {
+  probesInfo: {
+    version: null,
+    clusterEnabled: null,
+  },
+  error: null,
+};
+
+export const adminHomeReducer = createReducer(
+  initialState,
+  on(AdminHomeActions.fetchProbesInfo, (state) => ({
+    ...state,
+    error: null,
+  })),
+  on(AdminHomeActions.fetchProbesInfoSuccess, (state, { probesInfo }) => ({
+    ...state,
+    probesInfo: {
+      version: probesInfo?.version,
+      clusterEnabled: probesInfo?.clusterEnabled,
+    },
+  })),
+  on(AdminHomeActions.fetchProbesInfoFailure, (state, { error }) => ({
+    ...state,
+    error,
+  }))
+);

src/app/shared/types/probes-info.interface.ts

@@ -0,0 +1,4 @@
+export interface probesInfo {
+  version: string | null;
+  clusterEnabled: boolean | null;
+}

src/assets/version-info.json

@@ -0,0 +1,4 @@
+{
+  "version": "Nuxeo Platform 2021.45.8",
+  "clusterEnabled": true
+}