[Feat]: Transposed grid follow-ups: find scrolling, zebra stripes and an unused helper

Open
  • Is something wrong?
#1,370 2 comments 0 reactions 1 assignee View on GitHub

Maintainers usually reply within 1 day

@Asymtode712 is already working on this.

Since Nov 3, 2026.

  • #1372 by @Asymtode712 — merged

Assessment

This issue has not been assessed yet.

Description

feature request
Prerequisites
  • I have written a descriptive issue title
  • I have searched existing issues to ensure the feature has not already been requested
🚀 Feature Proposal

Small follow-ups to the transposed result grid added in #1357, so it behaves like the normal layout:

  1. Find only scrolls when the match is out of view. When transposed, revealTransposedMatch always calls recordVirtualizer.scrollToIndex(rowIndex, {align: 'center'}), while the normal layout's revealCell (useGridFind.ts) only scrolls when the row is not already visible.
  2. Zebra stripes apply in the transposed layout. DataGridTransposedRow passes isZebra={false} to every cell, so the zebra stripes setting has no effect when transposed.
  3. Remove the unused stepVisibleColumn. Since #1357 it is no longer used in packages/web-ui/src, only in its own tests.
Motivation

With find in the transposed layout, stepping through matches in records that are already on screen recenters the record every time, so the grid jumps sideways at each step. In the normal layout the view stays put until a match leaves it. The zebra stripes setting also silently does nothing when transposed, which looks like a bug to anyone who turned it on.

Example
1. Open a wide table (e.g. crm_demo.customer_360 from the demo) and toggle the transposed layout.
2. Cmd/Ctrl+F and search a value that matches several records visible at the same time.
3. Today: each step recenters the record. Expected: no scroll while the match is visible.
4. Enable zebra stripes in Settings → Appearance → Data Grid.
5. Today: no stripes when transposed. Expected: alternating field rows are striped, as rows are in the normal layout.
Acceptance criteria
  • In the transposed layout, moving to a match whose cell is already fully visible does not scroll; a match outside the view is still brought into view, clear of the sticky record header and a frozen first field.
  • With zebra stripes on, the transposed layout stripes alternating field rows; with the setting off, nothing changes. The normal layout is unchanged.
  • stepVisibleColumn and its tests are removed, and nothing else in src depended on it.
  • Tests cover the transposed find reveal (visible vs. out of view) and zebra stripes in the transposed layout, following .rules/datagrid.md.
Where to start
  • packages/web-ui/src/components/ui/DataGrid.tsx: revealTransposedMatch, passed to useGridFind as revealMatch.
  • packages/web-ui/src/hooks/useGridFind.ts: revealCell and getRevealScrollDelta show the visibility check used by the normal layout.
  • packages/web-ui/src/components/ui/DataGridTransposedRow.tsx: isZebra={false} on DataGridCell; isZebraStripedRow in packages/web-ui/src/utils/dataGrid.ts.
  • packages/web-ui/src/utils/hiddenColumns.ts: stepVisibleColumn, and packages/web-ui/tests/utils/hiddenColumns.test.ts.
Contributor notes
  • Follow the repo rules in .rules/ (Rust, TypeScript, React, design tokens, accessibility, testing), in particular datagrid.md: check both layouts and try the change in the app with the transpose toggle on.
  • Add any new UI strings to every locale under packages/web-ui/src/i18n/locales/.
  • Keep shared backend logic in src-tauri/src/application/ and transport-specific code in the corresponding transport module; preserve the desktop-free build.
  • Run the relevant tests and repository checks (pnpm lint, pnpm build, pnpm test).
  • Questions? Ask here or on Discord.
Dominant language
TypeScript
Stars
5.1k
Forks
335
Avg merge
1d 11h
Merged PRs (30d)
280

Getting set up

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.

More from TabularisDB/tabularis

All issues in TabularisDB/tabularis

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.