Deposit History

Component File: src/features/deposits/components/DepositHistory.tsx Route / navigation: Path /fund-accounting, Zustand accountingTool = deposit-history (via Deposits sub-hub). See 00-ACCOUNTING-HUB.md. Access Level: Parent Org and Fund Users with Accounting access (position-based) Last Updated: March 27, 2026

Recent Fixes

Tranched deposits visible per fund (Mar 27, 2026)

Problem: Multi-fund batches store deposits.organization_id on the parent org. Fund-scoped history (p_org_id = fund) previously returned no rows for those batches.
Fix: get_deposit_history_page base CTE also matches deposits that have any deposit_items → donations.organization_id = p_org_id. Stats (total_count, today_*) use the same filter set.
Migration: 20260327200000_deposit_history_tranched_visibility.sql (applied to production via Supabase MCP for IFM).

Row-level check image & dialog details (Mar 23, 2026)

Row click: For any line that has a stored check image (deposit_items.check_image_url), the entire row opens the check image viewer (single-item deposits: the main row; multi-item deposits: each expanded sub-row). Hover uses hover:bg-muted/50 and cursor-pointer when an image exists. The batch row for multi-item deposits still only expands/collapses — it does not open an image.
Controls: Icon and View check links call stopPropagation() so they do not double-trigger; behavior matches row click.
Dialog: The viewer shows structured deposit context above the image: deposit date, check number (when present), line amount, payer, fund, status, deposit type, memo, and batch notes. State clears on close. Implementation uses a CheckImageViewContext object passed into openCheckImage() from DepositHistory.tsx.
Files: src/features/deposits/components/DepositHistory.tsx, documentation/pages/accounting/11-DEPOSIT-HISTORY.md

Table layout & single-item rows (Mar 20, 2026)

Styling guide: Table uses table-fixed w-full, a single flex column (Details / notes — no fixed width on lg), tiered w-[…px] on other heads, and an overflow-x-auto wrapper per STYLING-GUIDE.md § Table Content Integrity & Column Width Standard.
Single line item: Deposits with exactly one deposit_items row render as one flat row (no chevron, no expand). Payer, check #, memo, and batch notes are combined in Details; check image stays in the first column when present.
Multiple items: Chevron + expand/collapse unchanged; sub-rows include an icon-only control and a View check text control (where an image exists) for discoverability.
Edit / void / delete: Remain batch-level actions (3-dot menu). The domain model edits the whole deposit via RegularDepositManager / CheckDepositManager using sessionStorage.editDepositId — there is no per–line-item edit API.

Check Image Viewer (Mar 17, 2026; dialog content Mar 23, 2026)

Problem: Check images were uploaded and stored in deposit_items.check_image_url during deposit submission, but the Deposit History component never displayed them. Users had no way to view check images after a deposit was submitted.
Solution:
Image icon and View check controls where a check_image_url exists; row-level click opens the same viewer when applicable (see Mar 23, 2026 above).
Full-size image dialog with structured deposit/line-item details above the image (date, check #, amount, payer, fund, status, type, memo, batch notes).
Images are loaded via Supabase Storage signed URLs (1-hour expiry) from the receipts bucket
Signed URLs are cached in-memory to avoid re-generating on expand/collapse
Base64 fallback URLs (from upload failures) are handled transparently
Files Modified: src/features/deposits/components/DepositHistory.tsx, documentation/pages/accounting/11-DEPOSIT-HISTORY.md

Overview

The Deposit History tool allows users to view and search previously submitted deposits. It was built in response to a user request to verify whether a deposit had been entered on a given day. The tool provides a searchable, filterable table of all deposit batches with expandable rows showing individual line items.

UI Features

Summary Stats (3 cards, centered text, no icons)

1. Total Deposits — Count of deposits matching current filters 2. Total Amount — Sum of all deposit amounts matching current filters 3. Deposits Today — Count and amount of deposits with today's date

Filter Bar

Search — Debounced (300ms) search by payer name or deposit notes
Status Filter — Dropdown: All Statuses, Pending, Deposited, Cleared
Date Range Picker — Presets (All time, This month, Last month, etc.) + custom range

Deposits Table

Layout: table-fixed w-full, tiered column widths, one flex column (Details), overflow-x-auto wrapper
Columns: Chevron (multi-item only) / image slot, Date, Type (badge), Items count, Amount, Status (badge), Fund (hidden <md), Details (hidden <lg), Actions (if canWriteAccounting)
Single-item deposits — One row only; first column shows check image control when check_image_url is set; Details includes a View check link when applicable; clicking anywhere on the row opens the check viewer when an image exists
Multi-item deposits — Click the batch row to expand line items (payer, check #, amount, memo, bg-muted/30); each sub-row with an image is fully clickable plus icon / View check; View check where an image exists
Empty state — Icon + contextual message based on whether search is active
Loading state — SkeletonTable (8 rows × 6 columns)
Fetching indicator — Opacity fade while background-refreshing

Batch actions: Edit, void, delete

Actions column — 3-dot menu (DropdownMenu), only if canWriteAccounting
Edit deposit — Batch-level only (not per check line). Pending: navigates to check or regular deposit manager with editDepositId in sessionStorage. Deposited: confirmation dialog → voidDepositBatch() → same navigation to re-enter the batch.
Void deposit (deposited) — Menu item → confirmation dialog; requires reason; voidDepositBatch() (reversing JE, void donations, revert to pending); toast shows voided donation count
Delete deposit (pending) — Menu item → confirmation; deleteDeposit() (cleanup donations/JE, remove deposit)
Cleared deposits — No action available
Confirmation dialog — Shows deposit date, amount, item count, and type before action

Data Layer

Database Function

// src/lib/db/deposits.ts
fetchDepositsWithItems(entityId: EntityId, filters?: {
  status?: 'pending' | 'deposited' | 'cleared' | 'all';
  startDate?: string;
  endDate?: string;
  search?: string; // client-side filter on deposit_items.payer_name and deposits.notes
}): Promise<DepositWithItems[]>

Uses PostgREST nested select: deposits → deposit_items(*)
Ordered by deposit_date descending, limit 200
Parent org users (getOrgId returns null) see deposits across all funds
Search is applied client-side since PostgREST doesn't support filtering parent rows by child field values

React Query

Query key: ['deposit-history', selectedEntity, statusFilter, startDate, endDate, debouncedSearch]
Stale time: 30 seconds

Navigation

Breadcrumb: Fund Accounting → Deposits → Deposit History
Back navigation via breadcrumb clicks (sets accountingTool to null or 'deposits')

Dependencies

@tanstack/react-query — Data fetching and caching (useQuery, useQueryClient)
src/lib/db/deposits.ts — fetchDepositsWithItems(), voidDepositBatch(), deleteDeposit()
src/hooks/usePermissions.ts — canWriteAccounting for action column visibility
src/lib/entityMapping.ts — getEntityId() for reverse org-UUID-to-entity-name mapping
src/lib/dateUtils.ts — toLocalDateString() for date filter strings
src/components/ui/date-range-picker.tsx — DateRangePicker with presets
src/components/ui/skeleton-table.tsx — Loading state
src/components/ui/dialog.tsx — Check image viewer, void/delete, and edit confirmation dialogs
sonner — Toast notifications for action results

Ready to Get Started?

See how Alignmint can simplify your nonprofit's operations. Schedule a free demo with our team and we'll walk you through everything.

Schedule Your Free Demo Log In to Alignmint

Questions? Email us at steven@getalignmint.org