From e2463ac6af6b4c129f1af53ccdb226e6ab49f993 Mon Sep 17 00:00:00 2001 From: victorAnumudu Date: Fri, 2 Aug 2024 17:14:41 +0100 Subject: [PATCH] use case and blog page added --- app/blog/page.tsx | 25 ++++- app/components/AboutApp.js | 55 ++++++++++ app/contact/Forms.js | 202 +++++++++++++++++++++++++++++++++++++ app/contact/page.tsx | 17 +++- app/use-cases/UseCase.js | 47 +++++++++ app/use-cases/page.tsx | 28 ++++- 6 files changed, 368 insertions(+), 6 deletions(-) create mode 100644 app/components/AboutApp.js create mode 100644 app/contact/Forms.js create mode 100644 app/use-cases/UseCase.js diff --git a/app/blog/page.tsx b/app/blog/page.tsx index 9f8ddab..76dc219 100644 --- a/app/blog/page.tsx +++ b/app/blog/page.tsx @@ -1,5 +1,9 @@ import React from 'react' import FooterHomeOne from '../components/FooterHomeOne'; +import HeroNews from '../components/News/HeroNews'; +import BackToTop from '../components/BackToTop'; +import ServiceNav from '../components/navigation/ServiceNav'; +import Blogs from '../components/News/Blogs'; // must be a better way to centralize the style = TEMPORARY USE import '../assets/css/bootstrap.min.css'; @@ -14,8 +18,25 @@ import '../assets/css/style.css'; function page() { return ( <> -
Bog Here
- + + +
+
+
+
+ +
+
+
+
+ + ) diff --git a/app/components/AboutApp.js b/app/components/AboutApp.js new file mode 100644 index 0000000..3dbe9d3 --- /dev/null +++ b/app/components/AboutApp.js @@ -0,0 +1,55 @@ +import React from 'react' +import frame from '../assets/images/use-case-side-main.png'; //about-frame.png' +import screen from '../assets/images/use-case-side-extra.png'; //about-screen.png' +import Image from 'next/image'; + +const AboutApp = ({ video, dark }) => { + return ( + <> +
+
+
+
+
+
+ image +
+
+ image +
+
+
+
+
+
+

Motivate & Organize
Rewards

+

+ With a planned reward, the parent can introduce the family to earning and start financial education early. +

+
+ + +
    +
  • +

    Goals Completed

    +

    Motivate with rewards for goals completed, passing the exam, finishing chores, and learning new skills.

    +
    • +
  • +

    Connect Family

    +

    It takes a village to raise a kid and share good news and encouragement from the more prominent family. Connect family to the achievements to boost encouragement.

    +
    • +
  • +

    Find any Task

    +

    Make more, connect to the marketplace, and earn from appropriate tasks.

    +
    • +
+
+
+
+
+
+ + ) +} + +export default AboutApp \ No newline at end of file diff --git a/app/contact/Forms.js b/app/contact/Forms.js new file mode 100644 index 0000000..196fc32 --- /dev/null +++ b/app/contact/Forms.js @@ -0,0 +1,202 @@ +"use client" +import React, {useState} from 'react'; +import ContactData from '../Services/ContactData'; + + +function Forms() { + + const [formDetails, setFormDetails] = useState({ + first_name: '', + last_name: '', + email: '', + subject: '', + phone_number: '', + action: 1001, + message: '', + channel: 'WEB', + terms_conditions: false + }) + + const validForm = formDetails.first_name && formDetails.last_name && formDetails.email && formDetails.phone_number && formDetails.subject && formDetails.message + + const handleChange = ({target:{name, value}}) => { + setFormDetails(prev => ({...prev, [name]:value})) + } + + const [requestStatus, setRequestStatus] = useState({loading:false, status:false, msg:''}) + + function handleSubmit(e) { + e.preventDefault() + setRequestStatus({loading:true, status:false, msg:''}) + if(!validForm){ + setRequestStatus({loading:false, status:false, msg:'please, fill all fields'}) + setTimeout(()=>{ + setRequestStatus({loading:false, status:false, msg:''}) + },3000) + return + } + + delete formDetails.terms_conditions + + ContactData(formDetails).then(res =>{ + if(res?.data?.result != '100'){ + setRequestStatus({loading:false, status:false, msg:'failed to send message'}) + setTimeout(()=>{ + setRequestStatus({loading:false, status:false, msg:''}) + },3000) + return + } + setRequestStatus({loading:false, status:true, msg:'message Sent'}) + setTimeout(()=>{ + setRequestStatus({loading:false, status:false, msg:''}) + setFormDetails({ + first_name: '', + last_name: '', + email: '', + subject: '', + phone_number: '', + action: 1001, + message: '', + channel: 'WEB', + terms_conditions: false + }) + },3000) + }).catch(err => { + setRequestStatus({loading:false, status:false, msg:'failed something went wrong'}) + setTimeout(()=>{ + setRequestStatus({loading:false, status:false, msg:''}) + },3000) + }); + } + + + return ( + <> +
+
+
+
+
+

Get in touch

+

Looking for help? Fill the form and start a new discussion.

+
+
Headquaters
+

+ + {process.env.NEXT_PUBLIC_SUPPORT_US_ADDRESS} +

+
+
+
Phone
+

+ + {process.env.NEXT_PUBLIC_SUPPORT_PHONE} +
+

+
+
+
Support
+

+ + {process.env.NEXT_PUBLIC_SUPPORT_EMAIL} + +

+
+ +
+
+
+
+

Let’s Connect

+
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+ + +
+
+
+ +
+ {/*
+ {requestStatus.msg && + } +
*/} +

{requestStatus.msg}

+
+
+
+
+
+
+ +
+ +
+ + ); +} + +export default Forms; diff --git a/app/contact/page.tsx b/app/contact/page.tsx index bc0b739..3de4722 100644 --- a/app/contact/page.tsx +++ b/app/contact/page.tsx @@ -1,5 +1,9 @@ import React from 'react' import FooterHomeOne from '../components/FooterHomeOne'; +import BackToTop from '../components/BackToTop'; +import HeroNews from '../components/News/HeroNews'; +import ServiceNav from '../components/navigation/ServiceNav'; +import Forms from './Forms' // must be a better way to centralize the style = TEMPORARY USE import '../assets/css/bootstrap.min.css'; @@ -14,8 +18,17 @@ import '../assets/css/style.css'; function page() { return ( <> -
Contact us Here
- + + + + + ) diff --git a/app/use-cases/UseCase.js b/app/use-cases/UseCase.js new file mode 100644 index 0000000..1a0a5d6 --- /dev/null +++ b/app/use-cases/UseCase.js @@ -0,0 +1,47 @@ +import React from 'react'; +import blogImg1 from '../assets/images/blog/1.jpg'; +import UseCaseData from '../Services/UseCaseData'; +import Image from 'next/image'; +import Link from 'next/link'; + + +function UseCase() { + + var UseCaseDataResult = UseCaseData(); + + return ( + <> +
+ { + UseCaseDataResult.map((i, index )=> { + var blgImg = i.meta_value != null ? "/images/" + i.meta_value : blogImg1; + + return ( +
+
+ + {{i.title}} +
+

+ + {i.title} + +

+ + Learn more + +
+ +
+
+ + ) + + }) + } +
+ + ); +} + +export default UseCase; diff --git a/app/use-cases/page.tsx b/app/use-cases/page.tsx index 21978dd..b914bae 100644 --- a/app/use-cases/page.tsx +++ b/app/use-cases/page.tsx @@ -1,5 +1,10 @@ import React from 'react' import FooterHomeOne from '../components/FooterHomeOne'; +import BackToTop from '../components/BackToTop'; +import HeroNews from '../components/News/HeroNews'; +import ServiceNav from '../components/navigation/ServiceNav'; +import AboutApp from '../components/AboutApp' +import UseCase from './UseCase' // must be a better way to centralize the style = TEMPORARY USE import '../assets/css/bootstrap.min.css'; @@ -14,8 +19,27 @@ import '../assets/css/style.css'; function page() { return ( <> -
use Case Here
- + + + +
+
+
+ {/*
+ +
*/} + +
+
+
+ + )