Skip to main content

Documentation Index

Fetch the complete documentation index at: https://grantmaster.dev/llms.txt

Use this file to discover all available pages before exploring further.

Engineering reference: For service contracts, EventBus events, and data-layer details see src/features/settings/settings.md.

last_updated: 2026-03-08

Settings Hub

Overview

The Settings Hub is a centralized configuration interface organized into 7 categories with permission-gated access. It uses a hierarchical sidebar navigation pattern with URL-based routing and lazy-loaded setting pages.

Architecture

The feature lives under src/features/settings/ and is built around three core components:
ComponentPurpose
SettingsShellRoot container — handles routing (/settings/:category/:item), permission checks, Suspense boundaries, legacy URL redirects
SettingsSidebarCollapsible navigation using SecondarySidebar — groups items by category with expand/collapse
SettingsHomeHub landing page at /settings — category cards with search and quick navigation

URL Routing

/settings                         → SettingsHome (hub page)
/settings/:category               → First item in category (single-item shortcut)
/settings/:category/:item         → Specific settings page
/settings?tab=xxx                 → Legacy redirect → /settings/:category/:item

Categories & Items

CategoryIDItemsPermission
OrganizationorganizationProfile, ClassificationMANAGE_ORG_SETTINGS
AppearanceappearanceTheme, WidgetsMANAGE_ORG_SETTINGS
InternationalinternationalLanguage, Regional, FormatsMANAGE_ORG_SETTINGS
FinancefinanceBudget, Expenses, Cost Centers, ApprovalsMANAGE_ORG_SETTINGS
SecuritysecurityLogin, Passwords, Authentication, BackupMANAGE_ORG_SETTINGS
Grant Sourcesgrant-sourcesSource ManagementMANAGE_GRANT_OPPORTUNITIES
Danger Zonedanger-zoneData (tenant lifecycle), Account (user lifecycle)MANAGE_ORG_SETTINGS
Total: 7 categories, 18 setting pages.

Setting Pages (Lazy-Loaded)

All setting page components are loaded via React.lazy() for code splitting:

Organization

  • OrganizationProfileEditor — Organization name, logo, description, contact info
  • ClassificationSettings — Sector, geography, legal/fiscal, SDG alignment

Appearance

  • ScreenSettings — Theme mode (light/dark/system), color customization
  • WidgetSettings — Dashboard widget visibility and layout preferences

International

  • LanguageSettings — UI language selection (i18n)
  • RegionalSettings — Country, timezone, locale
  • DateTimeSettings — Date format, time format, fiscal year start

Finance

  • BudgetCategoriesSettings — Budget category taxonomy management
  • ExpenseSettings — Expense policies, receipt requirements, limits
  • CostCentersSettings — Cost center hierarchy configuration
  • AutoApprovalSettings — Automated approval rules and thresholds

Security

  • LoginPolicySettings — Login restrictions, allowed domains
  • PasswordPolicySettings — Password complexity, rotation rules
  • AuthenticationSettings — MFA, SSO, session timeout
  • BackupExportsSettings — Data export and backup preferences

Grant Sources

  • GrantSourceManagement — Grant ingestion pipeline controls, source configuration

Danger Zone

  • DangerTenantDataSettings — Organization data lifecycle (export, purge)
  • DangerAccountSettings — User account lifecycle (deactivate, delete)

Key Features

  • Permission Filtering — Items are hidden if the user lacks the required permission
  • Search — Fuzzy search across all items using labels, descriptions, and keywords
  • Legacy URL Support — Old ?tab=xxx query parameters redirect to new URL structure
  • Single-Item Category Optimization — Categories with one item navigate directly without sub-path

Public API

The settings feature exports key components for use outside the feature boundary via src/features/settings/public.ts:
  • AutoApprovalSettings — embedded in finance workflows
  • BudgetCategoriesSettings — embedded in budget management
  • SettingsPageHeader — reusable header for settings-style pages
  • SecurityPolicies — embedded in Platform Management security tab

Configuration

The settings hierarchy is defined in src/features/settings/components/SettingsShell/settingsConfig.ts. Each item specifies:
interface SettingsItem {
  id: string;              // URL segment
  label: string;           // Display name
  description: string;     // Subtitle text
  keywords: string[];      // Search terms
  icon: LucideIcon;        // Navigation icon
  component: React.LazyExoticComponent<...>;  // Lazy-loaded page
  permission?: Permission; // Required permission
  requiresOrganization?: boolean;  // Org context needed
}