feat(giving): add role-gated finance nav section

This commit is contained in:
Chris Chen
2026-05-28 17:00:49 -07:00
parent 4a2b142061
commit 91247a7c69
2 changed files with 19 additions and 2 deletions
@@ -51,6 +51,15 @@
</button>
</ng-container>
</div>
<div class="nav-section" *ngIf="showFinanceSection">
<h4>Finance</h4>
<button *ngFor="let item of financeNavItems" kendoButton
[fillMode]="item.active ? 'solid' : 'flat'" [themeColor]="item.active ? 'primary' : 'base'"
[svgIcon]="item.icon" class="nav-button" (click)="navigateTo(item.path)">
{{ item.text }}
</button>
</div>
</nav>
</div>
</kendo-drawer-content>
@@ -68,8 +68,15 @@ export class UserNavbarComponent implements OnInit, OnDestroy {
{ text: 'User Management', icon: userIcon, path: '/user-portal/admin/users' },
];
public financeNavItems: NavItem[] = [
{ text: 'Offering Entry', icon: this.creditCardIcon, path: '/user-portal/finance/offering-session' },
{ text: 'Givings', icon: this.chartIcon, path: '/user-portal/finance/givings' },
{ text: 'Giving Types', icon: this.buildingIcon, path: '/user-portal/finance/giving-categories' },
];
public showMemberAdminSection = false;
public showUserAdminSection = false;
public showFinanceSection = false;
private destroy$ = new Subject<void>();
@@ -97,6 +104,7 @@ export class UserNavbarComponent implements OnInit, OnDestroy {
const roles = user?.roles ?? [];
this.showMemberAdminSection = roles.some(r => r === 'super_admin' || r === 'secretary');
this.showUserAdminSection = roles.includes('super_admin');
this.showFinanceSection = roles.some(r => r === 'finance' || r === 'super_admin');
});
}
@@ -113,12 +121,12 @@ export class UserNavbarComponent implements OnInit, OnDestroy {
private updateActiveStates(currentUrl: string): void {
// Reset all active states
[...this.mainNavItems, ...this.managementNavItems, ...this.supportNavItems,
...this.memberAdminNavItems, ...this.userAdminNavItems]
...this.memberAdminNavItems, ...this.userAdminNavItems, ...this.financeNavItems]
.forEach(item => item.active = false);
// Set active state for current route
const activeItem = [...this.mainNavItems, ...this.managementNavItems, ...this.supportNavItems,
...this.memberAdminNavItems, ...this.userAdminNavItems]
...this.memberAdminNavItems, ...this.userAdminNavItems, ...this.financeNavItems]
.find(item => currentUrl.startsWith(item.path));
if (activeItem) {