fix(clerk-react): Make publishableKey required in IsomorphicClerkOptions

clerk · Nov 15, 2023 · 2961583 · 2961583
1 parent cc7cfba
commit 2961583
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 9 deletions.
diff --git a/packages/expo/src/ClerkProvider.tsx b/packages/expo/src/ClerkProvider.tsx
@@ -13,7 +13,10 @@ __internal__setErrorThrowerOptions({
   packageName: '@clerk/expo',
 });
 
-export type ClerkProviderProps = ClerkReactProviderProps & {
+type ClerkReactProviderOptionalPK = Exclude<ClerkReactProviderProps, 'publishableKey'> &
+  Partial<Pick<ClerkReactProviderProps, 'publishableKey'>>;
+
+export type ClerkProviderProps = ClerkReactProviderOptionalPK & {
   tokenCache?: TokenCache;
 };
 
@@ -27,6 +30,7 @@ export function ClerkProvider(props: ClerkProviderProps): JSX.Element {
       // See JS-598 for additional context.
       key={key}
       {...rest}
+      publishableKey={key}
       Clerk={buildClerk({ key, tokenCache })}
       standardBrowser={!isReactNative()}
     >

diff --git a/packages/nextjs/src/app-router/server/ClerkProvider.tsx b/packages/nextjs/src/app-router/server/ClerkProvider.tsx
@@ -6,7 +6,9 @@ import { mergeNextClerkPropsWithEnv } from '../../utils/mergeNextClerkPropsWithE
 import { ClientClerkProvider } from '../client/ClerkProvider';
 import { initialState } from './auth';
 
-type NextAppClerkProviderProps = React.PropsWithChildren<IsomorphicClerkOptions>;
+type NextAppClerkProviderProps = React.PropsWithChildren<
+  Exclude<IsomorphicClerkOptions, 'publishableKey'> & { publishableKey?: string }
+>;
 
 export function ClerkProvider(props: NextAppClerkProviderProps) {
   const { children, ...rest } = props;

diff --git a/packages/nextjs/src/types.ts b/packages/nextjs/src/types.ts
@@ -1,6 +1,6 @@
 import type { IsomorphicClerkOptions } from '@clerk/clerk-react';
+import type { ClerkOptions, MultiDomainAndOrProxy } from '@clerk/types';
 import type React from 'react';
-
 export type NextClerkProviderProps = {
   children: React.ReactNode;
   /**
@@ -12,4 +12,17 @@ export type NextClerkProviderProps = {
    * @default true
    */
   __unstable_invokeMiddlewareOnAuthStateChange?: boolean;
-} & IsomorphicClerkOptions;
+} & /**
+ * TODO(@dimkl) The following code is a dirty hack to by-pass some type issues when using
+ * Exclude and Omit due.
+ * The actual code should be:
+ * ```
+ * export type NextClerkProviderProps = {
+ *   __unstable_invokeMiddlewareOnAuthStateChange?: boolean;
+ * } & WithOptional<ClerkProviderProps, 'publishableKey'>;
+ * ```
+ */ Omit<ClerkOptions, 'isSatellite'> &
+  MultiDomainAndOrProxy &
+  Pick<IsomorphicClerkOptions, 'Clerk' | 'clerkJSUrl' | 'clerkJSVariant' | 'clerkJSVersion' | 'sdkMetadata'> & {
+    publishableKey?: string;
+  };
diff --git a/packages/react/src/contexts/ClerkProvider.tsx b/packages/react/src/contexts/ClerkProvider.tsx
@@ -19,7 +19,7 @@ export type ClerkProviderProps = IsomorphicClerkOptions & {
 
 function ClerkProviderBase(props: ClerkProviderProps): JSX.Element {
   const { initialState, children, ...restIsomorphicClerkOptions } = props;
-  const { publishableKey = '', Clerk: userInitialisedClerk } = restIsomorphicClerkOptions;
+  const { publishableKey, Clerk: userInitialisedClerk } = restIsomorphicClerkOptions;
 
   if (!userInitialisedClerk) {
     if (!publishableKey) {

diff --git a/packages/react/src/isomorphicClerk.ts b/packages/react/src/isomorphicClerk.ts
@@ -12,7 +12,6 @@ import type {
   HandleOAuthCallbackParams,
   ListenerCallback,
   OrganizationListProps,
-  OrganizationMembershipResource,
   OrganizationProfileProps,
   OrganizationResource,
   OrganizationSwitcherProps,
@@ -128,7 +127,7 @@ export default class IsomorphicClerk {
 
   constructor(options: IsomorphicClerkOptions) {
     const { Clerk = null, publishableKey } = options || {};
-    this.#publishableKey = publishableKey || '';
+    this.#publishableKey = publishableKey;
     this.#proxyUrl = options?.proxyUrl;
     this.#domain = options?.domain;
     this.options = options;

diff --git a/packages/react/src/types.ts b/packages/react/src/types.ts
@@ -28,7 +28,7 @@ export type IsomorphicClerkOptions = Omit<ClerkOptions, 'isSatellite'> & {
   clerkJSVariant?: 'headless' | '';
   clerkJSVersion?: string;
   sdkMetadata?: SDKMetadata;
-  publishableKey?: string;
+  publishableKey: string;
 } & MultiDomainAndOrProxy;
 
 export interface BrowserClerkConstructor {

diff --git a/packages/types/src/multiDomain.ts b/packages/types/src/multiDomain.ts
@@ -3,7 +3,7 @@ import type { ClerkOptions } from './clerk';
 type StringOrURLFnToString = string | ((url: URL) => string);
 
 /**
- * DomainOrProxyUrl supports the following cases
+ * MultiDomainAndOrProxy supports the following cases
  * 1) none of them are set
  * 2) only proxyUrl is set
  * 3) isSatellite and proxy is set