Skip to content

Commit

Permalink
Task #230243 add consent and route to myapplication (#59)
Browse files Browse the repository at this point in the history 
* Task #230243 add consent and route to myapplication

* Task #230243 remove alert
  • Loading branch information
@namita-25
namita-25 authored Dec 3, 2024
1 parent ca7dd1a commit df6c3bc
Show file tree
Hide file tree
Showing 2 changed files with 139 additions and 85 deletions.
182 changes: 106 additions & 76 deletions src/components/common/Dialogue.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ interface Term {
}[];
}
interface CommonDialogueProps {
isOpen?: boolean;
isOpen?: boolean | object;
onClose?: () => void;
termsAndConditions?: Term[];
handleDialog?: () => void;
Expand All @@ -43,86 +43,116 @@ const CommonDialogue: React.FC<CommonDialogueProps> = ({
};
const { t } = useTranslation();
return (
<Modal isOpen={isOpen} onClose={onClose}>
<Modal
isOpen={typeof isOpen === "boolean" ? isOpen : false}
onClose={onClose}
>
<ModalOverlay />
<ModalContent borderRadius="md">
<ModalHeader className="border-bottom">
{termsAndConditions && (
<>
<Box className="heading">Terms and Conditions</Box>
<Box color="gray.600" fontWeight="300" fontSize="18px">
Confirmation
</Box>
</>
)}
</ModalHeader>
{!termsAndConditions && <ModalCloseButton />}
{termsAndConditions && (
<ModalContent borderRadius="md">
<ModalHeader className="border-bottom">
{termsAndConditions ? (
<>
<Box className="heading">Terms and Conditions</Box>
<Box color="gray.600" fontWeight="300" fontSize="18px">
Confirmation
</Box>
</>
) : (
<>
<Box className="heading">Application Submmited</Box>
<Box color="gray.600" fontWeight="300" fontSize="18px">
Confirmation
</Box>
</>
)}
</ModalHeader>
{!termsAndConditions && <ModalCloseButton />}

<ModalBody
className="border-bottom"
maxHeight="400px" // Fixed height for Modal Body
overflowY="auto" // Enables scrolling for Modal Body
>
{termsAndConditions ? (
<>
<Text mt={4} mb={10} fontWeight="500" fontSize="20px">
{t("CONFIRMATION_DIALOGUE_CONSENT_TEXT")}
</Text>
<Text mt={4} mb={4} fontWeight="normal" fontSize="17px">
{t("DIALOGUE_CLICK_TO_READ_AND_PROCEED")}
</Text>
<Accordion allowMultiple onChange={handleAccordionChange}>
<AccordionItem>
<h2>
<AccordionButton>
<Box flex="1" textAlign="left">
{t("DIALOGUE_T&C")}
</Box>
<AccordionIcon />
</AccordionButton>
</h2>
<AccordionPanel
pb={4}
maxHeight="200px" // Fixed height for Accordion Panel
overflowY="auto" // Enables scrolling for Accordion Panel
>
<div>
{termsAndConditions?.map((item, index) => (
<Text color={"#4D4639"} size="16px" key={index + 100}>
{index + 1}. {item.description}
</Text>
))}
</div>
</AccordionPanel>
</AccordionItem>
</Accordion>
</>
) : (
""
)}
</ModalBody>
<ModalFooter>
{termsAndConditions ? (
<>
<CommonButton
variant="outline"
onClick={onClose}
label={t("CONFIRMATION_DIALOGUE_DENY")}
isDisabled={!isAccordionOpen}
/>
<Box ml={2}>
<ModalBody
className="border-bottom"
maxHeight="400px" // Fixed height for Modal Body
overflowY="auto" // Enables scrolling for Modal Body
>
{termsAndConditions ? (
<>
<Text mt={4} mb={10} fontWeight="500" fontSize="20px">
{t("CONFIRMATION_DIALOGUE_CONSENT_TEXT")}
</Text>
<Text mt={4} mb={4} fontWeight="normal" fontSize="17px">
{t("DIALOGUE_CLICK_TO_READ_AND_PROCEED")}
</Text>
<Accordion allowMultiple onChange={handleAccordionChange}>
<AccordionItem>
<h2>
<AccordionButton>
<Box flex="1" textAlign="left">
{t("DIALOGUE_T&C")}
</Box>
<AccordionIcon />
</AccordionButton>
</h2>
<AccordionPanel
pb={4}
maxHeight="200px" // Fixed height for Accordion Panel
overflowY="auto" // Enables scrolling for Accordion Panel
>
<div>
{termsAndConditions?.map((item, index) => (
<Text color={"#4D4639"} size="16px" key={index + 100}>
{index + 1}. {item.description}
</Text>
))}
</div>
</AccordionPanel>
</AccordionItem>
</Accordion>
</>
) : (
<>
<Text fontSize="md" color="gray.700">
{t("SUBMIT_DIALOGUE_CONTENT_TEXT")}
<Text as="span" color="blue.600" fontWeight="medium">
{(isOpen as any)?.name || ""}
</Text>{" "}
{t("SUBMIT_DIALOGUE_SUBMITTED_TEXT")}!
</Text>
<Text fontSize="sm" color="gray.500" mt={3}>
{t("SUBMIT_DIALOGUE_APPLICATION_ID_TEXT")}:{" "}
<Text as="span" fontWeight="medium">
{(isOpen as any)?.orderId || ""}
</Text>{" "}
</Text>
</>
)}
</ModalBody>
<ModalFooter>
{termsAndConditions ? (
<>
<CommonButton
label={t("CONFIRMATION_DIALOGUE_ACCEPT")}
variant="outline"
onClick={onClose}
label={t("CONFIRMATION_DIALOGUE_DENY")}
isDisabled={!isAccordionOpen}
onClick={handleDialog}
/>
</Box>
</>
) : (
""
)}
</ModalFooter>
</ModalContent>
<Box ml={2}>
<CommonButton
label={t("CONFIRMATION_DIALOGUE_ACCEPT")}
isDisabled={!isAccordionOpen}
onClick={handleDialog}
/>
</Box>
</>
) : (
<CommonButton
onClick={handleDialog}
width={"40%"}
label={t("SUBMIT_DIALOGUE_BUTTON")}
/>
)}
</ModalFooter>
</ModalContent>
)}
</Modal>
);
};
Expand Down
42 changes: 33 additions & 9 deletions src/screens/benefit/Details.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ import "../../assets/styles/App.css";
import { useNavigate, useParams } from "react-router-dom";
import CommonButton from "../../components/common/button/Button";
import Layout from "../../components/common/layout/Layout";
import { getUser } from "../../services/auth/auth";
import { getUser, sendConsent } from "../../services/auth/auth";
import {
applyApplication,
confirmApplication,
Expand All @@ -28,11 +28,11 @@ import {
getOne,
} from "../../services/benefit/benefits";
import { MdCurrencyRupee } from "react-icons/md";
import ConfirmationDialog from "../../components/ConfirmationDialog";
import WebViewFormSubmitWithRedirect from "../../components/WebView";
import SubmitDialog from "../../components/SubmitDialog";
import { useTranslation } from "react-i18next";
import Loader from "../../components/common/Loader";
import { termsAndConditions } from "../../assets/termsAndCondition";
import CommonDialogue from "../../components/common/Dialogue";

// Define types for benefit item and user
interface BenefitItem {
Expand Down Expand Up @@ -90,8 +90,10 @@ const BenefitsDetails: React.FC = () => {
const [error, setError] = useState<string>("");
const [authUser, setAuthUser] = useState<AuthUser | null>(null);
const [webFormProp, setWebFormProp] = useState<WebFormProps>({});
const [confirmationConsent, setConfirmationConsent] =
useState<unknown>(false);
const [confirmationConsent, setConfirmationConsent] = useState<
boolean | object
>(false);
const [submitDialouge, setSubmitDialouge] = useState<boolean | object>(false);
const navigate = useNavigate();
const { id } = useParams<{ id: string }>();
const { t } = useTranslation();
Expand Down Expand Up @@ -214,7 +216,7 @@ const BenefitsDetails: React.FC = () => {
};

await createApplication(payloadCreateApp);
setConfirmationConsent({ orderId, name: item?.descriptor?.name });
setSubmitDialouge({ orderId, name: item?.descriptor?.name });
setWebFormProp({});
} else {
setError("Error while creating application. Please try again later");
Expand Down Expand Up @@ -259,7 +261,19 @@ const BenefitsDetails: React.FC = () => {
/>
);
}
const closeDialog = async () => {
try {
await sendConsent(authUser?.user_id, `${id}`, `Application for ${id}`);

setConfirmationConsent(false);
navigate("/applicationStatus");
} catch {
console.log("Error sending consent");
}
};
const handleRedirect = () => {
setSubmitDialouge(false);
};
return (
<Layout
_heading={{ heading: item?.descriptor?.name || "", handleBack }}
Expand Down Expand Up @@ -333,8 +347,18 @@ const BenefitsDetails: React.FC = () => {
)}
</Box>
</Box>

<ConfirmationDialog
<CommonDialogue
isOpen={confirmationConsent}
onClose={closeDialog}
termsAndConditions={termsAndConditions}
handleDialog={handleConfirmation}
/>
<CommonDialogue
isOpen={submitDialouge}
onClose={handleRedirect}
handleDialog={handleRedirect}
/>
{/* <ConfirmationDialog
dialogVisible={isOpen}
closeDialog={onClose}
handleConfirmation={handleConfirmation}
Expand All @@ -346,7 +370,7 @@ const BenefitsDetails: React.FC = () => {
confirmationConsent as { name?: string; orderId?: string }
}
closeSubmit={setConfirmationConsent}
/>
/> */}
</Layout>
);
};
Expand Down

0 comments on commit df6c3bc

Please sign in to comment.