Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions .changeset/fresh-waves-sneeze.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
---
"@clerk/react-router": minor
---

Added `organizationSyncOptions` option to `clerkMiddleware()`. It's used to activate a specific organization or personal account based on URL path parameters.

Usage:

```ts
// app/root.tsx
export const middleware: Route.MiddlewareFunction[] = [
clerkMiddleware({
organizationSyncOptions: {
organizationPatterns: [
'/orgs/:slug', // Match the org slug
'/orgs/:slug/(.*)', // Wildcard match for optional trailing path segments
],
}
})
]
```

To learn more about best practices for using organization slugs to manage the active organization, check out this [guide](https://clerk.com/docs/organizations/org-slugs-in-urls).
2 changes: 2 additions & 0 deletions packages/react-router/src/server/clerkMiddleware.ts
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,9 @@ export const clerkMiddleware = (options?: ClerkMiddlewareOptions): MiddlewareFun
const loadedOptions = loadOptions(args, options);
const { audience, authorizedParties } = loadedOptions;
const { signInUrl, signUpUrl, afterSignInUrl, afterSignUpUrl } = loadedOptions;
const { organizationSyncOptions } = loadedOptions;
const requestState = await clerkClient(args).authenticateRequest(clerkRequest, {
organizationSyncOptions,
audience,
authorizedParties,
signInUrl,
Expand Down
13 changes: 12 additions & 1 deletion packages/react-router/src/server/types.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,10 @@
import type { Organization, Session, User, VerifyTokenOptions } from '@clerk/backend';
import type { RequestState, SignedInAuthObject, SignedOutAuthObject } from '@clerk/backend/internal';
import type {
OrganizationSyncOptions,
RequestState,
SignedInAuthObject,
SignedOutAuthObject,
} from '@clerk/backend/internal';
import type {
LegacyRedirectProps,
MultiDomainAndOrProxy,
Expand Down Expand Up @@ -31,6 +36,12 @@ export type ClerkMiddlewareOptions = {
machineSecretKey?: string;
signInUrl?: string;
signUpUrl?: string;
/**
* Used to activate a specific [organization](https://clerk.com/docs/guides/organizations/overview) or [personal account](https://clerk.com/docs/guides/dashboard/overview) based on URL path parameters. If there's a mismatch between the active organization in the session (e.g., as reported by `auth()`) and the organization indicated by the URL, an attempt to activate the organization specified in the URL will be made.
*
* If the activation can't be performed, either because an organization doesn't exist or the user lacks access, the active organization in the session won't be changed. Ultimately, it's the responsibility of the page to verify that the resources are appropriate to render given the URL and handle mismatches appropriately (e.g., by returning a 404).
*/
organizationSyncOptions?: OrganizationSyncOptions;
} & Pick<VerifyTokenOptions, 'audience' | 'authorizedParties'> &
MultiDomainAndOrProxy &
SignInForceRedirectUrl &
Expand Down