WrenchBoard/Users-Wrench
3
0
Fork 0
Code Issues Pull Requests Releases Activity

Fixed Api Parameter, Banner Button Style and Slider header

Browse Source
This commit is contained in:
Chukwumdiebube Ojinta
2023-06-27 17:11:30 +01:00
parent 5e5d953769
commit 271f5635a0
8 changed files with 186 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/AddJob/AddJob.jsx
+10 -8
View File
@@ -8,7 +8,7 @@ import { Field, Form, Formik } from "formik";
import * as Yup from "yup"; import * as Yup from "yup";
const validationSchema = Yup.object().shape({ const validationSchema = Yup.object().shape({
currency: Yup.string() country: Yup.string()
.min(1, "Minimum 3 characters") .min(1, "Minimum 3 characters")
.max(25, "Maximum 25 characters") .max(25, "Maximum 25 characters")
.required("Country is required"), .required("Country is required"),
@@ -54,7 +54,7 @@ function AddJob({ popUpHandler, categories }) {
let initialValues = { let initialValues = {
// initial values for formik // initial values for formik
currency: "", country: "",
price: "", price: "",
title: "", title: "",
description: "", description: "",
@@ -103,6 +103,9 @@ function AddJob({ popUpHandler, categories }) {
status: false, status: false,
message: "Could not complete your request at the moment", message: "Could not complete your request at the moment",
}); });
setTimeout(() => {
popUpHandler();
}, 1500);
return; return;
} }
setRequestStatus({ setRequestStatus({
@@ -133,7 +136,6 @@ function AddJob({ popUpHandler, categories }) {
getUserCurrency(); getUserCurrency();
}, []); }, []);
console.log("Currency >> ", currency.data);
return ( return (
<div className="add-job p-5 w-full bg-white rounded-md flex flex-col justify-between"> <div className="add-job p-5 w-full bg-white rounded-md flex flex-col justify-between">
@@ -151,15 +153,15 @@ function AddJob({ popUpHandler, categories }) {
<div className="xl:flex xl:space-x-7 mb-[5px]"> <div className="xl:flex xl:space-x-7 mb-[5px]">
<div className="field w-full mb-6 xl:mb-0"> <div className="field w-full mb-6 xl:mb-0">
<label <label
htmlFor="currency" htmlFor="country"
className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block" className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"
> >
Currency Currency
</label> </label>
<select <select
id="currency" id="country"
name="currency" name="country"
value={props.values.currency} value={props.values.country}
className={`input-field p-2 mt-3 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-10 bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none`} className={`input-field p-2 mt-3 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-10 bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none`}
onChange={props.handleChange} onChange={props.handleChange}
onBlur={props.handleBlur} onBlur={props.handleBlur}
@@ -278,7 +280,7 @@ function AddJob({ popUpHandler, categories }) {
role="group" role="group"
aria-labelledby="checked-group" aria-labelledby="checked-group"
> >
{Object.entries(categories).map(([key, value]) => ( {Object?.entries(categories).map(([key, value]) => (
<label <label
key={key} key={key}
className="flex gap-1 w-full items-center" className="flex gap-1 w-full items-center"
src/components/Cards/HomeBannerOffersCard.jsx
+5 -5
View File
@@ -23,20 +23,20 @@ export default function HomeBannerOffersCard(props) {
}} }}
> >
<div className="flex flex-col justify-between h-full"> <div className="flex flex-col justify-between h-full">
<div className="content flex justify-between items-center mb-5"> <div className="content flex justify-between items-center">
<div className="siderCardHeader"> <div className="siderCardHeader">
<h1 className="text-2xl font-bold text-dark-gray dark:text-white tracking-wide"> <h1 className="text-2xl font-bold text-dark-gray dark:text-white tracking-wide">
<span className="heroSilderTitle">{props.itemData.title}</span> <span className="heroSilderTitle">{props.itemData.title}</span>
</h1> </h1>
</div> </div>
</div> </div>
<div className="h-[233px]"> <div className="flex flex-col justify-around items-center flex-1">
<div className="siderCardDescription"> <div className="siderCardDescription">
{props.itemData.description} {props.itemData.description}
</div> </div>
<div className="siderCardButton"> <button className="w-[150px] h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white">
[ {props.itemData.button_text} ] {props.itemData.button_text}
</div> </button>
</div> </div>
</div> </div>
</Link> </Link>
src/components/MarketPlace/PopUp/MarketPopUp.jsx
+6 -2
View File
@@ -1,7 +1,6 @@
import React, { useCallback, useMemo, useState } from "react"; import { useCallback, useMemo, useState } from "react";
import ModalCom from "../../Helpers/ModalCom"; import ModalCom from "../../Helpers/ModalCom";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import { Form, Formik } from "formik";
import usersService from "../../../services/UsersService"; import usersService from "../../../services/UsersService";
import LoadingSpinner from "../../Spinners/LoadingSpinner"; import LoadingSpinner from "../../Spinners/LoadingSpinner";
import { PriceFormatter } from "../../Helpers/PriceFormatter"; import { PriceFormatter } from "../../Helpers/PriceFormatter";
@@ -106,6 +105,11 @@ const MarketPopUp = ({ details, onClose, situation, marketInt }) => {
// let addedIntDate = marketInt?.added?.split(" ")[0]; // let addedIntDate = marketInt?.added?.split(" ")[0];
let expireIntDate = marketInt?.expire?.split(" ")[0]; let expireIntDate = marketInt?.expire?.split(" ")[0];
// let cleanedText = details?.job_description.replace(/&lt;/g, '<')
// .replace(/&gt;/g, '>')
// .replace(/&quot;/g, '"')
// .replace(/&amp;/g, '&')
return ( return (
<ModalCom action={onClose} situation={situation} className="edit-popup"> <ModalCom action={onClose} situation={situation} className="edit-popup">
<div className="logout-modal-wrapper md:w-[750px] md:h-[660px] h-full bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto"> <div className="logout-modal-wrapper md:w-[750px] md:h-[660px] h-full bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto">
src/components/UserHeader/CommonHead.jsx
+3 -1
View File
@@ -9,7 +9,9 @@ export default function CommonHead({ className,commonHeadData }) {
className || "" className || ""
}`} }`}
> >
{commonHeadData?.length > 0 && <RecomendedSliders bannerData={commonHeadData} /> } {commonHeadData?.length > 0 && (
<RecomendedSliders bannerData={commonHeadData} />
)}
{/*<div className="lg:w-8/12 w-full mb-8 lg:mb-0">*/} {/*<div className="lg:w-8/12 w-full mb-8 lg:mb-0">*/}
{/* /!*<h1 className="text-2xl text-dark-gray dark:text-white font-bold mb-2">*!/*/} {/* /!*<h1 className="text-2xl text-dark-gray dark:text-white font-bold mb-2">*!/*/}
{/* /!* This is common head which will appear as needed , will take many shape*!/*/} {/* /!* This is common head which will appear as needed , will take many shape*!/*/}
src/components/UserHeader/RecomendedSliders.jsx
+5 -3
View File
@@ -102,16 +102,18 @@ export default function RecomendedSliders({ className,bannerData }) {
{bannerData.map((item, index) => ( {bannerData.map((item, index) => (
<Link key={index} to={`/${item.link_path}`}> <Link key={index} to={`/${item.link_path}`}>
<div className="item"> <div className="item">
<div className={`commonHeaderSliderItem flex flex-col justify-between items-center ${item.short_style}`}> <div
className={`commonHeaderSliderItem flex gap-1 flex-col justify-between items-center ${item.short_style}`}
>
{/* title */} {/* title */}
<div className="flex justify-center"> <div className="flex justify-center items-center text-center">
<p className="text-base font-bold text-dark-gray dark:text-white"> <p className="text-base font-bold text-dark-gray dark:text-white">
{item.short_title} {item.short_title}
</p> </p>
</div> </div>
{/* username */} {/* username */}
<div className="flex justify-center mb-1"> <div className="flex justify-center mb-1">
<p className="text-xs text-thin-light-gray"> <p className="text-xs text-thin-light-gray text-justify">
{item.short_description} {item.short_description}
</p> </p>
</div> </div>
src/components/jobPopout/EditJobPopout.jsx
+4 -4
View File
@@ -10,7 +10,7 @@ import { tableReload } from "../../store/TableReloads";
import { useDispatch } from "react-redux"; import { useDispatch } from "react-redux";
const validationSchema = Yup.object().shape({ const validationSchema = Yup.object().shape({
currency: Yup.string() country: Yup.string()
.min(1, "Minimum 3 characters") .min(1, "Minimum 3 characters")
.max(25, "Maximum 25 characters") .max(25, "Maximum 25 characters")
.required("Country is required"), .required("Country is required"),
@@ -60,7 +60,7 @@ const EditJobPopOut = ({
let initialValues = { let initialValues = {
// initial values for formik // initial values for formik
currency: details.currency, country: details.currency,
price: details?.price, price: details?.price,
title: details?.title, title: details?.title,
description: details?.description, description: details?.description,
@@ -152,8 +152,8 @@ const EditJobPopOut = ({
inputBg="bg-slate-100" inputBg="bg-slate-100"
inputClass="input-curve lg border border-light-purple" inputClass="input-curve lg border border-light-purple"
type="text" type="text"
name="currency" name="country"
value={props.values.currency} value={props.values.country}
inputHandler={props.handleChange} inputHandler={props.handleChange}
blurHandler={props.handleBlur} blurHandler={props.handleBlur}
disable={true} disable={true}
src/index.css
+3 -3
View File
@@ -69,9 +69,9 @@
.commonHeaderSliderItem { .commonHeaderSliderItem {
background-color: aliceblue; background-color: aliceblue;
border-radius: 10px; border-radius: 10px;
margin: 0px 5px 0px 5px; height: 100px;
height: 95px; margin: 0 5px;
padding: 5px; padding: 10px;
} }
.short_style{ .short_style{
src/views/MarketPlacePage.jsx
+2 -4
View File
@@ -3,13 +3,11 @@ import MarketPlace from "../components/MarketPlace";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
export default function MarketPlacePage() { export default function MarketPlacePage() {
let { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
return ( return (
<> <>
<MarketPlace <MarketPlace commonHeadData={commonHeadBanner?.result_list} />
commonHeadData={commonHeadBanner?.result_list} />
</> </>
); );
} }