diff --git a/.env b/.env index 450318b..c0c1b21 100644 --- a/.env +++ b/.env @@ -1 +1,6 @@ DIGIFI_PORT=5173 + +# Social Links +FACEBOOK_URL=https://www.facebook.com +TWITTER_URL=https://twitter.com +INSTAGRAM_URL=https://www.instagram.com \ No newline at end of file diff --git a/.env.development b/.env.development index 450318b..90d9e86 100644 --- a/.env.development +++ b/.env.development @@ -1 +1,6 @@ DIGIFI_PORT=5173 + +# Social Links +VITE_FACEBOOK_URL=https://www.facebook.com +VITE_TWITTER_URL=https://twitter.com +VITE_INSTAGRAM_URL=https://www.instagram.com \ No newline at end of file diff --git a/.env.production b/.env.production index 450318b..c0c1b21 100644 --- a/.env.production +++ b/.env.production @@ -1 +1,6 @@ DIGIFI_PORT=5173 + +# Social Links +FACEBOOK_URL=https://www.facebook.com +TWITTER_URL=https://twitter.com +INSTAGRAM_URL=https://www.instagram.com \ No newline at end of file diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx index 3973536..7e1152f 100644 --- a/src/components/Footer/Footer.tsx +++ b/src/components/Footer/Footer.tsx @@ -4,14 +4,18 @@ import { socialsIcons } from "../../utils/data"; export default function Footer() { const date = new Date().getFullYear(); return ( -
+

{date} @ First City Monument Bank Limited

{socialsIcons.map((icon, index) => ( - + {icon.name} ))} diff --git a/src/components/GetStarted/BasicInfo.tsx b/src/components/GetStarted/BasicInfo.tsx index 4d6c5db..42e4a9e 100644 --- a/src/components/GetStarted/BasicInfo.tsx +++ b/src/components/GetStarted/BasicInfo.tsx @@ -7,6 +7,7 @@ interface Option { } const BasicInfo: React.FC = () => { + const [hideOTPComponent, setHideOTPComponent] = React.useState(true); const inputRef = useRef(null); // Array for marital status options @@ -33,69 +34,164 @@ const BasicInfo: React.FC = () => { }; const handleInput = (e: React.FormEvent) => { - // Handle input events - console.log(e); + if (name === "bvn") { + const regex = /^[0-9]+$/; + + if (regex.test(value)) { + if (value?.length == 10) { + setHideOTPComponent(false); + // secondInputRef.current?.focus(); + } else setHideOTPComponent(true); + } else { + console.log("object not found"); + } + } }; return ( -
-
- - - - + <> +
+
+ + + + +
-
+ {!hideOTPComponent ? ( +
+
+
+ + + +
+
+
+
+ + + +
+
+
+ ) : null} + ); }; diff --git a/src/components/Home/Hero/PersonalHero.tsx b/src/components/Home/Hero/PersonalHero.tsx index e4b62c7..939eb40 100644 --- a/src/components/Home/Hero/PersonalHero.tsx +++ b/src/components/Home/Hero/PersonalHero.tsx @@ -7,7 +7,7 @@ interface PersonalHeroProps { body?: string; buttonLink?: string; buttonText?: string; -}; +} const PersonalHero: React.FC = ({ heading, body, @@ -16,15 +16,17 @@ const PersonalHero: React.FC = ({ }) => { return (
-
+

{heading}

-

{body}

+

{body}

- +
diff --git a/src/components/Home/Requirements/FeatureText.tsx b/src/components/Home/Requirements/FeatureText.tsx index 094cebc..0eaf8ae 100644 --- a/src/components/Home/Requirements/FeatureText.tsx +++ b/src/components/Home/Requirements/FeatureText.tsx @@ -27,7 +27,7 @@ const FeatureText = () => {
*** Click here to apply diff --git a/src/components/LetsGetStated/LetsGetStarted.tsx b/src/components/LetsGetStated/LetsGetStarted.tsx index 0861078..4f774b2 100644 --- a/src/components/LetsGetStated/LetsGetStarted.tsx +++ b/src/components/LetsGetStated/LetsGetStarted.tsx @@ -26,7 +26,7 @@ const LetsGetStarted: React.FC = () => { if (regex.test(value)) { if (value?.length == 10) { setHideOTPComponent(false); - secondInputRef.current?.focus(); + // secondInputRef.current?.focus(); } else setHideOTPComponent(true); } else { console.log("object not found"); diff --git a/src/components/shared/InputCompOne.tsx b/src/components/shared/InputCompOne.tsx index 6c79eb5..a547c63 100644 --- a/src/components/shared/InputCompOne.tsx +++ b/src/components/shared/InputCompOne.tsx @@ -39,7 +39,7 @@ const InputCompOne = forwardRef( name, tabIndex, selectValue, - input = true, + input = false, select = false, selectOptions = [], inputType = "text", diff --git a/src/pages/BusinessBankingPage.tsx b/src/pages/BusinessBankingPage.tsx index dafc39b..75592f7 100644 --- a/src/pages/BusinessBankingPage.tsx +++ b/src/pages/BusinessBankingPage.tsx @@ -5,7 +5,12 @@ import { PersonalHero } from "../components"; const BusinessBankingPage: React.FC = () => { return ( - + Business Banking ); diff --git a/src/pages/CooperateBankingPage.tsx b/src/pages/CooperateBankingPage.tsx index 9c483ab..7b35519 100644 --- a/src/pages/CooperateBankingPage.tsx +++ b/src/pages/CooperateBankingPage.tsx @@ -1,14 +1,19 @@ -import React from 'react' -import { HomeLayout } from '../layouts' -import { PersonalHero } from '../components' +import React from "react"; +import { HomeLayout } from "../layouts"; +import { PersonalHero } from "../components"; const CooperateBankingPage: React.FC = () => { return ( - + Cooperate Banking - ) -} + ); +}; -export default CooperateBankingPage +export default CooperateBankingPage; diff --git a/src/pages/GetStartedPage.tsx b/src/pages/GetStartedPage.tsx index 02f157c..71df150 100644 --- a/src/pages/GetStartedPage.tsx +++ b/src/pages/GetStartedPage.tsx @@ -1,13 +1,17 @@ import React from "react"; import { GetStarted as Main, Header, Footer } from "../components"; -const GetStartedPage :React.FC = () => { +const GetStartedPage: React.FC = () => { return ( - <> +
-
-
- +
+
+
+
+
+
+
); }; diff --git a/src/pages/PersonalBankingPage.tsx b/src/pages/PersonalBankingPage.tsx index dde2412..97679bf 100644 --- a/src/pages/PersonalBankingPage.tsx +++ b/src/pages/PersonalBankingPage.tsx @@ -1,14 +1,19 @@ -import React from 'react' -import { HomeLayout } from '../layouts' -import { PersonalHero } from '../components' +import React from "react"; +import { HomeLayout } from "../layouts"; +import { PersonalHero } from "../components"; const PersonalBankingPage: React.FC = () => { return ( - + Personal Banking - ) -} + ); +}; -export default PersonalBankingPage +export default PersonalBankingPage; diff --git a/src/utils/data.tsx b/src/utils/data.tsx index 4c122b6..5876770 100644 --- a/src/utils/data.tsx +++ b/src/utils/data.tsx @@ -9,6 +9,8 @@ import YoutubeWhite from "../assets/images/socials/youtube.svg"; import InstagramWhite from "../assets/images/socials/instagram.svg"; import { RouteHandler } from "../router/routes"; +let process = import.meta.env; + export const top_header_data = [ { id: 1, name: "HOME", href: RouteHandler.homepage }, { id: 2, name: "PERSONAL", href: RouteHandler.personalBanking }, @@ -398,9 +400,9 @@ export const _lowerMenuItems = [ ]; export const socialsIcons = [ - { name: "facebook", image: FBook }, - { name: "twitter", image: Twitter }, - { name: "instagram", image: Instagram }, + { name: "facebook", image: FBook, link: import.meta.env.VITE_FACEBOOK_URL }, + { name: "twitter", image: Twitter, link: import.meta.env.VITE_TWITTER_URL }, + { name: "instagram", image: Instagram, link: import.meta.env.VITE_INSTAGRAM_URL }, ]; export const footerItems = [