Skip to content

Commit 1ae17f9

Browse files
author
YousufFFFF
committed
Add About dialog and move release details from footer
1 parent e34cc9a commit 1ae17f9

7 files changed

Lines changed: 239 additions & 2 deletions

File tree

src/app/core/shell/toolbar/toolbar.component.html

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -234,6 +234,12 @@
234234
</mat-icon>
235235
<span>{{ 'labels.menus.Settings' | translate }}</span>
236236
</button>
237+
<button mat-menu-item (click)="openAboutDialog()" tabindex="0">
238+
<mat-icon>
239+
<fa-icon icon="info-circle" size="sm"></fa-icon>
240+
</mat-icon>
241+
<span>{{ 'labels.menus.About' | translate }}</span>
242+
</button>
237243
<button mat-menu-item (click)="logout()" id="logout" tabindex="0">
238244
<mat-icon>
239245
<fa-icon icon="sign-out-alt" size="sm"></fa-icon>

src/app/core/shell/toolbar/toolbar.component.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ import { ConfigurationWizardService } from '../../../configuration-wizard/config
4141
/** Custom Components */
4242
import { ConfigurationWizardComponent } from '../../../configuration-wizard/configuration-wizard.component';
4343
import { NotificationsTrayComponent } from 'app/shared/notifications-tray/notifications-tray.component';
44+
import { AboutDialogComponent } from 'app/shared/about-dialog/about-dialog.component';
4445
import { MatToolbar } from '@angular/material/toolbar';
4546
import { MatIconButton } from '@angular/material/button';
4647
import { MatTooltip } from '@angular/material/tooltip';
@@ -163,6 +164,15 @@ export class ToolbarComponent implements OnInit, AfterViewInit, AfterContentChec
163164
help() {
164165
this.documentationLinks.open('userManual');
165166
}
167+
168+
/**
169+
* Opens the About dialog.
170+
*/
171+
openAboutDialog() {
172+
this.dialog.open(AboutDialogComponent, {
173+
width: '450px'
174+
});
175+
}
166176
/**
167177
* Popover function
168178
* @param template TemplateRef<any>.
Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
<!--
2+
Copyright since 2025 Mifos Initiative
3+
4+
This Source Code Form is subject to the terms of the Mozilla Public
5+
License, v. 2.0. If a copy of the MPL was not distributed with this
6+
file, You can obtain one at http://mozilla.org/MPL/2.0/.
7+
-->
8+
9+
<h2 mat-dialog-title>{{ 'labels.heading.About' | translate }}</h2>
10+
11+
<mat-dialog-content>
12+
<div class="about-content">
13+
<table class="about-table">
14+
<tr>
15+
<td class="info-label">{{ 'labels.version.Mifos WebApp' | translate }}</td>
16+
<td class="info-value">
17+
{{ mifosVersion }} - <span class="hash">{{ mifosHash }}</span>
18+
</td>
19+
</tr>
20+
<tr>
21+
<td class="info-label">{{ 'labels.version.Apache Fineract' | translate }}</td>
22+
<td class="info-value">
23+
{{ fineractVersion || '...' }}
24+
</td>
25+
</tr>
26+
<tr>
27+
<td class="info-label">{{ 'labels.inputs.Server' | translate }}</td>
28+
<td class="info-value">{{ server }}</td>
29+
</tr>
30+
<tr>
31+
<td class="info-label">{{ 'labels.version.Username' | translate }}</td>
32+
<td class="info-value">{{ username }}</td>
33+
</tr>
34+
<tr>
35+
<td class="info-label">{{ 'labels.version.Name' | translate }}</td>
36+
<td class="info-value">{{ name }}</td>
37+
</tr>
38+
<tr>
39+
<td class="info-label">{{ 'labels.version.Render Time' | translate }}</td>
40+
<td class="info-value">{{ renderTime | date: 'dd MMMM yyyy HH:mm:ss' }}</td>
41+
</tr>
42+
</table>
43+
</div>
44+
</mat-dialog-content>
45+
46+
<mat-dialog-actions align="end">
47+
<button mat-raised-button mat-dialog-close color="primary">
48+
{{ 'labels.buttons.Close' | translate }}
49+
</button>
50+
</mat-dialog-actions>
Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
/**
2+
* Copyright since 2025 Mifos Initiative
3+
*
4+
* This Source Code Form is subject to the terms of the Mozilla Public
5+
* License, v. 2.0. If a copy of the MPL was not distributed with this
6+
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
7+
*/
8+
9+
.about-content {
10+
padding: 16px 0;
11+
min-width: 350px;
12+
}
13+
14+
.about-table {
15+
width: 100%;
16+
border-collapse: collapse;
17+
18+
tr {
19+
border-bottom: 1px solid var(--md-sys-color-outline-variant, #e0e0e0);
20+
21+
&:last-child {
22+
border-bottom: none;
23+
}
24+
}
25+
26+
td {
27+
padding: 12px 8px;
28+
}
29+
30+
.info-label {
31+
font-weight: 500;
32+
color: var(--md-sys-color-on-surface-variant, #555);
33+
width: 40%;
34+
}
35+
36+
.info-value {
37+
font-weight: 600;
38+
color: var(--md-sys-color-on-surface, #333);
39+
text-align: right;
40+
41+
.hash {
42+
font-weight: 400;
43+
font-size: 0.85em;
44+
color: var(--md-sys-color-on-surface-variant, #666);
45+
}
46+
}
47+
}
48+
49+
// Dark theme support
50+
:host-context(.dark-theme) {
51+
.about-table {
52+
tr {
53+
border-bottom-color: rgb(255 255 255 / 30%);
54+
}
55+
56+
.info-label {
57+
color: rgb(255 255 255 / 70%);
58+
}
59+
60+
.info-value {
61+
color: rgb(255 255 255 / 87%);
62+
63+
.hash {
64+
color: rgb(255 255 255 / 60%);
65+
}
66+
}
67+
}
68+
}
Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
/**
2+
* Copyright since 2025 Mifos Initiative
3+
*
4+
* This Source Code Form is subject to the terms of the Mozilla Public
5+
* License, v. 2.0. If a copy of the MPL was not distributed with this
6+
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
7+
*/
8+
9+
/** Angular Imports */
10+
import { ChangeDetectionStrategy, Component, OnInit, inject } from '@angular/core';
11+
import {
12+
MatDialogRef,
13+
MatDialogTitle,
14+
MatDialogContent,
15+
MatDialogActions,
16+
MatDialogClose
17+
} from '@angular/material/dialog';
18+
import { MatButton } from '@angular/material/button';
19+
import { AuthenticationService } from 'app/core/authentication/authentication.service';
20+
import { SettingsService } from 'app/settings/settings.service';
21+
import { VersionService } from 'app/system/version.service';
22+
import { environment } from '../../../environments/environment';
23+
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
24+
25+
/**
26+
* About Dialog Component.
27+
* Displays version information accessible from the profile dropdown menu.
28+
*/
29+
@Component({
30+
selector: 'mifosx-about-dialog',
31+
templateUrl: './about-dialog.component.html',
32+
styleUrls: ['./about-dialog.component.scss'],
33+
imports: [
34+
...STANDALONE_SHARED_IMPORTS,
35+
MatDialogTitle,
36+
MatDialogContent,
37+
MatDialogActions,
38+
MatDialogClose,
39+
MatButton
40+
],
41+
changeDetection: ChangeDetectionStrategy.OnPush
42+
})
43+
export class AboutDialogComponent implements OnInit {
44+
private dialogRef = inject<MatDialogRef<AboutDialogComponent>>(MatDialogRef);
45+
private authenticationService = inject(AuthenticationService);
46+
private settingsService = inject(SettingsService);
47+
private versionService = inject(VersionService);
48+
49+
/** Mifos X version from environment */
50+
mifosVersion = environment.version;
51+
/** Mifos X hash from environment */
52+
mifosHash = environment.hash;
53+
/** Apache Fineract version */
54+
fineractVersion = '';
55+
/** Server URL */
56+
server = '';
57+
/** Tenant identifier */
58+
tenant = '';
59+
/** Username */
60+
username = '';
61+
/** Name */
62+
name = '';
63+
/** Render time */
64+
renderTime = new Date();
65+
66+
ngOnInit(): void {
67+
this.server = this.settingsService.server;
68+
this.tenant = this.settingsService.tenantIdentifier || 'default';
69+
this.setUserInfo();
70+
this.fetchBackendInfo();
71+
}
72+
73+
/**
74+
* Sets user info from authentication credentials.
75+
*/
76+
private setUserInfo(): void {
77+
const credentials = this.authenticationService.getCredentials();
78+
if (credentials) {
79+
this.username = credentials.username || '';
80+
this.name = credentials.staffDisplayName || credentials.username || '';
81+
}
82+
}
83+
84+
/**
85+
* Fetches backend version info from the server.
86+
*/
87+
private fetchBackendInfo(): void {
88+
this.versionService.getBackendInfo().subscribe({
89+
next: (data: any) => {
90+
if (data.git && data.git.build && data.git.build.version) {
91+
const buildVersion: string = data.git.build.version.split('-');
92+
this.fineractVersion = buildVersion[0];
93+
}
94+
},
95+
error: () => {
96+
this.fineractVersion = 'N/A';
97+
}
98+
});
99+
}
100+
}

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

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -75,10 +75,11 @@ export class FooterComponent implements OnInit, OnDestroy {
7575
alert$: Subscription;
7676
timer: any;
7777

78-
displayBackEndInfo = true;
78+
displayBackEndInfo = false;
7979

8080
constructor() {
81-
this.displayBackEndInfo = environment.displayBackEndInfo === 'true';
81+
// Display backend info is now handled by About dialog
82+
// Set to false to remove release details from footer
8283
this.setUserInfo();
8384
this.renderTime = new Date();
8485
}

src/assets/translations/en-US.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1123,6 +1123,7 @@
11231123
"NotEqual": "Not equal"
11241124
},
11251125
"heading": {
1126+
"About": "About",
11261127
"About Us": "About Us",
11271128
"Account Information": "Account Information",
11281129
"Account Linked Financial": "List of accounts linked to different financial activities. To know more click:",
@@ -3156,6 +3157,7 @@
31563157
"Working with Code": "Working with Code"
31573158
},
31583159
"menus": {
3160+
"About": "About",
31593161
"Unassign Staff": "Unassign Staff",
31603162
"Accounting": "Accounting",
31613163
"Account Overview": "Account Overview",

0 commit comments

Comments
 (0)