@eka-care/abha 0.0.5 → 0.0.7

package/src/routes/abha-login-otp-verify-screen.tsx

@@ -1,523 +0,0 @@
-import { ArrowLeftRegularIcon, EkaIcon } from '@elixir/icons';
-import {
-  ABHA_AUTH_FLOW_METHOD,
-  ABHA_V3_SKIP_STATES,
-  LOADING_STATE,
-  TProfileRecord,
-} from '@elixir/types';
-import { postAbdmLoginInit } from 'apis';
-import { useState, useEffect } from 'react';
-import usePostAuthVerifyV2 from '../api-queries/use-post-auth-verify-v2';
-import Pds2Button from '../atoms/button';
-import AbhaHeader from '../organisms/abha/abha-header';
-import AbhaErrorBottomSheet from '../organisms/abha/error-bottom-sheet';
-import AbhaOtpCard from '../organisms/abha/otp-card';
-import useAuthAbhaStore from '../stores/auth-abha-store';
-import { SCREEN_NAMES } from '../stores/auth-abha-store/types';
-import usePostAbdmLoginVerify from '../api-queries/use-post-abdm-login-verify-v1';
-import ExitPopup from '../molecules/exit-popup';
-import { onAbhaSuccess, unMount } from '../main';
-import { handleSendEvent } from '@elixir/utils';
-import { getMockAuthVerifyResponse } from '../utils/mock-auth-response';
-import { GET_EXTRA_HEADERS } from 'apis';
-
-const AbhaLoginOtpVerifyScreen = () => {
-  const authTxnId = useAuthAbhaStore((state) => state.authTxnId);
-  const txnId = useAuthAbhaStore((state) => state.txnId);
-  const setAbhaAddressList = useAuthAbhaStore((state) => state.setAbhaAddressList);
-  const clearAbhaAuthStore = useAuthAbhaStore((state) => state.clearAbhaAuthStore);
-  const aadhaarOtpSentToHint = useAuthAbhaStore((state) => state.aadhaarOtpSentToHint);
-  const loginIdentifierValue = useAuthAbhaStore((state) => state.loginIdentifierValue);
-  const abhaAuthFlowMethod = useAuthAbhaStore((state) => state.abhaAuthFlowMethod);
-  const setScreen = useAuthAbhaStore((state) => state.setScreen);
-  const goBackLoginScreen = useAuthAbhaStore((state) => state.goBackLoginScreen);
-  const setTxnId = useAuthAbhaStore((state) => state.setTxnId);
-  const setBottomsheetErrorInfo = useAuthAbhaStore((state) => state.setBottomsheetErrorInfo);
-  const [isExitPopupOpen, setIsExitPopupOpen] = useState<boolean>(false);
-  const setEkaProfileInfo = useAuthAbhaStore((state) => state.setEkaProfileInfo);
-  const setAadhaarVerificationSkipStateStatus = useAuthAbhaStore(
-    (state) => state.setAadhaarVerificationSkipStateStatus
-  );
-  const setSelectedAbhaAddress = useAuthAbhaStore((state) => state.setSelectedAbhaAddress);
-
-  const [otp, setOtp] = useState('');
-  const [isOtpValid, setIsOtpValid] = useState(false);
-  const [error, setError] = useState<string | null>('');
-  const [abdmLoginVerifyApiStatus, setAbdmLoginVerifyApiStatus] = useState<LOADING_STATE>(
-    LOADING_STATE.IDLE
-  );
-  const validGenders = ['M', 'F', 'O', 'U'] as const;
-
-  const { mutateAsync: postAuthVerifyV2Mutate } = usePostAuthVerifyV2();
-  const { mutateAsync: postAbdmLoginVerify } = usePostAbdmLoginVerify();
-  const isEkaAppLogin = useAuthAbhaStore((state) => state.isEkaAppLogin);
-  const clientId = useAuthAbhaStore((state) => state.clientId);
-  const oid = useAuthAbhaStore((state) => state.oid);
-  const isNewLoginOrCreateFlow = useAuthAbhaStore((state) => state.isNewLoginOrCreateFlow);
-  const extra_headers = GET_EXTRA_HEADERS();
-
-  // Analytics event tracker
-  const trackAbhaEvent = ({ name, data = {} }: { name: string; data?: Record<string, any> }) => {
-    const baseProps = {
-      login_platform: clientId,
-      is_eka_app_login: isEkaAppLogin ? 'true' : 'false',
-      is_new_login_or_create_flow: isNewLoginOrCreateFlow ? 'true' : 'false',
-      txn_id: txnId || 'missing txnId',
-      oid: extra_headers?.['X-User-ID'] ? 'true' : 'false',
-      access_token: extra_headers?.['auth'] ? 'true' : 'false',
-    };
-
-    const eventData = {
-      ...baseProps,
-      ...data,
-    };
-
-    handleSendEvent({
-      eventName: name,
-      eventData,
-    });
-
-    window.curio?.pushToMixpanel?.(name, eventData);
-  };
-
-  useEffect(() => {
-    trackAbhaEvent({
-      name: 'page_view',
-      data: {
-        page_view: 'abha_login_otp_verify',
-        platform: clientId,
-      },
-    });
-  }, []);
-
-  const handleErrorBottomsheetButtonClick = () => {
-    trackAbhaEvent({
-      name: 'abha_login_otp_verify_error_bottomsheet_dismissed',
-      data: { platform: clientId },
-    });
-    goBackLoginScreen();
-    const isAppLogin = useAuthAbhaStore.getState().isEkaAppLogin;
-    clearAbhaAuthStore();
-    useAuthAbhaStore.setState({ isEkaAppLogin: isAppLogin });
-  };
-
-  const handleOtpCompletion = ({ otp: newOtp }: { otp: string }) => {
-    setOtp(newOtp);
-    trackAbhaEvent({
-      name: 'abha_login_otp_completion',
-      data: {
-        type: 'verify',
-        platform: clientId,
-        txn_id: txnId,
-        otp_entered: true,
-        method: abhaAuthFlowMethod,
-      },
-    });
-    handleVerifyClick(newOtp);
-  };
-
-  const handleVerifyClick = async (otpToSubmit: string) => {
-    if (!txnId) {
-      trackAbhaEvent({
-        name: 'abha_login_otp_verify_txnId_not_found',
-        data: {
-          type: 'verify',
-          platform: clientId,
-          txn_id: txnId || 'missing_txn_id',
-          txn_id_exists: !!txnId,
-          method: abhaAuthFlowMethod?.toLowerCase() || 'unknown_method',
-        },
-      });
-      return;
-    }
-    trackAbhaEvent({
-      name: 'abha_login_otp_verify',
-      data: {
-        type: 'verify',
-        platform: clientId,
-        txn_id: txnId,
-      },
-    });
-
-    setAbdmLoginVerifyApiStatus(LOADING_STATE.LOADING);
-    const {
-      abha_profiles = [],
-      skip_state,
-      profile,
-      error: verifyError,
-      action: errorAction,
-      eka,
-    } = await postAbdmLoginVerify({ otp: otpToSubmit, txn_id: txnId });
-
-    if (errorAction) {
-      trackAbhaEvent({
-        name: 'abha_login_otp_verify_error_action',
-        data: {
-          type: 'verify',
-          platform: clientId,
-          error_action: errorAction || 'no_error_action',
-          error_message: verifyError || 'no_error_message',
-          error_action_exists: !!errorAction,
-          error_message_exists: !!verifyError,
-        },
-      });
-      setBottomsheetErrorInfo(errorAction);
-      return;
-    }
-
-    if (verifyError) {
-      trackAbhaEvent({
-        name: 'abha_login_otp_verify_error',
-        data: {
-          type: 'verify',
-          platform: clientId,
-          error_message: verifyError || 'unknown_error',
-          error_message_exists: !!verifyError,
-        },
-      });
-      setAbdmLoginVerifyApiStatus(LOADING_STATE.REJECTED);
-      setError(verifyError);
-      return;
-    }
-
-    if (!skip_state) {
-      setError('Skip State is missing');
-      trackAbhaEvent({
-        name: 'abha_login_skip_state_missing',
-        data: {
-          platform: clientId,
-          skipState: skip_state || 'missing_skip_state',
-          skipState_exists: !!skip_state,
-        },
-      });
-      return;
-    }
-
-    setAadhaarVerificationSkipStateStatus(skip_state);
-    if (profile) {
-      setSelectedAbhaAddress(profile.abha_address);
-    }
-
-    // if profile data exists, then set in store
-    if (profile) {
-      setEkaProfileInfo({
-        date_of_birth: `${profile.year_of_birth}-${String(profile.month_of_birth).padStart(2, '0')}-${String(profile.day_of_birth).padStart(2, '0')}`,
-        firstname: profile.first_name as string,
-        lastname: profile.last_name as string,
-        pincode: profile.pincode as string,
-        gender: profile.gender as string,
-        name: (profile.first_name + ' ' + profile.last_name) as string,
-        mobile: profile.mobile,
-        oid: eka?.oid,
-        abha_address: profile?.abha_address,
-        abha_number: profile?.abha_number,
-      });
-    }
-
-    const gender = validGenders.includes(profile?.gender as any)
-      ? (profile?.gender as 'M' | 'F' | 'O' | 'U')
-      : undefined;
-
-    const authProfile: TProfileRecord = {
-      oid: eka?.oid || '',
-      fln: profile?.first_name + ' ' + profile?.last_name,
-      dob: `${profile?.year_of_birth}-${String(profile?.month_of_birth).padStart(2, '0')}-${String(profile?.day_of_birth).padStart(2, '0')}`,
-      gen: gender,
-      mobile: profile?.mobile,
-      at: '',
-      fn: profile?.first_name || '',
-      mn: profile?.middle_name || '',
-      ln: profile?.last_name || '',
-      'health-ids': profile?.abha_address ? [profile.abha_address] : undefined,
-      abha_number: profile?.abha_number || '',
-    };
-
-    // ABHA_V3_SKIP_STATES.ABHA_END
-    if (skip_state === ABHA_V3_SKIP_STATES.ABHA_END) {
-      /**
-       * check for min_token and oid
-       *  if min_token is present, call auth verify
-       *  if not show error
-       */
-      // if the auth token and oid is present in the headers, then do not trigger auth verify api
-      if (isEkaAppLogin) {
-        trackAbhaEvent({
-          name: 'abha_login_otp_verify_eka_app',
-          data: {
-            type: 'verify',
-            platform: clientId,
-            txn_id: txnId,
-            skip_state: skip_state,
-          },
-        });
-        setAbdmLoginVerifyApiStatus(LOADING_STATE.RESOLVED);
-        if (!eka) {
-          trackAbhaEvent({
-            name: 'abha_login_otp_verify_eka_app_error',
-            data: {
-              type: 'null_oid',
-              platform: clientId,
-              txn_id: txnId || 'missing_txn_id',
-              txn_id_exists: !!txnId,
-              eka: eka || 'missing_eka',
-              eka_exists: !!eka,
-              skip_state: skip_state || 'missing_skip_state',
-              skip_state_exists: !!skip_state,
-            },
-          });
-          setAbdmLoginVerifyApiStatus(LOADING_STATE.REJECTED);
-          setError('Something went wrong, please try again');
-          return;
-        }
-
-        const authResponse = getMockAuthVerifyResponse(authProfile);
-        // for ios specific handling
-        trackAbhaEvent({
-          name: 'abha_login_otp_verify_success',
-          data: {
-            type: 'verify',
-            platform: clientId,
-            txn_id: txnId,
-            skip_state: skip_state,
-            method: abhaAuthFlowMethod,
-          },
-        });
-        if (window.EkaAbha && window.EkaAbha.onAbhaSuccess) {
-          window.EkaAbha?.onAbhaSuccess(JSON.stringify({ response: authResponse }));
-          return;
-        }
-        //@ts-ignore
-        onAbhaSuccess({ response: authResponse });
-        unMount();
-        return;
-      }
-      if (!eka || !eka.min_token || !authTxnId) {
-        trackAbhaEvent({
-          name: 'abha_login_otp_verify_eka_error',
-          data: {
-            type: 'verify',
-            platform: clientId,
-            eka: eka || 'missing_eka',
-            eka_exists: !!eka,
-            auth_txnId: authTxnId || 'missing_auth_txnId',
-            auth_txnId_exists: !!authTxnId,
-            skip_state: skip_state || 'missing_skip_state',
-            skip_state_exists: !!skip_state,
-          },
-        });
-        setAbdmLoginVerifyApiStatus(LOADING_STATE.REJECTED);
-        setError('Something went wrong, please try again');
-        return;
-      }
-
-      const authVerifyResponse = await postAuthVerifyV2Mutate({
-        txn_id: authTxnId,
-        token: eka.min_token,
-        ...(eka.oid ? { oid: eka.oid } : null),
-      });
-
-      if (!authVerifyResponse.data) {
-        trackAbhaEvent({
-          name: 'abha_login_otp_verify_auth_verify_error',
-          data: {
-            type: 'verify',
-            platform: clientId,
-            skip_state: skip_state || 'missing_skip_state',
-            skip_state_exists: !!skip_state,
-            auth_verify_data_exists: false,
-          },
-        });
-        setAbdmLoginVerifyApiStatus(LOADING_STATE.REJECTED);
-        setError(authVerifyResponse.error?.message || 'Something went wrong, please try again');
-        return;
-      }
-
-      trackAbhaEvent({
-        name: 'abha_login_otp_verify_abha_end_success',
-        data: {
-          type: 'verify',
-          platform: clientId,
-          txn_id: txnId,
-          skip_state: skip_state,
-        },
-      });
-      setAbdmLoginVerifyApiStatus(LOADING_STATE.RESOLVED);
-      return;
-    }
-
-    // ABHA_V3_SKIP_STATES.ABHA_SELECT
-    if (skip_state === ABHA_V3_SKIP_STATES.ABHA_SELECT && abha_profiles.length > 0) {
-      trackAbhaEvent({
-        name: 'abha_login_otp_verify_abha_select',
-        data: {
-          type: 'verify',
-          platform: clientId,
-        },
-      });
-      setScreen(SCREEN_NAMES.SELECT_ABHA_FROM_LIST);
-      setAbhaAddressList(abha_profiles);
-      return;
-    }
-
-    // ABHA_V3_SKIP_STATES.ABHA_CREATE && LOGIN METHOD IS MOBILE
-    if (
-      skip_state === ABHA_V3_SKIP_STATES.ABHA_CREATE &&
-      abhaAuthFlowMethod === ABHA_AUTH_FLOW_METHOD.MOBILE
-    ) {
-      setScreen(SCREEN_NAMES.CREATE_EKA_PROFILE);
-      return;
-    }
-
-    // ABHA_V3_SKIP_STATES.ABHA_CREATE && LOGIN METHOD IS ABHA NUMBER
-    if (skip_state === ABHA_V3_SKIP_STATES.ABHA_CREATE) {
-      setScreen(SCREEN_NAMES.CREATE_ABHA_ADDRESS);
-      return;
-    }
-
-    // if the auth token and oid is present in the headers, then do not trigger auth verify api
-    if (isEkaAppLogin) {
-      if (!eka) {
-        trackAbhaEvent({
-          name: 'abha_login_otp_verify_eka_failed',
-          data: {
-            type: 'verify',
-            platform: clientId,
-            txn_id: authTxnId || 'missing_authTxnId',
-            txn_id_exists: !!authTxnId,
-          },
-        });
-        setAbdmLoginVerifyApiStatus(LOADING_STATE.REJECTED);
-        setError('Something went wrong, please try again');
-        return;
-      }
-      const authResponse = getMockAuthVerifyResponse(authProfile);
-
-      setAbdmLoginVerifyApiStatus(LOADING_STATE.RESOLVED);
-      // for ios specific handling
-      if (window.EkaAbha && window.EkaAbha.onAbhaSuccess) {
-        window.EkaAbha?.onAbhaSuccess(JSON.stringify({ response: authResponse }));
-        return;
-      }
-      //@ts-ignore
-      onAbhaSuccess({ response: authResponse });
-      unMount();
-      return;
-    }
-
-    if (!skip_state || !eka?.min_token) {
-      setAbdmLoginVerifyApiStatus(LOADING_STATE.REJECTED);
-      setError(verifyError || 'Something went wrong, please try again');
-      if (errorAction) {
-        setBottomsheetErrorInfo(errorAction);
-      }
-      return;
-    }
-
-    if (eka.min_token && authTxnId) {
-      const authVerifyResponse = await postAuthVerifyV2Mutate({
-        txn_id: authTxnId,
-        token: eka.min_token,
-      });
-
-      if (!authVerifyResponse.data) {
-        trackAbhaEvent({
-          name: 'abha_login_auth_verify_failed',
-          data: {
-            platform: clientId,
-            txn_id: authTxnId || 'missing_authTxnId',
-            txn_id_exists: !!authTxnId,
-            error_message: authVerifyResponse?.error?.message || 'unknown_error',
-            error_message_exists: !!authVerifyResponse?.error?.message,
-          },
-        });
-        setAbdmLoginVerifyApiStatus(LOADING_STATE.REJECTED);
-        setError(authVerifyResponse.error?.message || 'Something went wrong, please try again');
-      } else {
-        trackAbhaEvent({
-          name: 'abha_login_auth_verify_success',
-          data: {
-            platform: clientId,
-            txn_id: authTxnId,
-          },
-        });
-      }
-    }
-
-    setAbdmLoginVerifyApiStatus(LOADING_STATE.RESOLVED);
-  };
-
-  const handleResendOtpClick = async () => {
-    if (loginIdentifierValue && abhaAuthFlowMethod) {
-      const { txn_id } = await postAbdmLoginInit({
-        method: abhaAuthFlowMethod,
-        identifier: loginIdentifierValue,
-      });
-      trackAbhaEvent({
-        name: 'abha_login_verify_resend_otp',
-        data: {
-          method: abhaAuthFlowMethod,
-          platform: clientId,
-          txn_id: txn_id,
-        },
-      });
-      if (txn_id) {
-        setTxnId(txn_id);
-      }
-    }
-  };
-
-  return (
-    <div className="pds2-flex pds2-flex-col pds2-w-full pds2-h-screen pds2-bg-bg-white">
-      <AbhaHeader
-        prefixIcon={
-          <button
-            className="pds2-w-24 pds2-h-24 pds2-rounded-full pds2-flex pds2-items-center pds2-justify-center ripple"
-            onClick={() => setIsExitPopupOpen(true)}
-          >
-            <ArrowLeftRegularIcon className="" />
-          </button>
-        }
-        title="OTP Verification"
-        suffixIcon={<EkaIcon className="pds2-w-20 pds2-h-20" />}
-        className="pds2-border-b-1 pds2-border-bg-seperator-dark"
-      />
-      <div className="pds2-p-16 pds2-space-y-16 pds2-overflow-y-scroll pds2-flex-1">
-        <AbhaOtpCard
-          otpSentToText={
-            aadhaarOtpSentToHint || 'Enter OTP sent on mobile number linked with your Aadhaar'
-          }
-          onOtpCompletion={handleOtpCompletion}
-          onResendOtpClick={handleResendOtpClick}
-          error={error}
-          setIsValid={(val) => {
-            error && setError(null);
-            setIsOtpValid(val);
-          }}
-          prefixIcon={
-            <img
-              src="https://cdn.eka.care/vagus/cm6hreldp000b0tfwf0nj156l.webp"
-              alt="abha"
-              className="pds2-w-48"
-            />
-          }
-        />
-      </div>
-      {/* removing this error , since it is handled inside otp card */}
-      {/* {error && <div className="pds2-p-16 pds2-text-text-error pds2-text-center">{error}</div>} */}
-      <div className="pds2-p-16 pds2-sticky pds2-bottom-0 pds2-bg-bg-white pds2-w-full pds2-border pds2-border-border-brand-02">
-        <Pds2Button
-          title="Verify"
-          state={abdmLoginVerifyApiStatus === LOADING_STATE.LOADING ? 'disabled' : 'enabled'}
-          className="pds2-w-full"
-          onClick={() => handleVerifyClick(otp)}
-          isLoading={abdmLoginVerifyApiStatus === LOADING_STATE.LOADING}
-        />
-      </div>
-
-      <AbhaErrorBottomSheet onSubmitClick={handleErrorBottomsheetButtonClick} />
-      <ExitPopup open={isExitPopupOpen} setOpen={setIsExitPopupOpen} />
-    </div>
-  );
-};
-
-export default AbhaLoginOtpVerifyScreen;