Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

[Feat]: Data grid: "Jump to column" quick picker

Closed
  • Is something wrong?
#871 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

A pull request for this has already been merged.

  • #954 by @vivekyarra — merged

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
68/100
Issue type
Feature
Clarity
Clearly specified
Activity status
Active
Tech stack
react, typescript
Domain
frontend

Research direction

Start with src/config/shortcuts.json, src/utils/fuzzy.ts, and src/components/ui/DataGrid.tsx; read .rules/modals.md and .rules/accessibility.md before designing the picker. Check how Settings → Keyboard Shortcuts and src/i18n/locales/ handle rebindable shortcuts and translated UI strings. Done means the active grid can be searched and focused by keyboard, Escape restores grid focus, and lint, typecheck, and tests pass.

Written by the indexing model from the issue text.

Description

feature request help wanted
🚀 Feature Proposal

Add a Jump to column picker for the data grid: a shortcut opens a fuzzy search over the columns (with their types); choosing one scrolls the grid to that column and focuses it.

Motivation

Tables with dozens of columns require a lot of horizontal scrolling to find a single field.

Where to start
  • src/config/shortcuts.json: add a jump_to_column entry in the data grid group (for example Mod+Shift+J).
  • Build a small picker following .rules/modals.md and .rules/accessibility.md.
  • Reuse fuzzyFilter from src/utils/fuzzy.ts and the column type map already in src/components/ui/DataGrid.tsx.
  • On select, set the focused cell to that column and call scrollIntoView({ inline: "center" }) on the matching td[data-col-index].
Acceptance criteria
  • The shortcut works only when a data grid is active.
  • Fuzzy matching on column names, with the type shown next to each name.
  • Enter scrolls to and focuses the column; Escape closes and returns focus to the grid.
  • Fully keyboard accessible.
  • The shortcut is listed and rebindable in Settings → Keyboard Shortcuts.
Contributor notes
  • Follow the repo rules in .rules/ (TypeScript, React, design tokens, accessibility, testing).
  • Any new UI string needs a key in every locale under src/i18n/locales/.
  • Run pnpm lint, pnpm typecheck and pnpm test before opening the PR.
  • Questions? Ask here or on Discord.
Dominant language
TypeScript
Stars
5.1k
Forks
335
Avg merge
1d 3h
Merged PRs (30d)
224

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.