feat(desktop): adds indexes and constraints page - #269
Conversation
|
This PR was not deployed automatically as @Rudra-Sankha-Sinhamahapatra does not have access to the Railway project. In order to get automatic PR deploys, please add @Rudra-Sankha-Sinhamahapatra to your workspace on Railway. |
|
@Rudra-Sankha-Sinhamahapatra Great addition. |
There was a problem hiding this comment.
Pull request overview
This PR adds two new database management pages for viewing indexes and constraints across different database systems (PostgreSQL, MySQL, MSSQL, and ClickHouse). The implementation includes sidebar navigation, SQL query generation for each database dialect, and filtering/search capabilities.
Key Changes:
- New pages for browsing database indexes and constraints with schema filtering and search functionality
- SQL query implementations supporting multiple database dialects with appropriate system table queries
- Sidebar navigation updates with new icon-based links for quick access to indexes and constraints
Reviewed changes
Copilot reviewed 12 out of 12 changed files in this pull request and generated 8 comments.
Show a summary per file
| File | Description |
|---|---|
apps/desktop/src/routes/(protected)/_protected/database/-components/database-sidebar.tsx |
Adds navigation links for indexes and constraints pages, applies consistent formatting to className attributes using template literals |
apps/desktop/src/routes/(protected)/_protected/database/$id/indexes/index.tsx |
Implements indexes page with grouping, filtering, and search functionality |
apps/desktop/src/routes/(protected)/_protected/database/$id/constraints/index.tsx |
Implements constraints page with filtering, search, and foreign key reference display |
apps/desktop/src/routeTree.gen.ts |
Auto-generated route tree updates to register new pages |
apps/desktop/src/entities/database/sql/indexes.ts |
SQL query implementations for fetching indexes from PostgreSQL, MySQL, MSSQL, and ClickHouse |
apps/desktop/src/entities/database/queries/indexes.ts |
React Query hooks for indexes data fetching |
apps/desktop/src/entities/database/index.ts |
Exports new indexes query functions |
apps/desktop/src/entities/database/dialects/postgres/schema/indexes.ts |
PostgreSQL system table type definitions for index queries |
apps/desktop/src/entities/database/dialects/postgres/schema/catalog.ts |
Refactors PgNamespace type to shared location |
apps/desktop/src/entities/database/dialects/mysql/schema/indexes.ts |
MySQL information_schema.STATISTICS type definitions |
apps/desktop/src/entities/database/dialects/mssql/schema/indexes.ts |
MSSQL sys.indexes and related system table type definitions |
apps/desktop/src/entities/database/dialects/clickhouse/schema/system.ts |
Exports Columns interface for use in indexes queries |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
@Rudra-Sankha-Sinhamahapatra please add some tabs or buttons, for example if I wanna see only primary keys |
|
Added filters & refresh button @letstri |
…t/index-page refactor: merge with main
Rudra-Sankha-Sinhamahapatra
changed the title
… into feat/index-page
… into feat/index-page
…archInput component
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 31 out of 32 changed files in this pull request and generated 3 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| <button | ||
| type="button" | ||
| className=" | ||
| absolute top-1/2 right-2 -translate-y-1/2 cursor-pointer p-1 | ||
| " | ||
| onClick={onClear} | ||
| > | ||
| <RiCloseLine className="size-4 text-muted-foreground" /> | ||
| </button> |
There was a problem hiding this comment.
The clear button is rendered as an icon-only <button> without an accessible label, so screen readers will not announce its purpose ("clear search") and keyboard users have no textual affordance. Consider adding an aria-label (and optionally title) to describe the action, or rendering visible text alongside the icon, to align this control with accessibility best practices.
| <ScrollArea className="h-full flex-1 rounded-lg border bg-background"> | ||
| <ScrollViewport> | ||
| <div className="mx-auto flex max-w-3xl flex-col px-4 py-6"> | ||
| <Outlet /> | ||
| </div> | ||
| <ScrollBar /> | ||
| </ScrollViewport> |
There was a problem hiding this comment.
ScrollBar is rendered inside ScrollViewport, which diverges from how the shared scroll-area component is used elsewhere (e.g. table/-components/tabs.tsx:342-372 renders ScrollViewport and ScrollBar as siblings under ScrollArea). Nesting the scrollbar inside the viewport can lead to incorrect layout or scrollbar behavior with the underlying @base-ui/react/scroll-area primitives; consider moving <ScrollBar /> to be a sibling of <ScrollViewport> within <ScrollArea> for consistency and correct structure.
| export const connectionStoreType = type({ | ||
| lastOpenedPage: 'string | null' as type.cast<(Extract<keyof FileRoutesById, `/_protected/database/$id/${string}`> | null)>, | ||
| lastOpenedChatId: 'string | null', | ||
| lastOpenedDefinition: '"enums" | "constraints" | "indexes" | null', | ||
| definitionTabs: definitionTabType.array(), | ||
| lastOpenedTable: type({ |
There was a problem hiding this comment.
lastOpenedDefinition and definitionTabs are added to the connection store type but are not read or updated anywhere else in the codebase yet, so they introduce persisted state that is currently unused. If these are intended for a future feature, consider either wiring them into the new definitions UI in this PR or deferring their addition to keep the store schema minimal.
Description of Changes
Added index and constraints page
Closes #18 (If applicable, delete this line if not)
Closes #274
Checklist
Notes to reviewer
Screen.Recording.2025-12-27.at.6.1.mp4
cc: @letstri @geekyharsh05