chore(clerk-react): Stricter types for custom pages (#2939)

clerk · Mar 5, 2024 · c86f73b · c86f73b
1 parent afd221e
commit c86f73b
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 6 deletions.
diff --git a/.changeset/rotten-ligers-move.md b/.changeset/rotten-ligers-move.md
@@ -0,0 +1,5 @@
+---
+'@clerk/clerk-react': patch
+---
+
+Introducing stricter types for custom pages for UserProfile and OrganizationProfile.
diff --git a/packages/react/src/types.ts b/packages/react/src/types.ts
@@ -82,6 +82,7 @@ type ButtonProps = {
 };
 
 export type SignInButtonProps = ButtonProps;
+
 export interface SignUpButtonProps extends ButtonProps {
   unsafeMetadata?: SignUpUnsafeMetadata;
 }
@@ -91,17 +92,25 @@ export type SignInWithMetamaskButtonProps = Pick<ButtonProps, 'redirectUrl' | 'c
 export type RedirectToSignInProps = SignInRedirectOptions;
 export type RedirectToSignUpProps = SignUpRedirectOptions;
 
-export type UserProfilePageProps = {
-  url?: string;
-  label: string;
-  labelIcon?: React.ReactNode;
-};
+type PageProps<T extends string> =
+  | {
+      label: string;
+      url: string;
+      labelIcon: React.ReactNode;
+    }
+  | {
+      label: T;
+      url?: never;
+      labelIcon?: never;
+    };
+
+export type UserProfilePageProps = PageProps<'account' | 'security'>;
 
 export type UserProfileLinkProps = {
   url: string;
   label: string;
   labelIcon: React.ReactNode;
 };
 
-export type OrganizationProfilePageProps = UserProfilePageProps;
+export type OrganizationProfilePageProps = PageProps<'general' | 'members'>;
 export type OrganizationProfileLinkProps = UserProfileLinkProps;