gitpod-io / gitpod-io/memo

feat: add column calculation summary row to database table view

Open
#1,245 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement needs-human priority:3
Dominant language
TypeScript
Stars
55
Forks
11
PR merge metrics
No merged PRs in 30d

Description

Description

Database table views have no way to see aggregate values for a column. In Notion, clicking a "Calculate" button at the bottom of each column shows sum, average, min, max, count, etc. This is one of the most-used database features for project tracking and data analysis. Adding a summary row at the bottom of the table gives users at-a-glance insights without exporting to a spreadsheet.

Approval Required

This is a HIGH risk change because it adds a new feature surface:

  • Adds a new UI element (summary row) to the table view that interacts with virtualization, column resize, and column reorder
  • Requires per-column calculation config persisted in database_views.config
  • Calculation logic must handle all property types correctly (sum only for numbers, count for all types, etc.)
  • The summary row must stay pinned at the bottom during scroll (outside the virtualized area)

Comment "approved" to release this to the automation queue.

Acceptance Criteria

  • A summary row appears at the bottom of the table view, pinned below the scrollable area
  • Each column cell in the summary row shows a "Calculate" button (muted text) when empty
  • Clicking "Calculate" opens a dropdown with type-appropriate options:
    • All types: None, Count all, Count values, Count unique, Count empty, Percent empty, Percent filled
    • Number: + Sum, Average, Min, Max, Median, Range
    • Date: + Earliest, Latest, Date range
    • Checkbox: + Checked, Unchecked, Percent checked
  • Selecting a calculation shows the result in the summary cell
  • Results update live as rows are added, edited, or filtered
  • The selected calculation per column is persisted in database_views.config.column_calculations
  • Each view maintains independent calculation settings
  • Summary row aligns with column widths (including after resize and reorder)
  • Storybook stories cover: no calculations, mixed calculations, number sum, date range
  • E2E test: add number column → add rows with values → select "Sum" → verify sum displays → filter rows → sum updates → switch view → switch back → calculation persists
  • pnpm lint && pnpm typecheck && pnpm test pass

Dependencies

None

Technical Notes

  • Add column_calculations?: Record<string, string> to DatabaseViewConfig in src/lib/types.ts (maps property ID → calculation type)
  • Create src/lib/database-calculations.ts with pure functions: calculateColumnSummary(rows, propertyId, calculationType, propertyType) — returns formatted string
  • Render the summary row outside the virtualized container in table-view.tsx, below the scrollable area, using the same CSS grid template as data rows
  • Use handleViewConfigChange to persist calculation selections (same pattern as column_widths, row_height)
  • The summary row should use position: sticky; bottom: 0 or be placed after the scroll container
  • Use a DropdownMenu for the calculation picker, grouped by category (Common, Number-specific, etc.)
  • Reference .agents/conventions.md for component patterns and .agents/design.md for visual styling

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with src/lib/types.ts, src/lib/database-calculations.ts, and table-view.tsx, then review .agents/conventions.md and .agents/design.md. Run the existing checks with pnpm lint && pnpm typecheck && pnpm test; the work is done when the summary row, persistence, live updates, Storybook stories, and specified E2E flow meet the acceptance criteria.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
database, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.