Merge branch 'main' into feat-server-fn-plugin

# Conflicts: # e2e/create-start/package.json # e2e/start/basic/tests/base.spec.ts # examples/react/authenticated-routes/package.json # examples/react/basic-default-search-params/package.json # examples/react/basic-file-based-codesplitting/package.json # examples/react/basic-file-based/package.json # examples/react/basic-react-query-file-based/package.json # examples/react/basic-react-query/package.json # examples/react/basic-ssr-file-based/package.json # examples/react/basic-ssr-streaming-file-based/package.json # examples/react/basic-virtual-file-based/package.json # examples/react/basic-virtual-inside-file-based/package.json # examples/react/basic/package.json # examples/react/deferred-data/package.json # examples/react/kitchen-sink-file-based/package.json # examples/react/kitchen-sink-react-query-file-based/package.json # examples/react/kitchen-sink-react-query/package.json # examples/react/kitchen-sink/package.json # examples/react/large-file-based/package.json # examples/react/location-masking/package.json # examples/react/navigation-blocking/package.json # examples/react/quickstart-esbuild-file-based/package.json # examples/react/quickstart-file-based/package.json # examples/react/quickstart-rspack-file-based/package.json # examples/react/quickstart-webpack-file-based/package.json # examples/react/quickstart/package.json # examples/react/router-monorepo-react-query/package.json # examples/react/router-monorepo-react-query/packages/app/package.json # examples/react/router-monorepo-react-query/packages/router/package.json # examples/react/router-monorepo-simple/package.json # examples/react/router-monorepo-simple/packages/app/package.json # examples/react/router-monorepo-simple/packages/router/package.json # examples/react/scroll-restoration/package.json # examples/react/search-validator-adapters/package.json # examples/react/start-basic-auth/package.json # examples/react/start-basic-react-query/package.json # examples/react/start-basic-rsc/package.json # examples/react/start-basic/package.json # examples/react/start-clerk-basic/package.json # examples/react/start-convex-trellaux/package.json # examples/react/start-counter/package.json # examples/react/start-large/package.json # examples/react/start-supabase-basic/package.json # examples/react/start-trellaux/package.json # examples/react/with-framer-motion/package.json # examples/react/with-trpc-react-query/package.json # examples/react/with-trpc/package.json # packages/arktype-adapter/package.json # packages/create-router/package.json # packages/create-start/package.json # packages/create-start/src/modules/core/index.ts # packages/react-router-with-query/package.json # packages/react-router/package.json # packages/router-devtools/package.json # packages/start/package.json # packages/valibot-adapter/package.json # packages/zod-adapter/package.json # pnpm-lock.yaml
TanStack · Jan 6, 2025 · cdd1028 · cdd1028
2 parents dd3ab7b + 2088be2
commit cdd1028
Show file tree

Hide file tree

Showing 164 changed files with 4,473 additions and 2,794 deletions.
diff --git a/README.md b/README.md
@@ -30,18 +30,15 @@ Enjoy this library? Try the entire [TanStack](https://tanstack.com)! [React Quer
 
 ## Partners
 
-<div><a href="https://vercel.com?utm_source=tanstack">
-  <img alt="Vercel" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/vercel.svg" height="40"
+<div><a href="https://convex.dev?utm_source=tanstack">
+  <img alt="Convex" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/convex.svg" height="40"
 </a></div><br />
 <div><a href="https://go.clerk.com/wOwHtuJ">
   <img alt="Clerk" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/clerk.svg" height="40"
 </a></div><br />
 <div><a href="https://ag-grid.com/react-data-grid/?utm_source=reacttable&utm_campaign=githubreacttable">
   <img alt="AG Grid" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/ag-grid.svg" height="40"
 </a></div><br />
-<div><a href="https://convex.dev?utm_source=tanstack">
-  <img alt="Convex" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/convex.svg" height="40"
-</a></div><br />
 <div><a href="https://sentry.io?utm_source=tanstack">
   <img alt="Sentry" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/sentry.svg" height="40"
 </a></div><br />

diff --git a/docs/config.json b/docs/config.json
@@ -199,6 +199,18 @@
               "label": "Getting Started",
               "to": "framework/react/start/getting-started"
             },
+            {
+              "label": "Quick Start",
+              "to": "framework/react/start/quick-start"
+            },
+            {
+              "label": "Build from Scratch",
+              "to": "framework/react/start/build-from-scratch"
+            },
+            {
+              "label": "Learn the Basics",
+              "to": "framework/react/start/learn-the-basics"
+            },
             {
               "label": "Server Functions",
               "to": "framework/react/start/server-functions"

diff --git a/docs/framework/react/api/router.md b/docs/framework/react/api/router.md
@@ -35,6 +35,7 @@ title: Router API
 - Hooks
   - [`useAwaited`](./router/useAwaitedHook.md)
   - [`useBlocker`](./router/useBlockerHook.md)
+  - [`useCanGoBack`](./router//useCanGoBack.md)
   - [`useChildMatches`](./router/useChildMatchesHook.md)
   - [`useLinkProps`](./router/useLinkPropsHook.md)
   - [`useLoaderData`](./router/useLoaderDataHook.md)

diff --git a/docs/framework/react/api/router/RouterType.md b/docs/framework/react/api/router/RouterType.md
@@ -139,10 +139,11 @@ Navigates to a new location.
 
 Invalidates route matches by forcing their `beforeLoad` and `load` functions to be called again.
 
-- Type: `(opts?: {filter?: (d: MakeRouteMatchUnion<TRouter>) => boolean}) => Promise<void>`
+- Type: `(opts?: {filter?: (d: MakeRouteMatchUnion<TRouter>) => boolean, sync?: boolean}) => Promise<void>`
 - This is useful any time your loader data might be out of date or stale. For example, if you have a route that displays a list of posts, and you have a loader function that fetches the list of posts from an API, you might want to invalidate the route matches for that route any time a new post is created so that the list of posts is always up-to-date.
 - if `filter` is not supplied, all matches will be invalidated
 - if `filter` is supplied, only matches for which `filter` returns `true` will be invalidated.
+- if `sync` is true, the promise returned by this function will only resolve once all loaders have finished.
 - You might also want to invalidate the Router if you imperatively `reset` the router's `CatchBoundary` to trigger loaders again.
 
 ### `.clearCache` method
@@ -159,7 +160,8 @@ Loads all of the currently matched route matches and resolves when they are all
 
 > ⚠️⚠️⚠️ **`router.load()` respects `route.staleTime` and will not forcefully reload a route match if it is still fresh. If you need to forcefully reload a route match, use `router.invalidate()` instead.**
 
-- Type: `() => Promise<void>`
+- Type: `(opts?: {sync?: boolean}) => Promise<void>`
+- if `sync` is true, the promise returned by this function will only resolve once all loaders have finished.
 - The most common use case for this method is to call it when doing SSR to ensure that all of the critical data for the current route is loaded before attempting to stream or render the application to the client.
 
 ### `.preloadRoute` method

diff --git a/docs/framework/react/api/router/useCanGoBack.md b/docs/framework/react/api/router/useCanGoBack.md
@@ -0,0 +1,40 @@
+---
+id: useCanGoBack
+title: useCanGoBack hook
+---
+
+The `useCanGoBack` hook returns a boolean representing if the router history can safely go back without exiting the application.
+
+> ⚠️ The following new `useCanGoBack` API is currently _experimental_.
+
+## useCanGoBack returns
+
+- If the router history is not at index `0`, `true`.
+- If the router history is at index `0`, `false`.
+
+## Limitations
+
+The router history index is reset after a navigation with [`reloadDocument`](./NavigateOptionsType.md#reloaddocument) set as `true`. This causes the router history to consider the new location as the initial one and will cause `useCanGoBack` to return `false`.
+
+## Examples
+
+### Showing a back button
+
+```tsx
+import { useRouter, useCanGoBack } from '@tanstack/react-router'
+
+function Component() {
+  const router = useRouter()
+  const canGoBack = useCanGoBack()
+
+  return (
+    <div>
+      {canGoBack ? (
+        <button onClick={() => router.history.back()}>Go back</button>
+      ) : null}
+
+      {/* ... */}
+    </div>
+  )
+}
+```