diff --git a/src/components/GetStarted/ApplicantsAttestation.tsx b/src/components/GetStarted/ApplicantsAttestation.tsx
new file mode 100644
index 0000000..38c42dd
--- /dev/null
+++ b/src/components/GetStarted/ApplicantsAttestation.tsx
@@ -0,0 +1,30 @@
+import React from "react";
+import CreditAccount from "./CreditAccount";
+import DebitAccount from "./DebitAccount";
+
+const ApplicantsAttestation: React.FC = () => {
+ return (
+ <>
+
+
+ Applicant’s Attestation and Debit Instruction
+
+
+
+ For more enquiries and support
+
+
+ Call: 09099000000
+
+
+ Email: fcmbloan@support.com
+
+
+
+
+
+ >
+ );
+};
+
+export default ApplicantsAttestation;
diff --git a/src/components/GetStarted/CreditAccount.tsx b/src/components/GetStarted/CreditAccount.tsx
new file mode 100644
index 0000000..cb0e80a
--- /dev/null
+++ b/src/components/GetStarted/CreditAccount.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+import { InputCompOne } from "..";
+
+const CreditAccount: React.FC = () => {
+ return (
+ <>
+
+
+ CREDIT ACCOUNT ( Your account to receive your loan )
+
+
+
+ >
+ );
+};
+
+export default CreditAccount;
diff --git a/src/components/GetStarted/DebitAccount.tsx b/src/components/GetStarted/DebitAccount.tsx
new file mode 100644
index 0000000..739b69d
--- /dev/null
+++ b/src/components/GetStarted/DebitAccount.tsx
@@ -0,0 +1,67 @@
+import React from "react";
+import { Button, InputCompOne } from "..";
+
+const DebitAccount: React.FC = () => {
+ return (
+
+
+
+ DEBIT ACCOUNT ( Your salary account for monthly repayment )
+
+
+
+
+
+
+
+
+
+
+
+
+ I have read, understood and accept the{" "}
+ applicant's attestation and
+ all the terms and conditions {" "}
+ for FCMB premium salary loan.
+
+
+
+
+ );
+};
+
+export default DebitAccount;
diff --git a/src/components/GetStarted/GetStarted.tsx b/src/components/GetStarted/GetStarted.tsx
index 782366d..e0eb8ec 100644
--- a/src/components/GetStarted/GetStarted.tsx
+++ b/src/components/GetStarted/GetStarted.tsx
@@ -2,6 +2,7 @@ import React from "react";
import BasicInfo from "./BasicInfo";
import YourAreAlmostThere from "./YourAreAlmostThere";
import LoanAmountComp from "./LoanAmountComp";
+import ApplicantsAttestation from "./ApplicantsAttestation";
const GetStarted = () => {
const [step, setStep] = React.useState(1);
@@ -41,7 +42,8 @@ const GetStarted = () => {
/>
)}
{step === 2 && }
- {step === 3 && }
+ {step === 3 && }
+ {step === 4 && }
diff --git a/src/components/GetStarted/LoanAmountComp.tsx b/src/components/GetStarted/LoanAmountComp.tsx
index 6ee210f..1e7e386 100644
--- a/src/components/GetStarted/LoanAmountComp.tsx
+++ b/src/components/GetStarted/LoanAmountComp.tsx
@@ -1,12 +1,16 @@
import React from "react";
-import { InputCompOne } from "..";
+import { Button, InputCompOne } from "..";
interface SliderProps {
- handleSliderChange: (e: React.ChangeEvent) => void;
- value: number;
- }
+ handleSliderChange: (e: React.ChangeEvent) => void;
+ value: number;
+}
-const LoanAmountComp: React.FC = () => {
+interface LoanAmountProps {
+ handleNextStep: any;
+}
+
+const LoanAmountComp: React.FC = ({ handleNextStep }) => {
const [value, setValue] = React.useState(6);
const handleSliderChange = (e: any) => {
@@ -15,11 +19,11 @@ const LoanAmountComp: React.FC = () => {
return (
<>
-
-
+
+
Loan Amount
-
+
For more enquiries and support
@@ -31,44 +35,44 @@ const LoanAmountComp: React.FC = () => {
-
+
-
-
+
+
The maximum amount you can apply for on this offer is based on the
information you shared with us in your loan application. We have
made this offer to suit your monthly remuneration and to enable you
pay your loan on-time
-
+
-
+
Maximum Offer:
N 500,000
@@ -79,13 +83,16 @@ const LoanAmountComp: React.FC = () => {
@@ -95,7 +102,7 @@ const LoanAmountComp: React.FC = () => {
export default LoanAmountComp;
-const Slider: React.FC
= ({ handleSliderChange, value }) => {
+const Slider: React.FC = ({ handleSliderChange, value }) => {
return (