chore(react,vue): Add deprecation notice to redirect components (#4631)

.changeset/olive-zebras-arrive.md

@@ -0,0 +1,10 @@
+---
+'@clerk/clerk-react': patch
+'@clerk/vue': patch
+---
+
+Add deprecation notices for the following components:
+
+- `RedirectToUserProfile`
+- `RedirectToOrganizationProfile`
+- `RedirectToCreateOrganization`

packages/react/src/components/controlComponents.tsx

@@ -1,3 +1,4 @@
+import { deprecated } from '@clerk/shared/deprecated';
 import type {
   CheckAuthorizationWithCustomPermissions,
   HandleOAuthCallbackParams,
@@ -164,24 +165,36 @@ export const RedirectToSignUp = withClerk(({ clerk, ...props }: WithClerkProp<Re
   return null;
 }, 'RedirectToSignUp');
 
+/**
+ * @deprecated Use [`redirectToUserProfile()`](https://clerk.com/docs/references/javascript/clerk/redirect-methods#redirect-to-user-profile) instead, will be removed in the next major version.
+ */
 export const RedirectToUserProfile = withClerk(({ clerk }) => {
   React.useEffect(() => {
+    deprecated('RedirectToUserProfile', 'Use the `redirectToUserProfile()` method instead.');
     void clerk.redirectToUserProfile();
   }, []);
 
   return null;
 }, 'RedirectToUserProfile');
 
+/**
+ * @deprecated Use [`redirectToOrganizationProfile()`](https://clerk.com/docs/references/javascript/clerk/redirect-methods#redirect-to-organization-profile) instead, will be removed in the next major version.
+ */
 export const RedirectToOrganizationProfile = withClerk(({ clerk }) => {
   React.useEffect(() => {
+    deprecated('RedirectToOrganizationProfile', 'Use the `redirectToOrganizationProfile()` method instead.');
     void clerk.redirectToOrganizationProfile();
   }, []);
 
   return null;
 }, 'RedirectToOrganizationProfile');
 
+/**
+ * @deprecated Use [`redirectToCreateOrganization()`](https://clerk.com/docs/references/javascript/clerk/redirect-methods#redirect-to-create-organization) instead, will be removed in the next major version.
+ */
 export const RedirectToCreateOrganization = withClerk(({ clerk }) => {
   React.useEffect(() => {
+    deprecated('RedirectToCreateOrganization', 'Use the `redirectToCreateOrganization()` method instead.');
     void clerk.redirectToCreateOrganization();
   }, []);
 

packages/vue/src/components/controlComponents.ts

@@ -1,3 +1,4 @@
+import { deprecated } from '@clerk/shared/deprecated';
 import type {
   CheckAuthorizationWithCustomPermissions,
   HandleOAuthCallbackParams as HandleOAuthCallbackParamsOriginal,
@@ -60,24 +61,36 @@ export const RedirectToSignUp = defineComponent((props: RedirectOptions) => {
   return () => null;
 });
 
+/**
+ * @deprecated Use [`redirectToUserProfile()`](https://clerk.com/docs/references/javascript/clerk/redirect-methods#redirect-to-user-profile) instead, will be removed in the next major version.
+ */
 export const RedirectToUserProfile = defineComponent(() => {
   useClerkLoaded(clerk => {
+    deprecated('RedirectToUserProfile', 'Use the `redirectToUserProfile()` method instead.');
     void clerk.redirectToUserProfile();
   });
 
   return () => null;
 });
 
+/**
+ * @deprecated Use [`redirectToOrganizationProfile()`](https://clerk.com/docs/references/javascript/clerk/redirect-methods#redirect-to-organization-profile) instead, will be removed in the next major version.
+ */
 export const RedirectToOrganizationProfile = defineComponent(() => {
   useClerkLoaded(clerk => {
+    deprecated('RedirectToOrganizationProfile', 'Use the `redirectToOrganizationProfile()` method instead.');
     void clerk.redirectToOrganizationProfile();
   });
 
   return () => null;
 });
 
+/**
+ * @deprecated Use [`redirectToCreateOrganization()`](https://clerk.com/docs/references/javascript/clerk/redirect-methods#redirect-to-create-organization) instead, will be removed in the next major version.
+ */
 export const RedirectToCreateOrganization = defineComponent(() => {
   useClerkLoaded(clerk => {
+    deprecated('RedirectToCreateOrganization', 'Use the `redirectToCreateOrganization()` method instead.');
     void clerk.redirectToCreateOrganization();
   });