Commit Graph

8 Commits

Author SHA1 Message Date
d4a79c785d report-fetch-request-ui (#7)
## MR: Fetch Request Pipeline, Report Snapshots, and Admin Filtering

### Summary
Adds fetch request pipeline UI, report snapshot manager, snapshot selector on dashboard, and client-side in-memory filtering for the admin panel. Also overhauls the Home page with feature cards and adds navigation links.

### Changes

**New Pages**
- `/fetch-requests` — Upload bank statements (two-step: upload file, then configure source) or configure email ingestion. Table shows fingerprint (with copy), source type, account, status (color-coded chip), and created date.
- `/reports` — Generate cached report snapshots with filters (ignore self, date range, amount range). Table shows snapshot ID (with copy), creation time, and query summary chips.

**Dashboard**
- Snapshot selector autocomplete dropdown (formatted "Snapshot from {date}"), passes `snapshot_id` to `useReport`
- Styled to match other filter controls (caption above, auto-height)

**Admin — In-Memory Filtering**
- `FilterBar` component: collapsible, Dashboard-style column layout with caption + autocomplete/range/date inputs per filterable field
- `FilterAutocomplete` component: multi-select, free solo, checkmark ticks, selected-first sort frozen while dropdown open (prevents scroll reset)
- `applyClientFilters` in `ResourceView`: handles number range, datetime range, array (object/string elements), non-relation objects, boolean, primitive exact match
- Config-driven via `filterOptions: { mode: "client", fields: [...] }` in `openapi-config.ts`
- Mobile view: each filter takes full width (`flex: "0 0 100%"`), no horizontal squeeze
- `rowCount` omitted in client pagination mode (suppresses MUI X warning)

**Navigation & Home**
- Header nav links: Dashboard, Fetch, Reports
- Home page redesign: gradient hero, "Import Data" CTA, 4 feature cards (Dashboard, Fetch Requests, Report Snapshots, Admin) with accent-colored hover effects

**React-OpenAPI Library**
- `filterOptions` (mode + fields) on `ResourceOverride` and `ResourceConfig` types
- `EnhancedTable` mobile pagination (10 per page with Prev/Next, prevents browser hang with 10000 records)
- `useResource` accepts `filterOptions` from loader

**Misc**
- `public/favicon.png` added, proper `image/png` type in index.html
- 24 files changed, ~1541 insertions, ~100 deletions

### Files Changed (24)
| File | Change |
|------|--------|
| `src/FetchRequests.tsx` | +336 — new page |
| `src/ReportSnapshots.tsx` | +273 — new page |
| `src/features/fetch-requests/` | +96 — models, hooks, index |
| `src/features/report-snapshots/` | +40 — models, hooks, index |
| `src/Dashboard.tsx` | +58 — snapshot selector |
| `src/Home.tsx` | +224 — redesign with feature cards |
| `src/Header.tsx` | +26 — nav links |
| `src/main.jsx` | +4 — routes |
| `react-openapi/components/FilterBar.tsx` | +313 — new component |
| `react-openapi/components/ResourceView.tsx` | +151 — client filtering |
| `react-openapi/components/EnhancedTable.tsx` | +62 — mobile pagination |
| `react-openapi/types/config.ts` | +7 — filterOptions type |
| `react-openapi/types/overrides.ts` | +5 — filterOptions type |
| `react-openapi/utils/openapi_loader.ts` | +8 — load filterOptions |
| `react-openapi/hooks/useResource.ts` | +6 — filterOptions passthrough |
| `react-openapi/index.ts` | +3 — exports |
| `src/openapi-config.ts` | +15 — expenses config |
| `src/features/report/useReport.ts` | +13 — snapshot_id support |
| `index.html` | +1 — favicon link |
| `public/favicon.png` | +2910 bytes |

Reviewed-on: #7
Co-authored-by: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Co-committed-by: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
2026-05-24 17:23:02 +00:00
a1ff2c692c Theme System Refactor (#6)
# Dashboard State Lift + Theme System Refactor

## Summary

Refactored dashboard state ownership, centralized theme semantics, and simplified component styling across the application.

## Changes

### Dashboard State Refactor

* Moved dashboard state management from `Dashboard.view` into `Dashboard.tsx`
* Added centralized `DashboardState` initialization in parent container
* Introduced memoized dashboard state setter callbacks:

  * `toggleFlow`
  * `setFlow`
  * `togglePeriodType`
  * `toggleComparison`
  * `setSelectedPeriodId`
  * `setSelectedGroupKey`
* Added `DashboardStateSetters` memoized object for prop-driven state management
* Removed `onFlowChange` callback pattern
* Converted dashboard component into stateless view layer
* Renamed component export flow:

  * `Dashboard.tsx` → removed
  * `Dashboard.view.tsx` → primary implementation

### Dashboard Models Cleanup

* Removed legacy palette configuration interfaces:

  * `ColorDefinition`
  * `ThemeAwarePalette`
* Removed config-level style palette support from `DashboardConfig`
* Renamed `DashboardProps` → `DashboardViewProps`
* Added reusable `ColorScheme` interface
* Simplified component color contract:

  * `primary`
  * `surface`
  * `text`

### Theme Architecture Refactor

* Moved `AppTheme.tsx` into `shared-theme`
* Added centralized semantic theme system
* Introduced `themeConfig.ts` with semantic tokens:

  * surface
  * border
  * text
* Added `semantic` extension to MUI theme typing
* Added `flows` palette extension:

  * outflows
  * inflows
* Centralized flow colors inside theme primitives
* Added CSS semantic variables:

  * `--bg-page`
  * `--bg-card`
  * `--bg-elevated`
  * `--border-default`
  * `--border-subtle`
  * `--text-primary`
  * `--text-secondary`
  * `--text-muted`

### Theme Mode Improvements

* Added explicit `ColorMode` type
* Expanded `ColorModeContext`:

  * `mode`
  * `setMode`
  * `toggleColorMode`
* Added `CssBaseline`
* Added configurable `defaultMode`
* Simplified dark theme palette handling
* Standardized dark surfaces and shadows
* Reduced excessive dark-mode glow/shadow intensity

### Dashboard UI Styling Improvements

* Replaced hardcoded dashboard palette config with theme palette usage
* Updated dashboard background gradients to use alpha-based semantic colors
* Replaced `colorScheme.light` usage with `colorScheme.surface`
* Standardized border usage with theme divider tokens
* Removed manual dark-mode conditional styling where redundant
* Simplified card and progress styling logic

### Shared Theme Customization Cleanup

Updated customization layers for improved consistency:

* `inputs`
* `navigation`
* `feedback`
* `surfaces`

Key improvements:

* Reduced dark-mode contrast harshness
* Unified divider usage
* Replaced hardcoded grayscale backgrounds with semantic surfaces
* Simplified hover and active state styling
* Reduced shadow intensity across components
* Improved dark-mode readability and layering

### Home Page Styling Cleanup

* Replaced manual RGBA handling with `alpha()` utility
* Improved dark-mode glassmorphism consistency
* Updated CTA hover shadow to use theme primary color

### Miscellaneous Cleanup

* Updated imports to new theme structure
* Removed unused legacy color mode components:

  * `ColorModeIconDropdown.tsx`
  * `ColorModeSelect.tsx`
* Removed dashboard config style palette definitions
* Simplified flow-based color derivation logic

## Result

* Cleaner separation of stateful vs presentational dashboard logic
* Centralized semantic theming system
* Consistent dark/light mode behavior
* Reduced styling duplication
* Improved maintainability and extensibility of theme architecture
* Simplified dashboard component contracts
* Better UI consistency across surfaces and controls

Reviewed-on: #6
Co-authored-by: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Co-committed-by: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
2026-05-23 11:41:57 +00:00
692d907ca5 fixes 2026-04-07 11:59:11 +05:30
86e5bc6429 theme fixes 2026-04-04 16:00:33 +05:30
c3d233c41a header and footer 2026-04-04 13:34:48 +05:30
0749060b1f fixes 2026-04-04 13:07:28 +05:30
8a6b438e93 added footer 2026-04-04 13:05:51 +05:30
8a285bbdbe init 2026-04-04 12:46:28 +05:30