Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 | 2x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 9x | import NiceModal from "@ebay/nice-modal-react";
import { useDrawerAccountWithUI } from "@features/GiveOnboarding/container/DrawerAccount";
import useCheckPAH from "@hooks/common/useCheckPAH";
import {
isOwnerIdentitySubmitted,
MerchantOwnerReassignment,
resolveIsPahReassignmentIdentityOnly,
} from "@hooks/common/usePahReassignmentStatus";
import { useGetMerchantById } from "@hooks/enterprise-api/account/useGetMerchants";
import { useAppSelector } from "@redux/hooks";
import { selectUser } from "@redux/slices/auth/auth";
import useMasqueradeReducer from "@hooks/Reducers/useMasqueradeReducer";
import { Stack } from "@mui/material";
import { CaretDownIcon, StorefrontIcon } from "@phosphor-icons/react";
import GiveButton from "@shared/Button/GiveButton";
import GiveEmptyState from "@shared/EmptyState/GiveEmptyState";
import { checkPortals } from "@utils/routing";
import { useGetFeatureFlagValues } from "FeatureFlags/useGetFeatureFlagValues";
import { LOGOUT_MODAL } from "modals/modal_names";
import { PropsWithChildren } from "react";
const DESCRIPTION =
"We’re sorry — we’ve updated the onboarding process. The Primary Account Holder needs to complete it before other members can use the platform. Once the Primary Account Holder finishes onboarding, you’ll be able to log in and start using the platform.";
export default function OnboardingStatusWrapper({
children,
minHeight,
}: PropsWithChildren & { minHeight: number }) {
const { isMasqueradeMode } = useMasqueradeReducer();
const { isLoggedInPAH, isLoading } = useCheckPAH();
const currentUserEmail = useAppSelector(selectUser)?.email;
const { isMerchantPortal } = checkPortals();
const { isMerchantOnboardingModalEnabled } = useGetFeatureFlagValues();
const { data, isLoading: loadingMerchant, merchantId } = useGetMerchantById();
const showOnboardingInProgress =
!isLoggedInPAH &&
!isLoading &&
!isMasqueradeMode &&
isMerchantPortal &&
!loadingMerchant &&
!data?.isOnboardingCompleted &&
isMerchantOnboardingModalEnabled &&
!!merchantId;
// PAH006 SS-4: a reassigned PAH onboarding onto an already-approved merchant
// must only complete Identity. The BE sets owner.isOwnerReassignmentIdentityOnly
// while the identity task is pending, and the GiveOnboarding wizard opens in
// identity-only mode on top. Block the rest of the portal underneath so the
// PAH cannot reach Business / Bank Account sections until identity is done.
// The wizard itself is rendered outside this wrapper in Base, so it stays
// available. Acquirers masquerading as the merchant are not the logged-in
// PAH (isLoggedInPAH is false), so they are not blocked.
//
// PAH006 SS-4 follow-up: only gate UNTIL the PAH uploads identity. Once they
// submit (owner.statusName → ready_for_verification), drop the gate so they
// land on the portal directly instead of waiting on underwriting approval.
const owner = data?.owner as MerchantOwnerReassignment | undefined;
const isIdentityOnlyReonboarding =
isLoggedInPAH &&
!isMasqueradeMode &&
isMerchantPortal &&
isMerchantOnboardingModalEnabled &&
!loadingMerchant &&
resolveIsPahReassignmentIdentityOnly(owner, currentUserEmail) &&
!isOwnerIdentitySubmitted(owner);
Iif (showOnboardingInProgress) return <InProgressView minHeight={minHeight} />;
if (isIdentityOnlyReonboarding) return null;
return <>{children}</>;
}
function InProgressView({ minHeight }: { minHeight: number }) {
const { hasManyAccounts, DrawerAccountComponent } = useDrawerAccountWithUI({
baseRender: () => <></>,
CustomButton: ({ onClick }) => (
<GiveButton
label="Switch Account"
size="large"
variant="outline"
endIcon={<CaretDownIcon size={18} />}
onClick={onClick}
/>
),
});
return (
<Stack
width="100%"
minHeight={minHeight}
flex={1}
alignItems="center"
justifyContent="center"
gap="24px"
>
<GiveEmptyState
Icon={<StorefrontIcon size={28} />}
title={{
main: "Onboarding Update",
secondary: DESCRIPTION,
}}
sx={{ maxWidth: "446px" }}
/>
<Stack direction="row" gap="16px">
<DrawerAccountComponent />
<GiveButton
label="Log Out"
size="large"
onClick={() => NiceModal.show(LOGOUT_MODAL)}
/>
</Stack>
</Stack>
);
}
|