feat(react): update signUp method to use navigate utility and change button variant to solid

Author: brionmario

packages/react/src/AsgardeoReactClient.ts

@@ -42,6 +42,9 @@ import {
   HttpRequestConfig,
   HttpResponse,
   Storage,
+  navigate,
+  getRedirectBasedSignUpUrl,
+  Config,
   TokenExchangeRequestConfig,
 } from '@asgardeo/browser';
 import AuthAPI from './__temp__/api';
@@ -333,32 +336,19 @@ class AsgardeoReactClient<T extends AsgardeoReactConfig = AsgardeoReactConfig> e
   override async signUp(options?: SignUpOptions): Promise<void>;
   override async signUp(payload: EmbeddedFlowExecuteRequestPayload): Promise<EmbeddedFlowExecuteResponse>;
   override async signUp(...args: any[]): Promise<void | EmbeddedFlowExecuteResponse> {
-    if (args.length === 0) {
-      throw new AsgardeoRuntimeError(
-        'No arguments provided for signUp method.',
-        'react-AsgardeoReactClient-ValidationError-001',
-        'react',
-        'The signUp method requires at least one argument, either a SignUpOptions object or an EmbeddedFlowExecuteRequestPayload.',
-      );
-    }
-
+    const configData = await this.asgardeo.getConfigData();
     const firstArg = args[0];
 
     if (typeof firstArg === 'object' && 'flowType' in firstArg) {
-      const configData = await this.asgardeo.getConfigData();
       const baseUrl: string = configData?.baseUrl;
 
       return executeEmbeddedSignUpFlow({
         baseUrl,
         payload: firstArg as EmbeddedFlowExecuteRequestPayload,
       });
     }
-    throw new AsgardeoRuntimeError(
-      'Not implemented',
-      'react-AsgardeoReactClient-ValidationError-002',
-      'react',
-      'The signUp method with SignUpOptions is not implemented in the React client.',
-    );
+
+    navigate(getRedirectBasedSignUpUrl(configData as Config));
   }
 
   async request(requestConfig?: HttpRequestConfig): Promise<HttpResponse<any>> {

packages/react/src/components/actions/SignUpButton/BaseSignUpButton.tsx

@@ -98,6 +98,8 @@ const BaseSignUpButton: ForwardRefExoticComponent<BaseSignUpButtonProps & RefAtt
           disabled={isLoading}
           loading={isLoading}
           type="button"
+          color="primary"
+          variant="solid"
           {...rest}
         >
           {children}

packages/react/src/components/actions/SignUpButton/SignUpButton.tsx

@@ -17,6 +17,7 @@
  */
 
 import {AsgardeoRuntimeError} from '@asgardeo/browser';
+import {navigate} from '@asgardeo/browser';
 import {forwardRef, ForwardRefExoticComponent, MouseEvent, ReactElement, Ref, RefAttributes, useState} from 'react';
 import BaseSignUpButton, {BaseSignUpButtonProps} from './BaseSignUpButton';
 import useAsgardeo from '../../../contexts/Asgardeo/useAsgardeo';
@@ -83,9 +84,7 @@ const SignUpButton: ForwardRefExoticComponent<SignUpButtonProps & RefAttributes<
 
       // If a custom `signUpUrl` is provided, use it for navigation.
       if (signUpUrl) {
-        window.history.pushState(null, '', signUpUrl);
-
-        window.dispatchEvent(new PopStateEvent('popstate', {state: null}));
+        navigate(signUpUrl);
       } else {
         await signUp();
       }