/** * Copyright since 2025 Mifos Initiative * * This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ /** Angular Imports */ import { Component, OnInit, inject } from '@angular/core'; import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms'; import { Router, RouterLink } from '@angular/router'; import { Observable } from 'rxjs'; import { map } from 'rxjs/operators'; import { activities } from '../activities'; import { MatAutocompleteTrigger, MatAutocomplete, MatOption } from '@angular/material/autocomplete'; import { MatDialog } from '@angular/material/dialog'; import { MatTooltipModule } from '@angular/material/tooltip'; import { AsyncPipe, DatePipe } from '@angular/common'; import { ClientTrendsBarComponent } from './client-trends-bar/client-trends-bar.component'; import { AmountDisbursedPieComponent } from './amount-disbursed-pie/amount-disbursed-pie.component'; import { AmountCollectedPieComponent } from './amount-collected-pie/amount-collected-pie.component'; import { FaIconComponent } from '@fortawesome/angular-fontawesome'; import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module'; /** * Dashboard component. */ @Component({ selector: 'mifosx-dashboard', standalone: true, templateUrl: './dashboard.component.html', styleUrls: ['./dashboard.component.scss'], imports: [ ...STANDALONE_SHARED_IMPORTS, MatAutocompleteTrigger, MatAutocomplete, MatTooltipModule, ClientTrendsBarComponent, AmountDisbursedPieComponent, AmountCollectedPieComponent, AsyncPipe, DatePipe, FaIconComponent ] }) export class DashboardComponent implements OnInit { private router = inject(Router); private dialog = inject(MatDialog); today = new Date(); /** Array of all user activities */ userActivity: string[]; /** Array of most recent user activities */ recentActivities: string[]; /** Array of most frequent user activities */ frequentActivities: string[]; /** Search Text. */ searchText: UntypedFormControl = new UntypedFormControl(); /** Filtered Activities. */ filteredActivities: Observable; /** All User Activities. */ allActivities: any[] = activities; /** * Gets user activities from local storage. */ constructor() { this.userActivity = JSON.parse(localStorage.getItem('mifosXLocation')) || []; } ngOnInit() { this.recentActivities = this.getRecentActivities(); this.frequentActivities = this.getFrequentActivities(); this.setFilteredActivities(); } /** * Returns top eight recent activities. */ getRecentActivities() { const reverseActivities = this.userActivity.reverse(); const uniqueActivities: string[] = []; reverseActivities.forEach((activity: string) => { if (!uniqueActivities.includes(activity)) { uniqueActivities.push(activity); } }); const topEightRecentActivities = uniqueActivities .filter( (activity: string) => ![ '/', '/login', '/home', '/dashboard' ].includes(activity) ) .slice(0, 8); return topEightRecentActivities; } /** * Returns top eight frequent activities. */ getFrequentActivities() { const frequencyCounts: any = {}; let index = this.userActivity?.length; while (index) { const activity = this.userActivity[--index]; frequencyCounts[activity] = (frequencyCounts[activity] || 0) + 1; } const frequencyCountsArray = Object.entries(frequencyCounts); const topEigthFrequentActivities = frequencyCountsArray .sort((a: any, b: any) => b[1] - a[1]) .map((entry: any[]) => entry[0]) .filter( (activity: string) => ![ '/', '/login', '/home', '/dashboard' ].includes(activity) ) .slice(0, 8); return topEigthFrequentActivities; } /** * Navigates to the activity */ navigatetoActivity(activity: string) { this.router.navigateByUrl(activity); } /** * Sets filtered activities for autocomplete. */ setFilteredActivities() { this.filteredActivities = this.searchText.valueChanges.pipe( map((activity: any) => (typeof activity === 'string' ? activity : activity.activity)), map((activityName: string) => (activityName ? this.filterActivity(activityName) : this.allActivities)) ); } /** * Filters activities. * @param activityName Activity name to filter activity by. * @returns {any} Filtered activities. */ private filterActivity(activityName: string): any { const filterValue = activityName.toLowerCase(); return this.allActivities.filter((activity) => activity.activity.toLowerCase().indexOf(filterValue) === 0); } /** * Opens the CRR/SLR details dialog with full liabilities breakdown. */ async openCrrSlrDialog(): Promise { const { CrrSlrDialogComponent } = await import('./crr-slr-dialog/crr-slr-dialog.component'); this.dialog.open(CrrSlrDialogComponent, { width: '95vw', maxWidth: '1100px', maxHeight: '90vh', panelClass: 'crr-slr-dialog-panel', autoFocus: false }); } async openCrarDialog(): Promise { const { CrarDialogComponent } = await import('./crar-dialog/crar-dialog.component'); this.dialog.open(CrarDialogComponent, { width: '95vw', maxWidth: '1360px', maxHeight: '90vh', panelClass: 'crr-slr-dialog-panel', autoFocus: false }); } }