How coderblack25/runnel works
This is a browser-based personal-finance app for tracking accounts, transactions, categories, budgets, and monthly summaries. Users enter or import transactions, organize them by account and category, then review balances and spending; the app also supports account and category management and recurring-transaction handling. The visible runtime flow is App view selection → feature components → finance data hooks or store → database service. The README is only a Vite template description, so product capabilities here are inferred from the source index and excerpts; unsampled wiring is omitted where it cannot be verified.
Main entry points: App.tsx Application views · useFinanceData.ts Finance data hooks · store.ts Finance store · AccountForm.tsx Account entry
Components 22
App shell
- Application views
src/App.tsx - Navigation
src/components/layout/Sidebar.tsx
Finance features
- Accounts
src/components/accounts/AccountsOverview.tsx - Account entry
src/components/accounts/AccountForm.tsx - Account balance
src/components/accounts/AccountBalance.tsx - Transactions
src/components/transactions/TransactionList.tsx - Transaction entry
src/components/transactions/TransactionForm.tsx - CSV import
src/components/transactions/CsvImport.tsx - Categories
src/components/categories/CategoryManager.tsx - Category budgets
src/components/budgets/BudgetManager.tsx - Monthly summary
src/components/summary/MonthlySummary.tsx
Data and calculations
- Finance data hooks
src/hooks/useFinanceData.ts - Finance store
src/store/store.ts - Finance database
src/services/db.ts - Financial rollups
src/utils/derived.ts - Money utilities
src/utils/money.ts - Recurring transactions
src/utils/recurring.ts - CSV parsing
src/utils/csv.ts
Shared components
Other components
- Finance user
Connections 37
- Finance user → Application views: uses
- Application views → Navigation: renders
src/App.tsx - Application views → Accounts: renders
src/App.tsx - Application views → Account entry: renders
src/App.tsx - Application views → Account balance: renders
src/App.tsx - Application views → Transactions: renders
src/App.tsx - Application views → Transaction entry: renders
src/App.tsx - Application views → CSV import: renders
src/App.tsx - Application views → Categories: renders
src/App.tsx - Application views → Category budgets: renders
src/App.tsx - Application views → Monthly summary: renders
src/App.tsx - Application views → Finance data hooks: loads accounts
src/App.tsx - Finance data hooks → Finance database: queries
src/hooks/useFinanceData.ts - Finance data hooks → Finance store: tracks revision
src/hooks/useFinanceData.ts - Finance store → Finance database: persists changes
src/store/store.ts - Accounts → Finance data hooks: reads data
src/components/accounts/AccountsOverview.tsx - Accounts → Financial rollups: computes rollups
src/components/accounts/AccountsOverview.tsx - Account balance → Finance data hooks: reads data
src/components/accounts/AccountBalance.tsx - Account entry → Finance store: creates account
src/components/accounts/AccountForm.tsx - Transactions → Finance data hooks: reads data
src/components/transactions/TransactionList.tsx - Transactions → Finance store: updates transactions
src/components/transactions/TransactionList.tsx - Transactions → Recurring transactions: uses recurrence
src/components/transactions/TransactionList.tsx - Transaction entry → Finance store: saves transaction
src/components/transactions/TransactionForm.tsx - CSV import → CSV parsing: parses file
src/components/transactions/CsvImport.tsx - CSV import → Finance store: imports transactions
src/components/transactions/CsvImport.tsx - Categories → Finance data hooks: reads data
src/components/categories/CategoryManager.tsx - Categories → Finance store: manages categories
src/components/categories/CategoryManager.tsx - Category budgets → Finance data hooks: reads data
src/components/budgets/BudgetManager.tsx - Category budgets → Finance store: sets budgets
src/components/budgets/BudgetManager.tsx - Monthly summary → Finance data hooks: reads data
src/components/summary/MonthlySummary.tsx - Monthly summary → Financial rollups: computes summary
src/components/summary/MonthlySummary.tsx - Financial rollups → Money utilities: computes balance
src/utils/derived.ts - CSV import → Money utilities: parses amounts
src/components/transactions/CsvImport.tsx - Account entry → Input UI: renders
src/components/accounts/AccountForm.tsx - Account entry → Select UI: renders
src/components/accounts/AccountForm.tsx - Categories → Button UI: renders
src/components/categories/CategoryManager.tsx - Category budgets → Button UI: renders
src/components/budgets/BudgetManager.tsx