## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## What kind of change does this PR introduce?
Added a small shortcut to make it easier to switch schemas in the table
editor
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a keyboard shortcut (S+S) to open the schema selector in the
table editor for faster navigation and accessibility.
* Schema selector now supports keyboard/shortcut-driven control and
tooltip guidance.
* Selector automatically closes when a schema is chosen or after
creating a new schema.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## What kind of change does this PR introduce?
Right now material views and views don't have any options on the context
menu, they only have a copy name. This adds copy schema, export CSV,
export SQL and delete table to that list
Added E2E tests to cover the use cases
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Delete views and materialized views via confirmation dialogs with
optional cascade
* Copy SQL definitions for views and materialized views
* Export views and materialized views as CSV and SQL from the entity
menu
* Confirmation modals now show dependency warnings and cascade toggle
consistently
* **Tests**
* End-to-end tests covering copy, export, and delete flows for views and
materialized views in the table editor
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46383?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Studio is on `react@^19.2.6`, and `useEffectEvent` shipped stable in
React 19.2 with the same signature as the userland polyfill. This drops
the local hook in `apps/studio` and `apps/www` in favor of the built-in.
**Removed:**
- `apps/studio/hooks/useStaticEffectEvent.ts`
- `apps/www/hooks/useStaticEffectEvent.ts`
- `.claude/skills/use-static-effect-event/` — skill is obsolete
**Changed:**
- 26 call sites: dropped the `useStaticEffectEvent` import, added
`useEffectEvent` to the existing `react` import, renamed call sites
- `.claude/CLAUDE.md`: `apps/studio` row updated React 18 → React 19
- `.claude/skills/vercel-composition-patterns/SKILL.md`: removed stale
"Studio uses React 18, skip these patterns" warning
## To test
- `pnpm typecheck --filter=studio` — passes locally
- `pnpm typecheck --filter=www` — passes locally
- `grep -rn "useStaticEffectEvent"` returns nothing outside
`node_modules`
- Smoke-test areas that use the hook: schema visualizer edges
(intersection check), spreadsheet import, sign-in/CLI login flows, side
panels with unsaved-changes prompts
**Out of scope:** pre-existing Tailwind lint warning on
`DefaultEdge.tsx:141` (`outline` + `outline-1` conflict) — unrelated to
this migration
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Internal event handling migrated to React’s built-in event hooks
across the Studio app; no user-facing changes.
* **Documentation**
* Clarified React 19 compatibility and noted Studio now targets React
19.
* Removed obsolete documentation for a deprecated internal hook.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46415?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
## Context
There's an issue with copying / exporting rows from the table editor
with the following conditions:
- Row has a column value that exceeds 10,240 and hence is truncated for
performance reasons
<img width="300" alt="image"
src="https://github.com/user-attachments/assets/4639edbb-ece6-4028-89b6-769ac314c3f3"
/>
- User is trying to copy/export selected rows (not all rows in the
table)
<img width="300" alt="image"
src="https://github.com/user-attachments/assets/e7c0da77-051c-4c46-af0d-f9510e0b37c4"
/>
The copy/export action will return the truncated data which is incorrect
(Should return the full data)
## Problem
This is happening as if we're only copying/exporting selected rows,
we're just using what's been loaded in the table editor to export (as
opposed to if the user is copying/exporting all rows in the table, we'd
be fetching the data from the database first before doing so)
Hence am opting to add a data hydration logic, such that if there's a
selected row that's been truncated, we'd fetch them on demand first
before copying/exporting.
There's limitations to this though - e.g if the table doesn't have a
primary key we can't do this (since we need to run a query to fetch the
data). This is already an existing behaviour when trying to load the
column value in the table editor in the grid so no issues I believe.
We'll just show this toast:
<img width="300" alt="image"
src="https://github.com/user-attachments/assets/442637bb-4b9b-492d-b202-bbf6e5ae7512"
/>
## To test
You'll need a column with a really large value - the way I do it is to
load the data directly into the DB via TablePlus
- [ ] Verify that copying / exporting selected rows with really large
column values copies/exports all the data correctly (there shouldn't be
any truncated value)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Improved handling of truncated cell values during copy and export
operations
* **Bug Fixes**
* Copy and export operations now require an active project selection
* Fixed data export for tables without primary keys
* **Style**
* Updated grid header copy and export control layout
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46268?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Chore. Rename / UX copy update in Studio's SQL Editor.
## What is the current behavior?
The SQL Editor sidebar has a **Community** section containing two pages:
- **Templates**: reusable SQL snippets for common tasks
- **Quickstarts**: end-to-end examples and starter projects
The section label "Community" is misleading because these are
first-party presets maintained by the Supabase team, not
user-contributed content. "Quickstarts" also doesn't clearly convey
"end-to-end example".
## What is the new behavior?
- **Community** → **Reference** (sidebar section header)
- **Quickstarts** → **Examples** (route: `/sql/quickstarts` →
`/sql/examples`)
- Templates keeps its name and route (`/sql/templates`), description
updated to "Reusable SQL snippets for common tasks"
Taxonomy:
- **Templates** = reusable SQL patterns you adapt
- **Examples** = end-to-end walkthroughs you run as-is
A permanent redirect is added so `/sql/quickstarts` gracefully forwards
to `/sql/examples`. The existing `/sql/templates` route is unchanged.
| Before | After |
| --- | --- |
| <img width="1024" height="759" alt="Quickstarts SQL Editor Pickles
Pantry Supabase-644881A5-6396-43AA-9AC4-61FFFFF18831"
src="https://github.com/user-attachments/assets/ff876c78-c499-4bac-b1ae-91e31817511d"
/> | <img width="1024" height="759" alt="Examples SQL Editor Pickles
Pantry Supabase-573775FA-E38F-4F8D-92E3-114237410C36"
src="https://github.com/user-attachments/assets/bdb8910f-94e9-4c21-bb3a-f6513008d8bc"
/> |
## Additional context
- `CommunitySnippetsSection.tsx`: header label + route keys updated; the
underlying `community` localStorage key is intentionally unchanged to
avoid resetting stored collapsed/expanded state for existing users.
- ESLint rule baselines and a docs troubleshooting link updated to
reflect the new filenames/routes.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Documentation**
* Updated troubleshooting guide to reference the correct SQL examples
location.
* **New Features**
* Renamed "Quickstarts" to "Examples" throughout the SQL editor for
improved clarity.
* Updated SQL template and examples section descriptions and labels to
better reflect their purpose.
* Reorganized SQL editor navigation to streamline access to templates
and examples.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46241?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
## Problem
The `_Shadcn_` suffix isn't needed anymore on label component
## Solution
Remove it. No other changes
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Standardized Label usage across the codebase by removing the legacy
alias and using the direct Label export from the UI package
consistently.
* **Documentation**
* Updated component examples and docs to use the standardized Label
component in usage snippets and demos.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45986)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
We have multiple Popover components
## Solution
- [x] migrate Popover usages to Shadcn components
- Migrated JSON and text editor in the `TableEditor` (inline row
edition)
- Migrated the template popover in the logs explorer templates page
- [x] remove `_Shadcn_` suffix from Popover components (renaming +
prettier)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Unified popover implementation across the app and design system;
dropdowns, calendars, menus and tooltips now use a consistent popover
API with no visual or interaction changes.
* **Chores**
* Minor prop typing update for the logs date-picker to align with the
consolidated popover content type.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45980)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.
---------
Co-authored-by: Jordi Enric <jordi.err@gmail.com>
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## What kind of change does this PR introduce?
Feature — a set of new keyboard shortcuts for the table editor, along
with infrastructure to register, gate, and surface them.
## What is the current behavior?
Clicking into the grid "traps" the keyboard: Escape doesn't pop out,
there are no shortcuts for row selection / deletion / navigation, and
the search-tables input grabs focus on page load.
## What is the new behavior?
### New shortcuts (all scoped to the table editor)
| Keybind | Action | Surface |
|---|---|---|
| `Esc` | Exit grid selection — clears the highlighted cell and drops
focus back to the page | hotkey |
| `↑` / `↓` | Start grid navigation from the first cell when no cell is
selected | hotkey |
| `Shift+Space` | Toggle selection on the current row | hotkey +
checkbox tooltip |
| `Mod+A` | Toggle selection on all displayed rows (matches Excel) |
hotkey + header-checkbox tooltip + Cmd+K |
| `Mod+Shift+A` | Toggle selection on all rows in the table | hotkey +
"Select all rows in table" button tooltip + Cmd+K |
| `Mod+Backspace` | Delete selected rows | hotkey + delete-button
tooltip + Cmd+K |
### Infrastructure
- **Split registry** — table-editor shortcuts moved to
`state/shortcuts/registry/table-editor.ts`, spread into `SHORTCUT_IDS`.
Makes it easy to scope a runtime check to a specific surface.
- **`eventMatchesAnyShortcut`** (`state/shortcuts/matchEvent.ts`) —
queries the hotkey library's live `SequenceManager` so gated shortcuts
(`enabled: false`) are correctly excluded. Covered by
`matchEvent.test.ts`.
- **`handleCellKeyDown`** now calls `event.preventGridDefault()`
whenever the keystroke matches an active table-editor shortcut, so rdg's
"start editing on key press" default doesn't compete with shortcut
actions (e.g. typing `Shift+X` no longer opens edit mode with `X` as
input).
- **`<Shortcut>` / `<ShortcutTooltip>`** used on the header checkbox,
the per-row checkbox, the "Select all rows in table" button, and the
delete button — keybinds show up on hover (Linear-style) so users can
discover them without reading docs.
- **CSS** — `.rdg:not(:focus-within) .rdg-cell[aria-selected='true']`
drops the selected-cell outline whenever focus leaves the grid,
reinforcing the "you're out" feedback after `Esc`.
- **`useShortcut`** wraps the Cmd+K-registered action to close the
command menu after firing (previously menu stayed open after selecting
an action).
- **Search-tables input** no longer auto-focuses on load, so arrow
shortcuts work immediately without clicking out first.
## Additional context
Linear: FE-3057
### Test plan
- [x] Open any table → `↓` selects the first cell; subsequent arrows
navigate rows
- [x] `Esc` drops focus out of the grid and re-enables `↓` to re-enter
- [x] Click a cell → `Shift+Space` toggles that row's selection
(checkbox)
- [x] `Mod+A` toggles all displayed rows
- [x] With pagination + some rows selected → `Mod+Shift+A` toggles
"Select all rows in table"
- [x] With rows selected → `Mod+Backspace` deletes them (existing
confirmation flow)
- [x] Hover the header checkbox / per-row checkbox / delete button →
keybind tooltip after ~500ms
- [x] Cmd+K with selection → the relevant action shows up; selecting it
closes the palette and runs
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added table editor keyboard shortcuts for navigation, row selection,
and cell actions, with command-menu integration and visible shortcut
tooltips.
* **Improvements**
* Better keyboard handling in grid cells allowing external shortcuts to
override default behavior.
* Select-all/deselect-all toggle and improved select-row UX;
selected-cell styling no longer shows when grid loses focus.
* Command menu now reliably closes before executing shortcut actions.
* Removed autofocus on the table editor search input for consistent
focus behavior.
* **Tests**
* Added unit tests covering shortcut matching and command-menu shortcut
behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This PR preps the monorepo for a migration to Tailwind v4:
- Bump all Tailwind dependencies and libraries to the latest possible
version, while still compatible with Tailwind 3.
- Cleans up obsolete Tailwind 3 specific options and configs.
- Cleans up unused CSS files and fixes the CSS imports.
- Migrates all `important` uses in `@apply` lines to using the `!`
prefix.
- Move `typography.css` to the `config` package and import it from the
apps.
- Migrated all occurrences of `flex-grow`, `flex-shrink`,
`overflow-clip` and `overflow-ellipsis` since they're deprecated and
will be removed in Tailwind 4.
- Make the default theme object typesafe in the `ui` package.
- Migrate all `bg-opacity`, `border-opacity`, `ring-opacity` and
`divider-opacity` to the new format where they're declared as part of
the property color.
- Bump and unify all imports of `postcss` dependency.
## Problem
With #45211 and #45218 merged, we don't need the `_Shadcn_` suffix
anymore
## Solution
- [x] Remove the `_Shadcn_` suffix
- [x] Update exports and imports
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Standardized UI component exports by removing legacy naming
conventions and providing direct imports for checkbox and radio group
components throughout the design system.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## What kind of change does this PR introduce?
- Remove queue operations from feature preview into settings
- Refactor dashboard settings
- Resolves DEPR-434
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Dashboard settings panel in Account preferences with toggles for
Inline Editor and Queue Operations; “Dashboard” added to project
Configuration.
* **Removed**
* Old Inline Editor settings UI and the Queue Operations feature-preview
UI removed.
* **Refactor**
* Consolidated dashboard preferences into a single settings surface;
banners and actions now navigate to preferences; account/preferences
layouts and back-navigation behavior adjusted for platform vs
self-hosted.
* **Tests**
* Added tests for settings UI, menu generation, redirects, and
local-storage.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
## Context
Similar to how we added a banner for the new table filter bar - mainly
to improve visibility for this feature preview as we'd like some
feedback from usage
<img width="313" height="314" alt="image"
src="https://github.com/user-attachments/assets/4cea6383-483a-42cf-b4a5-bb8c3918c00d"
/>
## Other changes
- Also adding some typing to the `addBanner` and `dismissBanner`
- Removed banner for table editor filter bar
When the dashboard hits a DB connection timeout, users currently see a
raw error message with no
path forward. This PR adds an inline troubleshooting system that detects
known error types and
surfaces contextual next steps — restart the DB, read the docs, or debug
with AI.
## Changes
- New ErrorDisplay component (packages/ui-patterns) — styled error card
with a title, monospace error
block, optional troubleshooting slot, and a "Contact support" link that
always renders. Accepts
typed supportFormParams to pre-fill the support form.
- Error classification in handleError (data/fetchers.ts) — on every API
error, the message is tested
against ERROR_PATTERNS. If matched, handleError throws a typed subclass
(ConnectionTimeoutError
extends ResponseError) instead of a plain ResponseError. Stack traces
now show the exact error
class. All existing instanceof ResponseError checks continue to work.
- ErrorMatcher component — reads errorType from the thrown class
instance, does an O(1) lookup into
ERROR_MAPPINGS, and renders the matching troubleshooting accordion as
children of ErrorDisplay.
Falls back to plain ErrorDisplay for unclassified errors.
- Connection timeout mapping — first error type wired up, with three
troubleshooting steps: restart
the database, link to the docs, and "Debug with AI" (opens the AI
assistant sidebar with a
pre-filled prompt).
- Telemetry — three new typed events track when the troubleshooter is
shown, when accordion steps are
toggled, and which CTAs are clicked.
## Adding a new error type
1. Add a class to types/api-errors.ts
2. Add { pattern, ErrorClass } to data/error-patterns.ts
3. Create a troubleshooting component in errorMappings/
4. Add an entry to error-mappings.tsx
## Context
Part of dashboard scalability project
Opting to use the connection string of the project's read replica (if
available) for read queries on the database.
Trialing with the Table Editor as a first pass - changes involved will
opt to use replica connection string for `useTableRowsQuery`,
`useTableRowsCountQuery`, and `useForeignKeyConstraintsQuery`
There's definitely optimizations to be done for deciding which replica
to use - but am starting off with a rather naive logic to prioritize
replicas in the same region as the project.
## Changes involved
- We're no longer passing `connectionString` as a param into the
affected hooks, the `connectionString` is derived from within those
hooks instead
- Change is feature flagged, so things should be status quo if flag is
off (use primary database's connection string)
- Added `useConnectionStringForReadOps` hook which returns the replica's
connection string if (Otherwise defaults to primary database connection
string)
- Feature flag is on
- Project has a replica available
## To test
- [ ] Verify that the table editor works as expected for a project that
has read replicas (There shouldn't be any change really)
- [ ] Also just double check that updating cells in the table editor
works as well (There's no change there, we're using the primary DB's
connection string for mutation ops)
- [ ] ^ Same thing for a project that doesn't have read replicas
- [ ] ^ Same thing for local / self-host
Cleanup / chore — removing a feature flag that has been at 100% rollout
with no issues.
## What is the current behavior?
The `dataApiExposedBadge` feature flag is checked at runtime via
ConfigCat, even though it has been set to 100% for a while with no
issues.
## What is the new behavior?
The feature flag check is removed and the gated behavior is now
unconditionally enabled. A reminder has been set to delete the flag from
ConfigCat in a month.
## Summary by CodeRabbit
**Refactor**
* Simplified API access status indicators in the studio editor, ensuring
security-related tooltips now display consistently based on actual
access conditions.
* Updated component interfaces and consolidated internal hook
dependencies for improved code maintainability and organization.
Bug fix
## What is the current behavior?
The clipboard copy operation for table schema would show the success
toast before the copy actually completed.
## What is the new behavior?
Move the toast showing to the callback so it appears only after the copy
finishes
## Summary
* **Bug Fixes**
* Clipboard success confirmation now appears reliably after the copy
completes.
* **New Features**
* Copied table schemas are automatically formatted for improved
readability.
* **Improvements**
* Enhanced clipboard behavior for better reliability across browsers.
* fix(studio): schema copy bug in safari
The schema could not be copied to clipboard in Safari because of the
known problem where Safari does not allow awaits to happen before
copyToClipboard. Fixed by passing the promise directly to
copyToClipboard.
* chore(studio): add eslint rule to catch async copyToClipboard
* Apply suggestion from @charislam
* Smol fix
* Clean
* Revert
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* Popover ui component to use portal by default, remove all manual declaration of portal for PopoverContent in dashboard
* Forgot to add ui changes lol
* Clean uop
* feat(studio): add mutation to update table access privileges
Adds a mutation to update table grants for `anon` and `authenticated`
roles.
* feat(studio): add data api toggles
Add toggles to the Table Editor, allowing fine-grained grants to the
anon and authenticated roles.
* fix(studio): don't show rls policies warning if table not exposed
RLS policies warning was showing in Table Editor side panel even if
table was not exposed due to no grants to anon/authenticated.
* fixup! feat(studio): add data api toggles
* fixup! feat(studio): add data api toggles
* fix(studio): revalidate rls lints when table grants are toggled
---------
Co-authored-by: Charis Lam <26616127+charislam@users.noreply.github.com>
* feat(studio): show icon on tables exposed by data api
Show an icon in the Table Editor for tables that are exposed via the
Data API.
* refactor(studio): move table api access query up to parent
* fix(studio): invalidate table privileges query on table create
* fix(studio): make RLS disabled warning on table editor more obvious
Change from warning -> danger
* Only show add foreign key in side panel if isSuccess
* chore(studio): put data api exposed badge behind feature flag
Only show badge for now if flag `dataApiExposedBadge` is enabled.
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* Possible solution with building the URL from local storage.
* Refactor the local storage for tabs to use table ids.
* Fix the saving table state to local storage.
* Minor fixes.
* Open the correct schema when following the link.
* Minor fixes from CodeRabbit.
* Address charis' feedbacks
* Clean
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* Bump the deps, refactor deprecated code.
* Migrate keepPreviousData usage.
* Migrate all uses of InfiniteQuery.
* Fix refetchInterval in queries.
* Migrate all use of isLoading to isPending in mutations.
* Fix accessing location in claim-project.
* Fix a bug in duplicate query keys.
* Migrate all queries to use isPending.
* Revert "Fix accessing location in claim-project."
This reverts commit 2a07df64b5.
* Revert the rss.xml file to master.
Exporting all rows (in CSV, SQL, or JSON format) currently uses offset pagination, which can cause performance problems if the table is large. There is also a correctness problem if the table is being actively updated as the export happens, because the relative row offsets could shift between queries.
Now that composite filters are available in postgres-meta, we can change to using cursor pagination on the primary key (or any non-null unique keys) wherever possible. Where this is not possible, the user will be shown a confirmation dialog explaining the possible performance impact.
---------
Co-authored-by: Ali Waseem <waseema393@gmail.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* refactor(infinite list): use @tanstack/react-virtual for virtualization
Swapping virtualization libraries from `react-window` to
`@tanstack/react-virtual`.
Motivation: we need a completely headless library for maximum
flexibility. `react-window` injects extra DOM elements which makes it
hard to customize styling and placement on elements that are very picky
about their DOM structure, like tables.
* refactor(table editor menu): use new infinite list
* refactor(notifications): use new infinite list
* cleanup(infinite list): remove old infinite list
* refactor(storage menu): use new infinite list & remove react-window deps
* Add table quickstart with templates and AI generation
Implement table quickstart feature with two variants:
- Template-based: Pre-built schemas across multiple categories (social, ecommerce, content, productivity)
- AI-powered: Generate custom table schemas from natural language prompts
Key features:
- Template selector with category tabs and schema previews
- AI generation using gpt-oss-120b via Bedrock for fast response times
- Streaming responses with real-time table generation
- Quick idea chips for common use cases
- Success feedback and seamless integration with table editor
- Feature flag gated (tableQuickstart) with 7-day new project window
- Comprehensive error handling and retry logic
- ARIA labels and accessibility improvements
Technical implementation:
- Custom React hooks for AI generation and state management
- Zod schema validation for type-safe streaming
- API endpoint with structured object streaming
- localStorage-based dismissal state
- Consistent styling with existing UI patterns
* Refactor and optimize AI table generation
Refactor to use AI SDK streaming with structured object generation:
- Use streamObject() with Zod schema validation for type-safe streaming
- Add 50KB buffer limit to prevent memory issues from oversized responses
- Replace custom stream parsing with Object.assign() for efficient merging
- Use fetchHandler utility for consistent error messages across codebase
- Clean up comments and unused code
* Update quickstart widget styling to match action card
- Changed background from bg-surface-75 to bg-surface-100
- Changed hover background to bg-surface-200
- Applied to AI widget, template widget, and quick idea buttons
* Address PR review feedback
- Persist AI results to localStorage so users can create multiple tables from same generation
- Remove unnecessary isMountedRef checks before synchronous state updates
- Change Quick ideas label to semantic h4 element for accessibility
- Add TODO comment about migrating to experimental_useObject() hook
* Clean up table quickstart implementation
- Match SQL Editor ActionCard styling with circular icons
- Implement smart Generate/Regenerate button logic
- Add tooltips for column counts
- Persist prompt to localStorage
- Fix React hook dependency warnings
- Remove debugging artifacts
* Improve stability and explicitness of table editor tab cache <-> url syncing
* fix: maintain filter state when using nav bar to switch back to Table Editor
---------
Co-authored-by: Charis Lam <26616127+charislam@users.noreply.github.com>
* Update perms checking in audit logs
* Deprecate useCheckPermissions, useIsPermissionsLoaded and useCheckProjectPermissions as they're no longer used
* Rename useAsyncCheckProjectPermissions to useAsyncCheckPermissions
* Fix TS
* Wrap up remaining swapping of useCheckPermissions
* remove OrganizationSettingsLayout on billing, team, integrations and usage org pages
* Fix missing loading state in usage page
* Add comments for next step
There is a bug in the Table Editor mobile view:
1. Open the Table Editor in mobile.
2. Open a tab with a table.
3. Use the Table Editor Menu to switch schemas. This switches the schema
in the URL and in local storage, but the Table Editor Menu closes
immediately and you can't see the list of tables in the new schema to
pick.
4. Open the Table Editor Menu again to pick a new table. The schema
automatically flips back to the previous schema, and the Table Editor
Menu only flickers open temporarily before closing again. There is no
way to access the tables for your newly selected schema.
The cause of the bug:
There is a useEffect that triggers every time the Table Editor Menu is
opened in mobile. (It technically has selectedTable?.schema in its
dependency array, but since the menu unmounts and remounts on visibility
toggle, the effect runs regardless of whether global selectedTable state
has changed. That's also why desktop works fine, because the menu is
continuously mounted in desktop view.)
When the useEffect runs, it sets the schema to the schema of the
currently selected table. Therefore, what actually happens:
1. Schema is set to `schema_a`. The currently selected table is
`schema_a.table_a`.
2. User changes schema to `schema_b`.
3. User reopens Table Editor Menu. useEffect runs. Currently selected
table is `schema_a.table_a`, so the schema automatically changes back
to `schema_a`. Menu automatically closes.
The fix:
The actual behavior on desktop right now is probably what we want:
- The selected table is only used to set the schema if no explicit
schema is provided.
- If an explicit schema is provided, the user probably chose it, so we
allow the schema to not match the currently selected table. The table tabs
update to include the table schema anyway if the schema changes, so it should
be somewhat obvious that the schema of the menu and the selected table
don't match.
Therefore, the logic we want is `!!selectedTable?.schema &&
!selectedSchema`. Because of this change, we can also take it out of the
useEffect, which means less circular logic.
that
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* Replace all usage of useProjectContext with useSelectedProjectQuery
* Replace all usage of useSelectedProject with useSelectedProjectQuery
* Replace all usage of useProjectByRef with useProjectByRefQuery
* Replace all usage of useSelectedOrganization with useSelectedOrganizationQuery
* Deprecate useSelectedProject, useSelectedOrganization, and useProjectByRef hooks
* Deprecate ProjecContext
