auto selecting currency if user has only one wallet #687
@@ -49,10 +49,14 @@ export default function AssignMediaTask({
|
||||
family_uid
|
||||
}) {
|
||||
|
||||
const {userDetails} = useSelector((state) => state?.userDetails); // CHECKS IF USER Details are avaliable, to determine if user is active
|
||||
|
||||
const { walletDetails } = useSelector((state) => state?.walletDetails); // WALLET STORE
|
||||
|
||||
// For form initial values
|
||||
const initialValues = {
|
||||
// initial values for formik
|
||||
currency: "",
|
||||
currency: walletDetails.data.length == 1 ? walletDetails.data[0].country : '',
|
||||
amount: "",
|
||||
job_description: "",
|
||||
timeline_days: "",
|
||||
@@ -62,9 +66,7 @@ export default function AssignMediaTask({
|
||||
};
|
||||
|
||||
|
||||
const {userDetails} = useSelector((state) => state?.userDetails); // CHECKS IF USER Details are avaliable, to determine if user is active
|
||||
|
||||
const { walletDetails } = useSelector((state) => state?.walletDetails); // WALLET STORE
|
||||
|
||||
// let imageSrc = (localStorage.getItem("session_token")
|
||||
// ? `${userDetails?.session_image_server}${localStorage.getItem("session_token")}/job/${activeMedia.uid}` : ""); // FOR GETTING JOB IMAGE
|
||||
@@ -144,7 +146,7 @@ export default function AssignMediaTask({
|
||||
{/* Price */}
|
||||
<div className="field w-full">
|
||||
<label htmlFor="price" className="job-label flex gap-1">
|
||||
Price
|
||||
Reward
|
||||
<span className='text-red-500 text-base'>{props.errors.amount && props.touched.amount && '*'}</span>
|
||||
</label>
|
||||
<InputCom
|
||||
@@ -165,7 +167,7 @@ export default function AssignMediaTask({
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="currency"
|
||||
className="job-label flex gap-1"
|
||||
className="job-label flex gap-1 invisible"
|
||||
>
|
||||
Currency
|
||||
{props.errors.currency && props.touched.currency && <span className="text-base text-red-500">*</span>}
|
||||
@@ -174,8 +176,9 @@ export default function AssignMediaTask({
|
||||
id="currency"
|
||||
name="currency"
|
||||
value={props.values.currency}
|
||||
className={`input-field w-full h-[42px] flex items-center px-2 mt-2 rounded-full placeholder:text-base text-dark-gray dark:text-white bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none`}
|
||||
className={`input-field w-full h-[42px] flex items-center px-2 mt-2 rounded-full placeholder:text-base text-dark-gray dark:text-white bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none ${props.errors.currency && props.touched.currency && 'border border-red-500'}`}
|
||||
onChange={props.handleChange}
|
||||
disabled={walletDetails.data.length == 1}
|
||||
>
|
||||
{walletDetails?.loading ? (
|
||||
<option className="text-slate-500 text-[13.975px]" value="">
|
||||
@@ -183,18 +186,34 @@ export default function AssignMediaTask({
|
||||
</option>
|
||||
) : walletDetails.data.length ? (
|
||||
<>
|
||||
<option className="text-slate-500 text-[13.975px]" value="">
|
||||
Select
|
||||
</option>
|
||||
{walletDetails.data?.map((item, index) => (
|
||||
<option
|
||||
key={index}
|
||||
className="text-slate-500 text-lg"
|
||||
value={item?.country}
|
||||
>
|
||||
{item?.code}
|
||||
</option>
|
||||
))}
|
||||
{walletDetails.data.length == 1 ?
|
||||
<>
|
||||
{walletDetails.data?.map((item, index) => (
|
||||
<option
|
||||
key={index}
|
||||
className="text-slate-500 text-lg"
|
||||
value={item?.country}
|
||||
>
|
||||
{item?.code}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
:
|
||||
<>
|
||||
<option className="text-slate-500 text-[13.975px]" value="">
|
||||
Select
|
||||
</option>
|
||||
{walletDetails.data?.map((item, index) => (
|
||||
<option
|
||||
key={index}
|
||||
className="text-slate-500 text-lg"
|
||||
value={item?.country}
|
||||
>
|
||||
{item?.code}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
}
|
||||
</>
|
||||
) : (
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
@@ -223,7 +242,7 @@ export default function AssignMediaTask({
|
||||
{publicArray.length && (
|
||||
<>
|
||||
<option className="text-slate-500 text-[13.975px]" value="">
|
||||
Duration
|
||||
Select
|
||||
</option>
|
||||
{publicArray.map(({ name, duration }, idx) => (
|
||||
<option
|
||||
|
||||
@@ -26,6 +26,9 @@ const AssignTaskPopout = ({
|
||||
}) => {
|
||||
const {parentAssignJobToKid} = SocketValues()
|
||||
|
||||
const { walletDetails } = useSelector((state) => state?.walletDetails); // WALLET STORE
|
||||
|
||||
|
||||
const apiCall = new usersService();
|
||||
|
||||
let { pathname, state } = useLocation();
|
||||
@@ -86,7 +89,7 @@ const AssignTaskPopout = ({
|
||||
const [formState, setFormState] = useState({
|
||||
// Initialize form state with desired fields
|
||||
banner: details?.banner || "default.jpg",
|
||||
country: details?.country || "",
|
||||
country: details?.country ? details?.country : walletDetails.data.length == 1 ? walletDetails.data[0].country : '',
|
||||
price: details?.price || "",
|
||||
title: details?.title || "",
|
||||
description: details?.description || "",
|
||||
|
||||
@@ -102,7 +102,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
htmlFor="Job Delivery Details"
|
||||
className='job-label'
|
||||
>
|
||||
Job Delivery Details
|
||||
Delivery Detail
|
||||
{/* {props.errors.job_detail && props.touched.job_detail && <span className="text-[12px] text-red-500">{props.errors.job_detail}</span>} */}
|
||||
</label>
|
||||
<textarea
|
||||
@@ -144,7 +144,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="country"
|
||||
className="job-label"
|
||||
className="job-label invisible"
|
||||
>
|
||||
Currency
|
||||
{/* {props.errors.country && props.touched.country && <span className="text-[12px] text-red-500">{props.errors.country}</span>} */}
|
||||
@@ -155,6 +155,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
value={formState.country}
|
||||
className={`input-field w-full h-[42px] flex items-center px-2 mt-2 rounded-full placeholder:text-base text-dark-gray dark:text-white bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none`}
|
||||
onChange={handleInputChange}
|
||||
disabled={walletDetails.data.length == 1}
|
||||
// onBlur={props.handleBlur}
|
||||
>
|
||||
{walletDetails?.loading ? (
|
||||
@@ -163,18 +164,34 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
</option>
|
||||
) : walletDetails.data.length ? (
|
||||
<>
|
||||
<option className="text-slate-500 text-[13.975px]" value="">
|
||||
Select
|
||||
</option>
|
||||
{walletDetails.data?.map((item, index) => (
|
||||
<option
|
||||
key={index}
|
||||
className="text-slate-500 text-lg"
|
||||
value={item?.country}
|
||||
>
|
||||
{item?.code}
|
||||
</option>
|
||||
))}
|
||||
{walletDetails.data.length == 1 ?
|
||||
<>
|
||||
{walletDetails.data?.map((item, index) => (
|
||||
<option
|
||||
key={index}
|
||||
className="text-slate-500 text-lg"
|
||||
value={item?.country}
|
||||
>
|
||||
{item?.code}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
:
|
||||
<>
|
||||
<option className="text-slate-500 text-[13.975px]" value="">
|
||||
Select
|
||||
</option>
|
||||
{walletDetails.data?.map((item, index) => (
|
||||
<option
|
||||
key={index}
|
||||
className="text-slate-500 text-lg"
|
||||
value={item?.country}
|
||||
>
|
||||
{item?.code}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
}
|
||||
</>
|
||||
) : (
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
@@ -205,7 +222,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
{publicArray.length && (
|
||||
<>
|
||||
<option className="text-slate-500 text-[13.975px]" value="">
|
||||
Duration
|
||||
Select
|
||||
</option>
|
||||
{publicArray.map(({ name, duration }, idx) => (
|
||||
<option
|
||||
|
||||
@@ -0,0 +1,58 @@
|
||||
import React, { useState } from "react";
|
||||
import useToggle from "../../hooks/useToggle";
|
||||
import { drawerToggle } from "../../store/drawer";
|
||||
import { useSelector } from "react-redux";
|
||||
import MobileSidebar from "../Partials/MobileSideBar";
|
||||
|
||||
|
||||
export default function DashboardMediaPage({ children }) {
|
||||
|
||||
const { drawer } = useSelector((state) => state.drawer);
|
||||
const [MobileSideBar, setMobileSidebar] = useToggle(false);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="nft-main-wrapper-layout w-full mx-auto">
|
||||
<div className={`nft-wrapper-layout-container 2xl:pr-20 md:pr-10 pr-2 pl-2 md:pl-0 w-full min-h-screen flex`}>
|
||||
|
||||
{/* end sidebar */}
|
||||
<div className={`nft-header-container-wrapper flex-1 md:ml-10 ${drawer ? "2xl:ml-[375px] xl:ml-[310px]" : "xl:ml-[110px]"} h-full`}>
|
||||
{/* header */}
|
||||
<div className="nft-header w-full lg:h-[100px] h-[70px] default-border-bottom dark:border-[#292967] z-40 xl:sticky fixed top-0 left-0 bg-slate-300 animate-pulse duration-100">
|
||||
</div>
|
||||
{/* container */}
|
||||
<div className="nft-container 2xl:flex 2xl:space-x-8 h-full mb-12 lg:mt-[140px] mt-24 xl:mt-10 flex flex-col xl:flex-row items-start justify-center gap-4">
|
||||
<div className="w-full h-full bg-slate-200 animate-pulse duration-300">
|
||||
<div className="my-4 lg:flex justify-between items-start space-y-4 lg:space-x-4 lg:space-y-0">
|
||||
<div className="w-full p-10 mb-4 border-b pb-4 lg:pb-0 lg:mb-0 lg:border-b-0">
|
||||
<div className="mb-4 w-full min-h-[500px] bg-slate-200 animate-pulse duration-100"></div>
|
||||
|
||||
<div className="w-full p-4 h-20 bg-slate-300 animate-pulse duration-200 dark:bg-black rounded-2xl shadow-md md:flex md:justify-between gap-2"></div>
|
||||
</div>
|
||||
|
||||
<div className="p-10 w-full lg:w-2/5 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-1 gap-4">
|
||||
{/* TEXTAREA SECTION */}
|
||||
<div className="w-full h-40 mb-3">
|
||||
<div className="w-full h-full bg-slate-200 dark:bg-black rounded-2xl shadow-md animate-pulse duration-100"></div>
|
||||
</div>
|
||||
{/* END OF TEXTAREA */}
|
||||
|
||||
{/* MESSAGE SECTION */}
|
||||
<div className="w-full h-40">
|
||||
<div className="w-full h-full bg-slate-200 dark:bg-black rounded-2xl shadow-md animate-pulse duration-300"></div>
|
||||
</div>
|
||||
{/* END OF MESSAGE */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* <div className="nft-right-side-content 2xl:w-[270px] w-full h-full 2xl:flex justify-center relative flex-[20%]">
|
||||
<RightSideBar myJobList={userJobList} />
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -1,9 +1,12 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import React, { lazy, Suspense, useEffect, useState } from "react";
|
||||
import { useLocation, useNavigate } from "react-router-dom";
|
||||
import ActiveJobs from "../components/MyActiveJobs/ActiveJobs";
|
||||
import ActiveJobsMedia from "../components/MyActiveJobs/ActiveJobsMedia";
|
||||
// import ActiveJobsMedia from "../components/MyActiveJobs/ActiveJobsMedia";
|
||||
import usersService from "../services/UsersService";
|
||||
import { useSelector } from "react-redux";
|
||||
import LoadingSpinner from "../components/Spinners/LoadingSpinner";
|
||||
|
||||
const ActiveJobsMedia = lazy(() => import("../components/MyActiveJobs/ActiveJobsMedia"));
|
||||
|
||||
/**
|
||||
* This code defines a React functional component called `ManageActiveJobs`.
|
||||
@@ -65,11 +68,13 @@ function ManageActiveJobs() {
|
||||
return (
|
||||
<>
|
||||
{details.job_type == 'MEDIA' ?
|
||||
<ActiveJobsMedia
|
||||
details={state}
|
||||
activeJobMesList={activeJobMesList}
|
||||
reloadActiveJobList={setActiveJobMesListReload}
|
||||
/>
|
||||
<Suspense fallback={<Fallback />}>
|
||||
<ActiveJobsMedia
|
||||
details={state}
|
||||
activeJobMesList={activeJobMesList}
|
||||
reloadActiveJobList={setActiveJobMesListReload}
|
||||
/>
|
||||
</Suspense>
|
||||
: details.job_type == 'TASK' ?
|
||||
<ActiveJobs
|
||||
details={state}
|
||||
@@ -84,3 +89,11 @@ function ManageActiveJobs() {
|
||||
}
|
||||
|
||||
export default ManageActiveJobs;
|
||||
|
||||
let Fallback = () => {
|
||||
return (
|
||||
<div className="w-full flex justify-center items-center">
|
||||
<LoadingSpinner size='20' color='skyblue' height='h-screen' />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user