refactor(ui): remove all callbacl page search params validation (#1240)

remove all callback page search params validation

packages/ui/src/containers/SocialLanding/index.tsx

@@ -10,10 +10,9 @@ type Props = {
   className?: string;
   connectorId: string;
   isLoading?: boolean;
-  message?: string;
 };
 
-const SocialLanding = ({ className, connectorId, message, isLoading = false }: Props) => {
+const SocialLanding = ({ className, connectorId, isLoading = false }: Props) => {
   const { experienceSettings } = useContext(PageContext);
   const connector = experienceSettings?.socialConnectors.find(({ id }) => id === connectorId);
 
@@ -23,7 +22,6 @@ const SocialLanding = ({ className, connectorId, message, isLoading = false }: P
         {connector?.logo ? <img src={connector.logo} /> : connectorId}
       </div>
       {isLoading && <LoadingIcon />}
-      {!isLoading && message && <div className={styles.message}>{message}</div>}
     </div>
   );
 };

packages/ui/src/hooks/use-social-callback-handler.ts

@@ -1,46 +1,21 @@
-import { useCallback, useContext, useState } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useCallback } from 'react';
 import { useNavigate } from 'react-router-dom';
 
-import { parseQueryParameters } from '@/utils';
 import { getCallbackLinkFromStorage } from '@/utils/social-connectors';
 
-import { PageContext } from './use-page-context';
-
 const useSocialCallbackHandler = () => {
-  const [loading, setLoading] = useState(true);
-  const [errorMessage, setErrorMessage] = useState<string>();
-  const { setToast } = useContext(PageContext);
-  const { t } = useTranslation(undefined, { keyPrefix: 'main_flow' });
   const navigate = useNavigate();
 
   const socialCallbackHandler = useCallback(
     (connectorId: string) => {
       // Apple use fragment mode to store auth parameter. Need to support it.
-      const data = window.location.search || '?' + window.location.hash.slice(1);
-      const { state, error, error_description = '' } = parseQueryParameters(data);
-
-      // Connector auth error
-      if (error) {
-        setLoading(false);
-        setErrorMessage(`${error}${error_description ? `: ${error_description}` : ''}`);
-
-        return;
-      }
-
-      // Connector auth missing state
-      if (!state || !connectorId) {
-        setLoading(false);
-        setToast(t('error.invalid_connector_auth'));
-
-        return;
-      }
+      const search = window.location.search || '?' + window.location.hash.slice(1);
 
       // Get native callback link from storage
       const callbackLink = getCallbackLinkFromStorage(connectorId);
 
       if (callbackLink) {
-        window.location.replace(new URL(`${callbackLink}${data}`));
+        window.location.replace(new URL(`${callbackLink}${search}`));
 
         return;
       }
@@ -49,17 +24,17 @@ const useSocialCallbackHandler = () => {
       navigate(
         {
           pathname: `/social/sign-in-callback/${connectorId}`,
-          search: data,
+          search,
         },
         {
           replace: true,
         }
       );
     },
-    [navigate, setToast, t]
+    [navigate]
   );
 
-  return { socialCallbackHandler, loading, errorMessage };
+  return { socialCallbackHandler };
 };
 
 export default useSocialCallbackHandler;

packages/ui/src/pages/Callback/index.tsx

@@ -13,7 +13,7 @@ type Parameters = {
 const Callback = () => {
   const { connector: connectorId } = useParams<Parameters>();
 
-  const { socialCallbackHandler, loading, errorMessage } = useSocialCallbackHandler();
+  const { socialCallbackHandler } = useSocialCallbackHandler();
 
   // SocialSignIn Callback Handler
   useEffect(() => {
@@ -29,12 +29,7 @@ const Callback = () => {
 
   return (
     <div className={styles.wrapper}>
-      <SocialLanding
-        className={styles.connectorContainer}
-        connectorId={connectorId}
-        isLoading={loading}
-        message={errorMessage}
-      />
+      <SocialLanding isLoading className={styles.connectorContainer} connectorId={connectorId} />
     </div>
   );
 };