diff --git a/.env b/.env index 3efdd7a..0b4c923 100644 --- a/.env +++ b/.env @@ -31,5 +31,8 @@ REACT_APP_RESET_START_ERROR_TIMEOUT=3000 #NUMBER OF ITEMS PER PAGE REACT_APP_ITEM_PER_PAGE=5 +# Empty Listings +REACT_APP_ZERO_STATE=0 + #apigate.lotus.g1.wrenchboard.com:76.209.103.227 #apigate.orion.g1.wrenchboard.com:76.209.103.227 diff --git a/package.json b/package.json index 330a6a0..8b0052f 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,7 @@ "version": "0.2.0", "private": true, "dependencies": { + "@react-oauth/google": "^0.11.0", "@reduxjs/toolkit": "^1.8.2", "@tailwindcss/line-clamp": "^0.3.1", "@testing-library/jest-dom": "^5.11.4", diff --git a/src/Routers.jsx b/src/Routers.jsx index 45d669c..4354c41 100644 --- a/src/Routers.jsx +++ b/src/Routers.jsx @@ -34,6 +34,7 @@ import VerifyLinkPages from "./views/VerifyLinkPages"; import MyActiveJobsPage from "./views/MyActiveJobsPage"; import FamilyAccPage from "./views/FamilyAccPage"; import StartJob from "./components/MyJobs/StartJob"; +import AddJobPage from "./views/AddJobPage"; export default function Routers() { return ( @@ -76,6 +77,7 @@ export default function Routers() { } /> } /> } /> + } /> } /> } /> } /> diff --git a/src/components/ActiveBids/AllBidsSection.jsx b/src/components/ActiveBids/AllBidsSection.jsx index b8a7e2e..8750b89 100644 --- a/src/components/ActiveBids/AllBidsSection.jsx +++ b/src/components/ActiveBids/AllBidsSection.jsx @@ -12,7 +12,7 @@ export default function AllBidsSection({ className, allBids = [] }) {
- + {({ datas }) => (
diff --git a/src/components/AddJob/AddJob.jsx b/src/components/AddJob/AddJob.jsx new file mode 100644 index 0000000..270036b --- /dev/null +++ b/src/components/AddJob/AddJob.jsx @@ -0,0 +1,340 @@ +import React, {useState, useEffect} from 'react' +import { Link, useNavigate } from 'react-router-dom'; +import InputCom from '../Helpers/Inputs/InputCom'; +import LoadingSpinner from '../Spinners/LoadingSpinner'; +import usersService from '../../services/UsersService'; + +import { Form, Formik } from "formik"; +import * as Yup from "yup"; + +const validationSchema = Yup.object().shape({ + country: Yup.string() + .min(1, "Minimum 3 characters") + .max(25, "Maximum 25 characters") + .required("Country is required"), + price: Yup.number() + .typeError("you must specify a number") + .min(1, "Price must be greater than 0") + .required("Price is required"), + title: Yup.string() + .min(3, "Minimum 3 characters") + .max(100, "Maximum 25 characters") + .required("Title is required"), + description: Yup.string() + .min(3, "Minimum 3 characters") + .max(250, "Maximum 250 characters") + .required("Description is required"), + job_detail: Yup.string() + .min(3, "Minimum 3 characters") + .max(250, "Maximum 250 characters") + .required("Details is required"), + timeline_days: Yup.number() + .typeError("you must specify a number") + .min(1, "Price must be greater than 0") + .required("Price is required"), + }); + + let initialValues = { // initial values for formik + country: '', + price: '', + title: '', + description: '', + job_detail: '', + timeline_days: '' +} + +function AddJob() { + const ApiCall = new usersService() + const navigate = useNavigate() + + let [pageLoading, setPageLoading] = useState(true) // State used for knowing when the page is mounting + + let [country, setCountry] = useState({loading: false, status: false, data:[]}) // To Hold the array of country getUserCountry returns + + let [requestStatus, setRequestStatus] = useState({loading: false, status: false, message:''}) // Holds state when submit button is pressed + + // FUNCTION TO GET COUNTRY + const getUserCountry = () =>{ + setCountry(prev => ({...prev, loading:true})) + ApiCall.getSignupCountryData().then(res => { + if(res.data.internal_return < 1){ + setCountry({loading: false, status: true, data:[]}) + return + } + setCountry({loading: false, status: true, data:res.data.signup_country}) + }).catch(err => { + setCountry({loading: false, status: false, data:[]}) + }) + } + + // FUNCTION TO HANDLE ADD JOB FORM + const handleAddJob = (values, helpers) => { + console.log(values) + setRequestStatus({loading: true, status: false, message:''}) + ApiCall.jobManagerCreateJob(values).then(res => { + if(res.data.internal_return < 1){ + setRequestStatus({loading: false, status: false, message:'Could not complete your request at the moment'}) + return + } + setRequestStatus({loading: false, status: true, message:'Job Added Successfully'}) + setTimeout(()=>{ + navigate('/myjobs', {replace: true}) + },1000) + + }).catch(err => { + setRequestStatus({loading: false, status: false, message:'Opps! soemthing went wrong. Try Again'}) + }) + } + + useEffect(()=>{ + setPageLoading(false) + getUserCountry() + },[]) + + return pageLoading.loading ? ( +
+
+ +
+
+ ) : ( +
+ + {(props) => { + return ( +
+

Create New Job

+
+
+ + {/* inputs starts here */} + {/* country */} +
+
+ {/* */} + + + {props.errors.country && props.touched.country && ( +

+ {props.errors.country} +

+ )} +
+ + {/* Price */} +
+ + {props.errors.price && props.touched.price && ( +

+ {props.errors.price} +

+ )} +
+
+ + {/* Title */} + +
+ + {props.errors.title && props.touched.title && ( +

+ {props.errors.title} +

+ )} +
+ + {/* Description */} +
+ + {props.errors.description && props.touched.description && ( +

+ {props.errors.description} +

+ )} +
+ + {/* Details */} +
+ {/* */} + +