Skip to content

fix(clerk-js): Capture openCreateOrganization props #5977

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 5 commits into from
+17 −3
Closed

fix(clerk-js): Capture openCreateOrganization props #5977

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
fd18b18
fix(clerk-js): Respect afterCreateOrganizationUrl prop
jacekradko May 21, 2025
51131a4
Capture props
jacekradko May 21, 2025
1d136ca
wip
jacekradko May 21, 2025
17461a6
fix(clerk-js): Capture props in openCreateOrganization
jacekradko May 21, 2025
a486d34
Merge branch 'main' into fix/respect-afterCreateOrganizationUrl
jacekradko May 27, 2025
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
5 changes: 5 additions & 0 deletions .changeset/salty-actors-wait.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@clerk/clerk-js': patch
---

Capture props passed in to openCreateOrganization to prevent mutations
8 changes: 6 additions & 2 deletions packages/clerk-js/src/core/clerk.ts
View file
Original file line number Diff line number Diff line change
@@ -708,6 +708,10 @@ export class Clerk implements ClerkInterface {

public openCreateOrganization = (props?: CreateOrganizationProps): void => {
this.assertComponentsReady(this.#componentControls);

// SDKI-1012: Capture props to prevent mutations after this call
const capturedProps = props ? { ...props } : {};

if (disabledOrganizationsFeature(this, this.environment)) {
if (this.#instanceType === 'development') {
throw new ClerkRuntimeError(warnings.cannotRenderAnyOrganizationComponent('CreateOrganization'), {
@@ -718,9 +722,9 @@ export class Clerk implements ClerkInterface {
}
void this.#componentControls
.ensureMounted({ preloadHint: 'CreateOrganization' })
.then(controls => controls.openModal('createOrganization', props || {}));
.then(controls => controls.openModal('createOrganization', capturedProps || {}));

this.telemetry?.record(eventPrebuiltComponentOpened('CreateOrganization', props));
this.telemetry?.record(eventPrebuiltComponentOpened('CreateOrganization', capturedProps));
};

public closeCreateOrganization = (): void => {
7 changes: 6 additions & 1 deletion packages/clerk-js/src/ui/components/OrganizationSwitcher/OrganizationSwitcherPopover.tsx
View file
Original file line number Diff line number Diff line change
@@ -88,7 +88,12 @@ export const OrganizationSwitcherPopover = React.forwardRef<HTMLDivElement, Orga
if (createOrganizationMode === 'navigation') {
return navigateCreateOrganization();
}
return openCreateOrganization({ afterCreateOrganizationUrl, skipInvitationScreen, hideSlug });

return openCreateOrganization({
afterCreateOrganizationUrl,
hideSlug,
skipInvitationScreen,
});
};

const handleItemClick = () => {

Unchanged files with check annotations Beta

View file
packages/expo/src/hooks/useOAuth.ts
return errorThrower.throw('Missing oauth strategy');
}
const { signIn, setActive, isLoaded: isSignInLoaded } = useSignIn();

Check warning on line 36 in packages/expo/src/hooks/useOAuth.ts

GitHub Actions / Static analysis 

React Hook "useSignIn" is called conditionally. React Hooks must be called in the exact same order in every component render. Did you accidentally call a React Hook after an early return?
const { signUp, isLoaded: isSignUpLoaded } = useSignUp();

Check warning on line 37 in packages/expo/src/hooks/useOAuth.ts

GitHub Actions / Static analysis 

React Hook "useSignUp" is called conditionally. React Hooks must be called in the exact same order in every component render. Did you accidentally call a React Hook after an early return?
async function startOAuthFlow(startOAuthFlowParams?: StartOAuthFlowParams): Promise<StartOAuthFlowReturnType> {
if (!isSignInLoaded || !isSignUpLoaded) {
const { externalVerificationRedirectURL } = signIn.firstFactorVerification;
const authSessionResult = await WebBrowser.openAuthSessionAsync(
// @ts-ignore

Check warning on line 68 in packages/expo/src/hooks/useOAuth.ts

GitHub Actions / Static analysis 

Include a description after the "@ts-ignore" directive to explain why the @ts-ignore is necessary. The description must be 3 characters or longer
externalVerificationRedirectURL.toString(),
oauthRedirectUrl,
);
// @ts-expect-error

Check warning on line 73 in packages/expo/src/hooks/useOAuth.ts

GitHub Actions / Static analysis 

Include a description after the "@ts-expect-error" directive to explain why the @ts-expect-error is necessary. The description must be 3 characters or longer
const { type, url } = authSessionResult || {};
// TODO: Check all the possible AuthSession results
View file
packages/expo/src/local-credentials/useLocalCredentials/useLocalCredentials.ts
return () => {
ignore = true;
};
}, [storeKey, user]);

Check warning on line 103 in packages/expo/src/local-credentials/useLocalCredentials/useLocalCredentials.ts

GitHub Actions / Static analysis 

React Hook useEffect has a missing dependency: 'getUserCredentials'. Either include it or remove the dependency array
return [userOwnsCredentials, setUserOwnsCredentials] as const;
};
View file
packages/chrome-extension/src/internal/clerk.ts
syncHost?: string;
};
export async function createClerkClient({

Check warning on line 31 in packages/chrome-extension/src/internal/clerk.ts

GitHub Actions / Static analysis 

Async function 'createClerkClient' has no 'await' expression
__experimental_syncHostListener = false,
publishableKey,
scope,
if (jwtOptions.sync && __experimental_syncHostListener) {
jwtOptions.onListenerCallback = () => {
if (clerk.user) {
clerk.user.reload();

Check warning on line 80 in packages/chrome-extension/src/internal/clerk.ts

GitHub Actions / Static analysis 

Promises must be awaited, end with a call to .catch, end with a call to .then with a rejection handler or be explicitly marked as ignored with the `void` operator
} else {
window.location.reload();
}
View file
packages/chrome-extension/src/internal/utils/__tests__/manifest.test.ts
describe('Manifest', () => {
describe('validateManifest(manifest)', () => {
describe('no features', () => {
test('valid configuration', async () => {

Check warning on line 9 in packages/chrome-extension/src/internal/utils/__tests__/manifest.test.ts

GitHub Actions / Static analysis 

Async arrow function has no 'await' expression
const manifest = {
permissions: ['cookies', 'storage'],
host_permissions: ['https://*/*'],
expect(() => validateManifest(manifest, {})).not.toThrow();
});
test('invalid configuration (permissions.storage)', async () => {

Check warning on line 18 in packages/chrome-extension/src/internal/utils/__tests__/manifest.test.ts

GitHub Actions / Static analysis 

Async arrow function has no 'await' expression
const manifest = {
permissions: ['cookies'],
host_permissions: ['https://*/*'],
});
describe('sync', () => {
test('valid configuration', async () => {

Check warning on line 29 in packages/chrome-extension/src/internal/utils/__tests__/manifest.test.ts

GitHub Actions / Static analysis 

Async arrow function has no 'await' expression
const manifest = {
permissions: ['cookies', 'storage'],
host_permissions: ['https://*/*'],