fixes `UseInfiniteQuery` so it recreates when query inputs change
the previous prop change check compared values to themselves so the hook
could keep stale paginated state
after table columns page size or trailing query changed
- closes https://github.com/supabase/supabase/issues/37750
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added an optional trailingQueryKey prop to the infinite-query hook to
better control when its internal store is refreshed.
* **Bug Fixes**
* Pagination now reliably uses the latest trailing query and avoids
inconsistent state during initial load and subsequent pages.
* **Refactor**
* Reworked store lifecycle and initialization for the infinite-query
hook to reduce unnecessary recreations, streamline startup, and improve
performance and stability.
<!-- 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?
Feature, docs update
## What is the new behavior?
This PR introduces a new `RealtimeFlow` component and hook to the UI
library for building collaborative React Flow with Supabase Realtime:
- keeps nodes and edges in sync across multiple connected clients in
real time
- uses Yjs with `@supabase-labs/y-supabase` to propagate flow updates
- supports optional persistence, so a flow can be restored from
previously saved shared state
## Additional context
https://github.com/user-attachments/assets/90d3a381-6f9c-427f-a493-5d91c2141462
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Collaborative "Realtime Flow" diagram editor with syncing overlays and
a dual-view demo component
* Interactive demo page and registry example for live editing
(add/remove/rename nodes)
* Framework-ready registry packages for Next.js, React, React Router,
and TanStack
* **Documentation**
* Comprehensive docs added for Next.js, React, React Router, and
TanStack (usage, persistence, hook API)
* **Chores**
* Added runtime dependency for the flow component package
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/44273)
<!-- 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?
Adds a new Realtime Monaco component to the UI Library, enabling
collaborative code editing with Supabase Realtime synchronization using
Monaco Editor and Yjs.
## Additional context
This is WIP and used for discuss further changes to the y-supabase
provider.
## Demo
https://github.com/user-attachments/assets/84a761e5-73bb-478e-979a-682121ffee89
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Release Notes
* **New Features**
* Added a new Realtime Monaco collaborative code editor component with
real-time synchronization support across multiple frameworks (Next.js,
React, React Router, Tanstack).
* **Documentation**
* Added comprehensive documentation and usage guides for the Realtime
Monaco component across all supported frameworks.
* **Dependencies**
* Added Monaco editor, Yjs, y-monaco, and Supabase collaboration
packages.
<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
This PR fixes some prettier issues:
- Bump and unify all prettier versions to 3.7.3 across teh whole repo
- Bump the SQL prettier plugin
- When running `test:prettier`, check `mdx` files also
- Run the new prettier format on all files
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
This PR updates the TanStack blocks to the latest versions of their
libs. There were some minor renames in the functions. Everything should
work the same.
How to test:
1. Install the block for password-based auth and social auth
2. Follow the instructions from
https://supabase.com/ui/docs/tanstack/password-based-auth
Also fixes
https://github.com/supabase/supabase/security/dependabot/2674.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Updated @tanstack/react-router and @tanstack/react-start to v1.150.0,
bringing latest improvements and stability enhancements.
* Refactored internal server-side utilities to align with updated
library APIs, improving code maintainability without affecting user
experience.
* Added development dependency for build tooling support.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Sorted all imports in all packages, `cms`, `design-system` and
`ui-library` apps by running `pnpm format` on them.
All changes in this PR are done by the script.
* add ts any checks
* fix linting issues
* updated more file rules
* updated runtime files
* updated turbo to remove lints
* removed eslint and reference from next
* Revert the pnpm lock to the one from master.
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* fix(ui library): fix presence room to clear stack on subscription error
* fix(ui library): fix realtime chat on subscription error
* feat(ui library): improve realtime cursors joining, leaving and disconnecting
Presence is used now to react to cursors joining and leaving.
* When a cursor joins all the other cursors broadcast their last
position (if available). This avoids an empty page when joining if cursors are not
moving
* When a cursor leaves the room their respective cursor is removed
And finally the cursor position is broadcasted only the channel is
successfully subscribed. Otherwise it might try to send POST requests to
broadcast outside the websocket
* chore(ui library): update registry & llms
* chore: prettier
* fix(ui-library): fix missing username on cursor
* chore(ui-library): npm run build
* feat: update @supabase/*-js libraries to v2.74.0
* Use catalog supabase/supabase-js in all apps/packages.
* Bump supabase/ssr to 0.7.0.
* Fix edge cases for the infinite query hook.
* Remove extra packages, they're covered under the next rule.
---------
Co-authored-by: mandarini <6603745+mandarini@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* Search and replace all mentions of SUPABASE_ANON_KEY.
* Copy over some comments from the nextjs template.
* Bump shadcn version.
* Change the building of the blocks to append envVars and docs.
* Use the new envVars property in the clients.
* Rebuild all blocks.
* Fix the wording.
* Update the docs.
* docs(ui-library): fix oauth example code to use exchangeCodeForSession
* Build the registry item for social auth tanstack.
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* infinite list
* infinite list block
* registration
* add missing supportedFrameworks
* Add tables to the supabase project. Generate the types for it.
* Refactor the infinite list query to be just a hook.
* Clean up the block. Add comments.
* Regenerate the registry.
* Fix the docs, the block is not framework-dependent.
* Set the package versions to * to be defined by other packages.
* Minor fixes to the block.
* Fix the examples.
* Fix the docs for the new hook.
* Fix the demo.
* Add more migrations to the db.
* Fix various issues with the query. Rewrote it to useSyncExternalStore.
* Fix the SSR for the hook.
* More fixes.
* Try initializing the store in a useEffect.
* Fix the pnpm-lock file.
* Minor fixes in the docs.
* Put the infinite list under a reusable components section.
* Update apps/ui-library/registry/default/blocks/infinite-query-hook/hooks/use-infinite-query.ts
* Change the example DB to use todos.
* Update the docs to be about Todos quickstart.
* List edits
* Fix link
* Regenerate the registry.
* Add query hook to the landing page.
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
Co-authored-by: Terry Sutton <saltcod@gmail.com>
* Add social login block.
* Regen the registry.
* Fix the nextjs social auth.
* Add social auth blocks for RR, Tanstack and React.
* Minor fixes.
* Add docs.
* Update the docs.
* Minor fixes to the blocks.
* Update the docs.
* Fix various doc issues.
* Fix the redirect in the password-based auth.
* Fix note about supabase clients in docs.
* Use with instead of assert in the registry imports.
* Update all auth blocks to use /protected.
* Update all docs for the password-based auth.
* Add new label to social auth.
* Fix docs issues.
* Light mode fix
* Smol fixes
* Fix the origin in the login route.
* Add social auth to the landing page.
* Regenerate the registry.
---------
Co-authored-by: Terry Sutton <saltcod@gmail.com>
* add throttled callback to cursor hook
* Simplify some parts, add a different kind of throttle.
* Fix the transition duration.
* Update the realtime cursor blocks.
* add docs for smoother cursors
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* add realtime chat
* yolo
* clean up avatar references, leaving those out
* allow to pass messages and receive message change state
* add more names to reduce prob of same name popping up int he example
* update registry, add nextjs docs
* add more usage examples
* Minor changes on the realtime chat component.
* Regenerate the registry.
* docs
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* Change the destinations for next auth routes.
* Change the folder definition to /auth.
* Fix wrong docs.
* More fixes.
* Fix the redirect url to include the base path.
* Minor fixes to the other auth blocks.
* Fix example URLs. Remove some extra code.
* Minor fixes for the avatar stack demo.
* More fixes.
* Add rr auth block
* Fix file structure
* Update components with new flow
* Fix the registry item for react router auth.
* Update the forgot-password for react router.
* Fix the rest of the link imports.
* Fix the react route client.
* Refactor the auth block for React Router.
* Add config for recovery mail to the ui library supabase config.
* snapshot.
* Minor fixes.
* Minor doc fixes.
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* Fix the v0 button. Add some more docs. (+13 squashed commits)
Squashed commits:
[cc5954779e] Add success state to the forgot-password form.
[258bfb1015] Simplify the tanstack auth block.
[1ba5c223d9] Add missing pages to the nextjs auth.
[b842e4acec] Fix the env vars in the React client.
[2a2bcc5356] Fix the command URL.
[a26a2d36c2] Add a tanstack block for password-based auth.
[d68881f0d5] Fix the tanstack client.
[1fd2e16d96] Add missing deps to satisfy TS build.
[9797d745df] Various fixes.
[3e9b676e99] Fix the registryBlock component.
[540a5d600b] Set the supabase project for testing.
[3eba892c92] Regenerate the llms.txt file.
[bf526a0ecb] Regenerate the registry files.
* Add current user avatar.
* Add RealtimeAvatarStack.
* Use the fields which are populated by Auth.
* Regenerate the registry files.
* Fix the imports.
* Rebuild the registry files. Add a github login to the supabase config.
* Minor fixes for the components.
* Minor fix to the avatar stack.
* Remove peekCode, show showCode prop to component preview.
* Add examples for avatar stack and current user avatar.
* Use the new generatenames function in the cursors.
* Add documentation for avatar stack and avatar.
* Switch the profile images.
* Fix a type error.
* More fixes.
* init
* Update component-preview.tsx
* please note: changed redirects in block, so need to update the logic to find and replace the redirects
* Fix the redirect urls to work when installing and in examples.
* Revert some of the changes.
* Add a step when building the registry to clean the registry of example code.
* Fix the clean registry script.
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* Update dropzone component for UI Library
* Replace text-foreground-light with text-muted-foreground (standard var in shadcn). Refactor isSuccess to be a memoized value.
* Revert the shadcn button to the original.
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* Regenerate the registry files.
* Regenerate the llms.txt file.
* Set the supabase project for testing.
* Fix the registryBlock component.
* Various fixes.
* Add missing deps to satisfy TS build.
* Fix the tanstack client.
* Add a tanstack block for password-based auth.
* Fix the command URL.
* Fix the env vars in the React client.
* Add missing pages to the nextjs auth.
* Simplify the tanstack auth block.
* Add success state to the forgot-password form.
* Fix the v0 button. Add some more docs.
* Revert some changes.
* Copy the design-system app into a new one for ui-library.
* Remove unneeded content.
* Add supabase config.
* Cleanup the css.
* Add bunch of packages.
* Cleanup the registry.
* Regenerate the registry.
* Add needed components for documenting components.
* Add the pages for the components.
* Fix the RegistryBlock.
* Various fixes.
* Add a turbo definition for ui-library.
* Rename Remix to React Router.
* Reorder the pages for all frameworks.
* Remove the bottom pager.
* Fix the pages and command menu.
* Various fixes.
* Minor fixes.
* Add ai editor rules.
* Various fixes.
* Add local supabase env vars.
* Try to fix a package error.
* Bunch of various fixes.
* Fix lint errors.
Vaibhav
