apache / apache/fineract-backoffice-ui

[UX] Restructure Sidebar Navigation to Improve Visibility of Core Admin Modules

Open
#329 4 comments 0 reactions 0 assignees View on GitHub
good first issue navigation
Dominant language
TypeScript
Stars
15
Forks
60
Avg merge
10h 15m
Merged PRs (30d)
108

Description

Module: src/app/layout/sidebar.component.ts

![Sidebar Layout]

Image

Description
Key administrative and setup modules—such as Offices, Loan Products, Templates, and Roles & Permissions (RBAC)—are placed at the very bottom of the sidebar. In standard viewports, users are required to scroll down extensively through non-collapsible lists.

Steps to Reproduce
1. Log into Fineract Backoffice UI.
2. Observe the left sidebar navigation layout on standard 1080p resolution.
3. Note that administrative modules (Offices, System, Settings) are truncated below the fold.

Expected Behavior
Sidebar should use collapsible accordions/groups (e.g., Core Banking Operations, Products & Accounting, Administration & RBAC) to keep key management screens accessible without heavy vertical scrolling.

Proposed Implementation
- Update SidebarComponent layout to group sub-items into expandable sections.

Contributor guide

Open the contributing guide

Research direction

Start with src/app/layout/sidebar.component.ts and inspect the current navigation item structure. Run the Fineract Backoffice UI at a standard 1080p viewport to reproduce the scrolling issue. Done means administrative modules are organized into expandable accordion groups and key screens remain accessible without extensive scrolling.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
design, frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
72/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.