feat: add RBI circulars, CKYC, KYC, Superset analytics, passbook modules and UI updates

Add new feature modules (RBI feeds, CKYC, KYC tab, Form60, Superset analytics, passbook),
update client family members, dashboard, login page, sidenav, images, translations,
environment config, and fix RBI feeds API auth by using relative URLs.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/app/home/dashboard/dashboard.component.html

@@ -6,11 +6,14 @@
   file, You can obtain one at http://mozilla.org/MPL/2.0/.
 -->
 
-<div class="container">
-  <mat-card class="card layout-column gap-40px">
-    <div class="layout-row search">
+<div class="cbs-dashboard-container">
+  <div class="cbs-header">Core Banking System Dashboard</div>
+
+  <div class="cbs-content">
+    <!-- Search Activity -->
+    <div class="search-row">
       <mat-card-content>
-        <mat-form-field>
+        <mat-form-field class="search-field">
           <mat-label>{{ 'labels.placeholders.Search Activity' | translate }}</mat-label>
           <input matInput [matAutocomplete]="activitySearch" [formControl]="searchText" />
         </mat-form-field>
@@ -25,20 +28,130 @@
       </mat-card-content>
     </div>
 
-    <div class="layout-row top-card">
-      <div class="trends-bar">
-        <mifosx-client-trends-bar></mifosx-client-trends-bar>
+    <!-- Regulatory & Compliance -->
+    <div class="section-title">Regulatory & Compliance</div>
+    <div class="stats-grid">
+      <div class="stat-card">
+        <div class="stat-card-title">CRR / SLR</div>
+        <div class="stat-card-value">&#8377; 125 Cr</div>
+        <div class="stat-trend up">&#9650; Within Limits</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">CRAR</div>
+        <div class="stat-card-value">13.42%</div>
+        <div class="stat-trend up">&#9650; Healthy</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">DICGC (Samyak)</div>
+        <div class="stat-card-value">Updated</div>
+        <div class="stat-trend">Last Sync: Today</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">Interbank Exposure</div>
+        <div class="stat-card-value">72%</div>
+        <div class="stat-trend down">&#9660; Near Limit</div>
       </div>
     </div>
 
-    <div class="layout-row bottom-card">
-      <div class="amount-disbursed">
-        <mifosx-amount-disbursed-pie></mifosx-amount-disbursed-pie>
+    <!-- Financial Health -->
+    <div class="section-title">Financial Health</div>
+    <div class="stats-grid">
+      <div class="stat-card">
+        <div class="stat-card-title">Net Worth</div>
+        <div class="stat-card-value">&#8377; 342 Cr</div>
       </div>
 
-      <div class="amount-collected">
-        <mifosx-amount-collected-pie></mifosx-amount-collected-pie>
+      <div class="stat-card">
+        <div class="stat-card-title">CD Ratio</div>
+        <div class="stat-card-value">68.2%</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">Capital Working</div>
+        <div class="stat-card-value">&#8377; 210 Cr</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">Per Employee Income</div>
+        <div class="stat-card-value">&#8377; 8.4 L</div>
       </div>
     </div>
-  </mat-card>
+
+    <!-- Deposits & Advances -->
+    <div class="section-title">Deposits & Advances</div>
+    <div class="stats-grid">
+      <div class="stat-card">
+        <div class="stat-card-title">Total Deposits</div>
+        <div class="stat-card-value">&#8377; 1,240 Cr</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">Total Advances</div>
+        <div class="stat-card-value">&#8377; 845 Cr</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">Decay Analysis</div>
+        <div class="stat-card-value">Moderate</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">TSWM</div>
+        <div class="stat-card-value">Active</div>
+      </div>
+    </div>
+
+    <!-- Risk & NPA Monitoring -->
+    <div class="section-title">Risk & NPA Monitoring</div>
+    <div class="stats-grid">
+      <div class="stat-card">
+        <div class="stat-card-title">Gross NPA</div>
+        <div class="stat-card-value">4.82%</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">Net NPA</div>
+        <div class="stat-card-value">2.11%</div>
+      </div>
+
+      <div class="stat-card">
+        <div class="stat-card-title">Risk-wise Analysis</div>
+        <div class="stat-card-value">Stable</div>
+      </div>
+    </div>
+
+    <!-- Alerts & Notifications -->
+    <div class="section-title">Alerts & Notifications</div>
+    <div class="alert-panel">
+      <span>&#9888; CRAR approaching minimum threshold.</span><br />
+      <span>&#9888; Interbank exposure nearing limit.</span><br />
+      <span>&#9888; RBI circular pending review.</span>
+    </div>
+
+    <!-- Existing Charts -->
+    <div class="section-title">Analytics</div>
+    <div class="charts-section">
+      <div class="top-card">
+        <div class="trends-bar">
+          <mifosx-client-trends-bar></mifosx-client-trends-bar>
+        </div>
+      </div>
+
+      <div class="bottom-card">
+        <div class="amount-disbursed">
+          <mifosx-amount-disbursed-pie></mifosx-amount-disbursed-pie>
+        </div>
+
+        <div class="amount-collected">
+          <mifosx-amount-collected-pie></mifosx-amount-collected-pie>
+        </div>
+      </div>
+    </div>
+
+    <!-- Footer -->
+    <div class="cbs-footer">CBS Monitoring Dashboard &bull; Internal Use Only</div>
+  </div>
 </div>

src/app/home/dashboard/dashboard.component.scss

@@ -6,60 +6,148 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-.card {
-  box-sizing: border-box;
-  padding: 2%;
-  display: flex;
-  flex-direction: column;
-  overflow-x: hidden;
+.cbs-dashboard-container {
+  background: #f4f6f9;
+  min-height: 100vh;
+}
 
-  .search {
+.cbs-header {
+  background: #1f3b73;
+  color: white;
+  padding: 15px 25px;
+  font-size: 20px;
+  font-weight: bold;
+}
+
+.cbs-content {
+  padding: 20px;
+}
+
+.search-row {
+  width: 100%;
+  margin-bottom: 10px;
+
+  mat-card-content {
     width: 100%;
-    padding: 12px;
-
-    mat-card-content {
-      width: 100%;
-    }
-
-    mat-form-field {
-      width: 100%;
-    }
   }
 
-  .top-card {
-    flex: 1 0 100%;
+  .search-field {
+    width: 100%;
+  }
+}
 
+.section-title {
+  margin: 20px 0 10px;
+  font-size: 16px;
+  font-weight: bold;
+  color: #333;
+}
+
+.stats-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: 15px;
+}
+
+.stat-card {
+  background: white;
+  border-radius: 8px;
+  padding: 15px;
+  box-shadow: 0 2px 6px rgb(0 0 0 / 8%);
+  transition: box-shadow 0.2s ease;
+
+  &:hover {
+    box-shadow: 0 4px 12px rgb(0 0 0 / 12%);
+  }
+}
+
+.stat-card-title {
+  font-size: 13px;
+  color: #777;
+  margin-bottom: 8px;
+}
+
+.stat-card-value {
+  font-size: 22px;
+  font-weight: bold;
+  color: #1f3b73;
+}
+
+.stat-trend {
+  font-size: 12px;
+  margin-top: 5px;
+  color: #888;
+
+  &.up {
+    color: green;
+  }
+
+  &.down {
+    color: red;
+  }
+}
+
+.alert-panel {
+  background: #fff3f3;
+  border-left: 4px solid red;
+  padding: 10px 15px;
+  border-radius: 6px;
+  font-size: 13px;
+  line-height: 1.8;
+  color: #333;
+}
+
+.charts-section {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+
+  .top-card {
     .trends-bar {
       width: 100%;
-      flex: 1 0 100%;
     }
   }
 
   .bottom-card {
     display: flex;
     flex-flow: row wrap;
-    gap: 2px;
+    gap: 15px;
 
     .amount-collected,
     .amount-disbursed {
-      flex: 1 0 calc(40% - 10px);
-      padding: 0;
-      margin: 10px;
+      flex: 1 0 calc(50% - 15px);
+      min-width: 300px;
     }
   }
 }
 
+.cbs-footer {
+  margin-top: 30px;
+  text-align: center;
+  font-size: 12px;
+  color: #888;
+  padding: 15px 0;
+}
+
 @media screen and (width <= 768px) {
-  .top-card,
-  .bottom-card {
-    flex-direction: column;
+  .stats-grid {
+    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
+    gap: 10px;
+  }
 
-    .trends-bar,
-    .amount-collected,
-    .amount-disbursed {
-      flex: 1 0 100%;
-      width: 100%;
-      margin: 10px 0;
+  .stat-card-value {
+    font-size: 18px;
+  }
+
+  .charts-section {
+    .bottom-card {
+      flex-direction: column;
+
+      .amount-collected,
+      .amount-disbursed {
+        flex: 1 0 100%;
+        width: 100%;
+      }
     }
   }
 }

src/app/home/dashboard/dashboard.component.ts

@@ -24,6 +24,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
  */
 @Component({
   selector: 'mifosx-dashboard',
+  standalone: true,
   templateUrl: './dashboard.component.html',
   styleUrls: ['./dashboard.component.scss'],
   imports: [
@@ -56,7 +57,7 @@ export class DashboardComponent implements OnInit {
    * Gets user activities from local storage.
    */
   constructor() {
-    this.userActivity = JSON.parse(localStorage.getItem('mifosXLocation'));
+    this.userActivity = JSON.parse(localStorage.getItem('mifosXLocation')) || [];
   }
 
   ngOnInit() {

src/app/home/home.component.ts

@@ -96,7 +96,10 @@ export class HomeComponent implements OnInit, AfterViewInit {
     this.tenant = this.tenantIdentifier();
     this.setFilteredActivities();
     if (!this.authenticationService.hasDialogBeenShown()) {
-      this.dialog.open(WarningDialogComponent);
+      this.dialog.open(WarningDialogComponent, {
+        disableClose: false,
+        width: '500px'
+      });
       this.authenticationService.showDialog();
     }
   }

src/app/home/warning-dialog/warning-dialog.component.html

@@ -8,6 +8,8 @@
 
 <h1 mat-dialog-title>{{ 'labels.text.' + title | translate }}</h1>
 <mat-dialog-content>{{ 'labels.text.Warning message' | translate }}</mat-dialog-content>
-<mat-dialog-actions>
-  <button mat-raised-button color="primary" mat-dialog-close>{{ 'labels.buttons.' + buttonText | translate }}</button>
+<mat-dialog-actions align="end">
+  <button mat-raised-button color="primary" mat-dialog-close (click)="dialogRef.close()">
+    {{ 'labels.buttons.' + buttonText | translate }}
+  </button>
 </mat-dialog-actions>