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 | 19x 22x 22x 22x 22x 20x 20x 20x 20x 22x 28x 48x | import React, { createContext, useContext, useEffect } from "react";
import usePersonalInformation from "../hooks/usePersonalInformation";
import { Stack } from "@mui/material";
import KotoStepper from "@common/SignUp/KotoStepper";
import { newPersonalInfoEnum } from "../types";
type PersonalInfo = ReturnType<typeof usePersonalInformation> & {
homepageReset: () => void;
};
const Provider = createContext<PersonalInfo>({} as any);
function PersonalInformationProvider({
children,
homepageReset,
}: {
children: React.ReactNode;
homepageReset: () => void;
}) {
const values = usePersonalInformation();
const {
personalInfoStatusBar,
step,
setStep,
stepperRef,
setIsLoaded,
setPersonalInfoStatusBar,
} = values;
const owner = values?.enterpriseData?.owner;
useEffect(() => {
const isPeronalInfoCompleted =
owner?.firstName && owner?.lastName && owner?.isManagerialAuthority;
const isDocumentUploaded = owner?.IDProofUploaded;
// enterpriseData
Iif (isPeronalInfoCompleted && isDocumentUploaded) {
// all completed
setPersonalInfoStatusBar((prev) =>
prev.map((item) => ({ ...item, barValue: 100 })),
);
return setStep(newPersonalInfoEnum.TAKE_A_SELFIE);
}
Iif (isPeronalInfoCompleted && !isDocumentUploaded) {
setPersonalInfoStatusBar((prev) => {
return prev?.map((item) => ({
...item,
barValue:
item?.label === newPersonalInfoEnum?.PERSONAL_INFORMATION ? 100 : 0,
}));
});
return setStep(newPersonalInfoEnum.UPLOAD_YOUR_ID);
}
}, [owner]);
return (
<Provider.Provider value={{ ...values, homepageReset }}>
<Stack
direction="column"
minHeight="100%"
justifyContent="stretch"
flexGrow={1}
>
<Stack direction="row" alignItems="center" gap={2}>
<KotoStepper
isCompletedColor={true}
sx={{ flexGrow: 1 }}
overriderActiveStep={Object.values(personalInfoStatusBar).findIndex(
(x) => x.label === step,
)}
setStep={setStep}
defaultStep={newPersonalInfoEnum.PERSONAL_INFORMATION}
customSteps={personalInfoStatusBar}
ref={stepperRef}
setIsLoaded={setIsLoaded}
/>
</Stack>
{children}
</Stack>
</Provider.Provider>
);
}
export default PersonalInformationProvider;
export const usePersonalInformationProvider = () => useContext(Provider);
|