♻️ refactor(command palette): make common custom hook for Table and Column options

[tnyo43]

Issue

• resolve: ✨ feat(command palette): support Column options #3732 (comment)

Why is this change needed?

As I mentioned in #3732 (comment), TableOptions component and TableColumnOptions component shares the same logics. This PR will create useTableOptionSelect custom hook by extracting the logics to make the implementation simpler.

I forgot to add tests for TableColumnOptions component in #3732, so I added it before touching its codes to avoid regressions.

Summary by CodeRabbit

• Refactor

  • Centralized table/column selection logic in the Command Palette to streamline behavior.
  • Standardized mouse and keyboard interactions (click, Enter, Meta/Ctrl+Enter), including opening in a new tab and updating column hashes.
  • No visual or structural UI changes.

• Tests

  • Added comprehensive tests covering Command Palette table/column options: rendering, click behavior, keyboard behavior, navigation, and dialog state.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
liam-app	Ready	Preview	Comment	Oct 11, 2025 2:20am
liam-assets	Ready	Preview	Comment	Oct 11, 2025 2:20am
liam-erd-sample	Ready	Preview	Comment	Oct 11, 2025 2:20am
liam-storybook	Ready	Preview	Comment	Oct 11, 2025 2:20am

1 Skipped Deployment

Project	Deployment	Preview	Comments	Updated (UTC)
liam-docs	Ignored	Preview		Oct 11, 2025 2:20am

[giselles-ai]

Finished running flow.

Step	Status	Updated(UTC)
1	✅	Oct 11, 2025 2:10am
2	✅	Oct 11, 2025 2:11am
3	✅	Oct 11, 2025 2:11am

[supabase]

Updates to Preview Branch (refact/table-options-common-logic) ↗︎

Deployments	Status	Updated
Database	✅	Sat, 11 Oct 2025 02:12:54 UTC
Services	✅	Sat, 11 Oct 2025 02:12:54 UTC
APIs	✅	Sat, 11 Oct 2025 02:12:54 UTC

Tasks are run on every commit but only new migration files are pushed.
Close and reopen this PR if you want to apply changes from existing seed or migration files.

Tasks	Status	Updated
Configurations	✅	Sat, 11 Oct 2025 02:12:54 UTC
Migrations	✅	Sat, 11 Oct 2025 02:12:54 UTC
Seeding	✅	Sat, 11 Oct 2025 02:12:54 UTC
Edge Functions	✅	Sat, 11 Oct 2025 02:12:55 UTC

---

View logs for this Workflow Run ↗︎.
Learn more about Supabase for Git ↗︎.

[coderabbitai]

Walkthrough

Introduces useTableOptionSelect hook to centralize table/column selection, click, and Enter/Meta+Enter behavior in the ERD Command Palette. Refactors TableOptions and TableColumnOptions to use the hook. Adds dedicated test suites for the hook and TableColumnOptions. No production logic added beyond the new hook and integration.

Changes

Cohort / File(s)	Summary
Hook introduction frontend/packages/erd-core/src/features/erd/components/ERDRenderer/CommandPalette/CommandPaletteOptions/hooks/useTableOptionSelect.ts	New hook handling selection/navigation for table and column suggestions; provides optionSelectHandler and keyboard Enter/Meta+Enter handling; integrates with useCommandPaletteOrThrow and useTableSelection.
Component refactor to hook .../CommandPaletteOptions/TableOptions.tsx, .../CommandPaletteOptions/TableColumnOptions.tsx	Removed in-component navigation and Enter-key logic; delegated click/keyboard behavior to useTableOptionSelect; simplified handlers.
Tests: hook .../CommandPaletteOptions/hooks/useTableOptionSelect.test.tsx	Added tests covering Enter and Meta+Enter for table/column/non-table suggestions and click handler behaviors, including window.open and dialog close interactions.
Tests: component .../CommandPaletteOptions/TableColumnOptions.test.tsx	New tests validating rendering and interactions for table/column options, including cmd-click behavior, hash updates, selection, and dialog state changes.

Sequence Diagram(s)

sequenceDiagram
  autonumber
  participant U as User
  participant CP as CommandPalette (UI)
  participant H as useTableOptionSelect (hook)
  participant TS as useTableSelection
  participant W as Window/Location

  rect rgb(245,248,255)
    note right of H: New centralized flow
    U->>CP: Click or Enter on suggestion
    CP->>H: optionSelectHandler / key handler
    alt Meta/Ctrl pressed
      H->>W: window.open(ERD link)
      H->>CP: setOpen(false)
    else No modifier
      H->>TS: selectTable(tableId, displayArea='main')
      opt Column suggestion
        H->>W: update location.hash (#table__columns__column)
      end
      H->>CP: setOpen(false)
    end
  end

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

• ✨ feat(command palette): support ⌘ + click to open selected table in new tab #2387 — Also modifies Command Palette Meta/Cmd open-in-new-tab behavior; aligns with centralized handling in this PR.
• ✨ feat(command palette): support Column options #3732 — Introduced/modified TableColumnOptions and related types; this PR refactors its selection logic to the new hook.
• ♻️ refact(command palette): add unsafe hook to easy to use #3171 — Exposes useCommandPaletteOrThrow used by the new hook in this PR.

Suggested labels

Review effort 3/5

Suggested reviewers

• junkisai
• NoritakaIkeda
• sasamuku
• MH4GF

Poem

A hop, a tap, a gentle Enter key—
I bound through tables, columns, happily.
One hook to guide my paws so deft,
The palette shuts, the right turn left.
With ⌘ I open skies anew,
Carrot-links bloom—ERD in view! 🥕✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title Check	✅ Passed	The title clearly summarizes the primary change—refactoring the command palette to extract a common hook for table and column options—using concise conventional commit formatting without irrelevant details.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.
Description Check	✅ Passed	The pull request description follows the repository template by specifying the Issue section with a resolve link and providing a clear Why is this change needed section that explains extracting shared logic into a new hook and adding tests to prevent regressions.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch refact/table-options-common-logic

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[giselles-ai]

Check changeset necessity

Status: NOT REQUIRED

Reason:

• Affects only @liam-hq/erd-core; no other target packages are modified.
• Refactor: extracted shared hook (useTableOptionSelect) and updated components to use it; no user-facing behavior changes.
• Added/updated tests (TableColumnOptions.test.tsx, useTableOptionSelect.test.tsx); these are non-user-facing.
• No new features, bug fixes, API/CLI changes, or UI changes introduced.

Changeset (copy & paste):

# No changeset required for this PR.

[MH4GF]

Nice refactoring!!