Display Fineract version and build (#1848)

Co-authored-by: Jose Alberto Hernandez <alberto@blue-daemon.local>

src/app/shared/footer/footer.component.html

@@ -1,11 +1,25 @@
 <div fxLayout="column" id="footer" class="m-b-20">
   <mat-divider fxFlexAlign="center" class="divider"></mat-divider>
-  <p fxFlexAlign="center" class="footer-content">Mifos <b>{{ versions.mifos }}</b> - <b>{{
-      hash }}</b></p>
-  <p *ngIf="versions.fineract" fxFlexAlign="center" class="footer-content">Fineract <b>{{ versions.fineract.version }}</b></p>
-  <p fxFlexAlign="center" class="footer-content" *ngIf="isBusinessDateDefined">Current Business Date: <b>{{ businessDate
-      | date: 'EEEE, MMMM dd, y' }}</b></p>
-  <p fxFlexAlign="center" class="footer-content" *ngIf="displayBackEndInfo"><b>{{ server }}</b></p>
+  <div fxLayout="column" class="m-b-20 content">
+
+  <table>
+    <tr>
+      <td class="footer-content">Mifos</td>
+      <td class="right footer-content"><b>{{ versions.mifos }}</b> - <b>{{ hash }}</b></td>
+    </tr>
+    <tr>
+      <td class="footer-content">Fineract</td>
+      <td class="right footer-content"><b>{{ versions.fineract.version[0] }}</b> - <b>{{ versions.fineract.version[1] }}</b></td>
+    </tr>
+    <tr *ngIf="isBusinessDateDefined">
+      <td class="footer-content">Current Business Date:</td>
+      <td class="center footer-content"><b>{{ businessDate | date: 'EEEE, MMMM dd, y' }}</b></td>
+    </tr>
+    <tr *ngIf="displayBackEndInfo">
+      <td colspan="2" class="center footer-content"><b>{{ server }}</b></td>
+    </tr>
+  </table>
+  </div>
   <mat-divider fxFlexAlign="center" class="divider"></mat-divider>
   <p fxFlexAlign="center" class="footer-content">{{ 'APP_NAME' | translate }} {{ 'labels.texts.by' | translate }} Mifos
   </p>

src/app/shared/footer/footer.component.scss

@@ -1,10 +1,25 @@
 #footer {
+  align-items: center;
+
+  .content {
+    max-width: 30%;
+
+    .footer-content {
+      margin: 0;
+    }
+  }
+
   .divider {
     margin: 2.5rem 1rem 0.5rem;
     width: 4rem;
   }
 
-  .footer-content {
-    margin: 0;
+  table {
+    border: none;
+
+    tr:nth-child(even) {
+      background-color: transparent;
+    }
   }
+
 }

src/app/shared/footer/footer.component.ts

@@ -67,10 +67,10 @@ export class FooterComponent implements OnInit, OnDestroy {
     this.getConfigurations();
     this.server = this.settingsService.server;
     this.versionService.getBackendInfo().subscribe((data: any) => {
-      const regExp = /0.0.0/gi;
+      const buildVersion: string = data.git.build.version;
       this.versions.fineract = {
-        version: data.git.build.replace(regExp, data.git.closest.tag.name)
-      }
+        version: buildVersion.split('-')
+      };
     });
   }
 
@@ -92,6 +92,8 @@ export class FooterComponent implements OnInit, OnDestroy {
           this.timer = setTimeout(() => { this.getConfigurations(); }, 60000);
         }
       });
+    } else {
+      clearTimeout(this.timer);
     }
   }