Merge branch 'assign-job-popout-style' of WrenchBoard/Users-Wrench into master
This commit is contained in:
Gogs
@@ -114,4 +114,7 @@ REACT_APP_SHOW_NEW_FAMILY_DASH=1
|
||||
REACT_APP_SHOW_ACCOUNT_DASH=1
|
||||
|
||||
# Displays the slider banners
|
||||
REACT_APP_SHOW_SLIDER_BANNERS=0
|
||||
REACT_APP_SHOW_SLIDER_BANNERS=0
|
||||
|
||||
# FOR MEDIA LINK
|
||||
REACT_APP_MEDIA_LINK='https://dev-media.wrenchboard.com '
|
||||
+4
-1
@@ -82,4 +82,7 @@ REACT_APP_SHOW_NEW_FAMILY_DASH=1
|
||||
REACT_APP_SHOW_ACCOUNT_DASH=1
|
||||
|
||||
# Displays the slider banners
|
||||
REACT_APP_SHOW_SLIDER_BANNERS=0
|
||||
REACT_APP_SHOW_SLIDER_BANNERS=0
|
||||
|
||||
# FOR MEDIA LINK
|
||||
REACT_APP_MEDIA_LINK='https://dev-media.wrenchboard.com '
|
||||
+4
-1
@@ -88,4 +88,7 @@ REACT_APP_SHOW_NEW_FAMILY_DASH=1
|
||||
REACT_APP_SHOW_ACCOUNT_DASH=1
|
||||
|
||||
# Displays the slider banners
|
||||
REACT_APP_SHOW_SLIDER_BANNERS=0
|
||||
REACT_APP_SHOW_SLIDER_BANNERS=0
|
||||
|
||||
# FOR MEDIA LINK
|
||||
REACT_APP_MEDIA_LINK='https://media.wrenchboard.com '
|
||||
Generated
+80
@@ -36,6 +36,7 @@
|
||||
"react-toastify": "^9.0.1",
|
||||
"redux": "^4.2.0",
|
||||
"slick-carousel": "^1.8.1",
|
||||
"socket.io-client": "^4.4.1",
|
||||
"web-vitals": "^1.0.1",
|
||||
"yup": "^1.1.1"
|
||||
}
|
||||
@@ -3717,6 +3718,11 @@
|
||||
"@sinonjs/commons": "^1.7.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@socket.io/component-emitter": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz",
|
||||
"integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg=="
|
||||
},
|
||||
"node_modules/@surma/rollup-plugin-off-main-thread": {
|
||||
"version": "2.2.3",
|
||||
"resolved": "https://registry.npmjs.org/@surma/rollup-plugin-off-main-thread/-/rollup-plugin-off-main-thread-2.2.3.tgz",
|
||||
@@ -7078,6 +7084,46 @@
|
||||
"node": ">= 0.8"
|
||||
}
|
||||
},
|
||||
"node_modules/engine.io-client": {
|
||||
"version": "6.5.3",
|
||||
"resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-6.5.3.tgz",
|
||||
"integrity": "sha512-9Z0qLB0NIisTRt1DZ/8U2k12RJn8yls/nXMZLn+/N8hANT3TcYjKFKcwbw5zFQiN4NTde3TSY9zb79e1ij6j9Q==",
|
||||
"dependencies": {
|
||||
"@socket.io/component-emitter": "~3.1.0",
|
||||
"debug": "~4.3.1",
|
||||
"engine.io-parser": "~5.2.1",
|
||||
"ws": "~8.11.0",
|
||||
"xmlhttprequest-ssl": "~2.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/engine.io-client/node_modules/ws": {
|
||||
"version": "8.11.0",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-8.11.0.tgz",
|
||||
"integrity": "sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==",
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"bufferutil": "^4.0.1",
|
||||
"utf-8-validate": "^5.0.2"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"bufferutil": {
|
||||
"optional": true
|
||||
},
|
||||
"utf-8-validate": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/engine.io-parser": {
|
||||
"version": "5.2.2",
|
||||
"resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.2.2.tgz",
|
||||
"integrity": "sha512-RcyUFKA93/CXH20l4SoVvzZfrSDMOTUS3bWVpTt2FuFP+XYrL8i8oonHP7WInRyVHXh0n/ORtoeiE1os+8qkSw==",
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/enhanced-resolve": {
|
||||
"version": "5.12.0",
|
||||
"resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.12.0.tgz",
|
||||
@@ -16099,6 +16145,32 @@
|
||||
"jquery": ">=1.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/socket.io-client": {
|
||||
"version": "4.7.5",
|
||||
"resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-4.7.5.tgz",
|
||||
"integrity": "sha512-sJ/tqHOCe7Z50JCBCXrsY3I2k03iOiUe+tj1OmKeD2lXPiGH/RUCdTZFoqVyN7l1MnpIzPrGtLcijffmeouNlQ==",
|
||||
"dependencies": {
|
||||
"@socket.io/component-emitter": "~3.1.0",
|
||||
"debug": "~4.3.2",
|
||||
"engine.io-client": "~6.5.2",
|
||||
"socket.io-parser": "~4.2.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/socket.io-parser": {
|
||||
"version": "4.2.4",
|
||||
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.2.4.tgz",
|
||||
"integrity": "sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==",
|
||||
"dependencies": {
|
||||
"@socket.io/component-emitter": "~3.1.0",
|
||||
"debug": "~4.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/sockjs": {
|
||||
"version": "0.3.24",
|
||||
"resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz",
|
||||
@@ -18111,6 +18183,14 @@
|
||||
"resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
|
||||
"integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw=="
|
||||
},
|
||||
"node_modules/xmlhttprequest-ssl": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.0.0.tgz",
|
||||
"integrity": "sha512-QKxVRxiRACQcVuQEYFsI1hhkrMlrXHPegbbd1yn9UHOmRxY+si12nQYzri3vbzt8VdTTRviqcKxcyllFas5z2A==",
|
||||
"engines": {
|
||||
"node": ">=0.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/xtend": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
|
||||
|
||||
@@ -300,7 +300,7 @@ const AssignTaskPopout = ({
|
||||
) : (
|
||||
<>
|
||||
<div
|
||||
className={`job-action-modal-body w-full md:grid ${
|
||||
className={`job-action-modal-body w-full min-h-[450px] max-h-[450px] overflow-y-auto md:grid ${
|
||||
taskType !== "new" ? "md:grid-cols-2" : "md:grid-cols-1"
|
||||
}`}
|
||||
>
|
||||
@@ -315,7 +315,7 @@ const AssignTaskPopout = ({
|
||||
checked={taskType == "select"}
|
||||
onChange={switchTaskType}
|
||||
/>
|
||||
<span>Select Task</span>
|
||||
<span className="text-lg tracking-wide font-semibold">Select Task</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 text-sky-blue text-base">
|
||||
<input
|
||||
@@ -326,12 +326,12 @@ const AssignTaskPopout = ({
|
||||
checked={taskType == "new"}
|
||||
onChange={switchTaskType}
|
||||
/>
|
||||
<span>New Task</span>
|
||||
<span className="text-lg tracking-wide font-semibold">New Task</span>
|
||||
</div>
|
||||
</div>
|
||||
{/* Task Type === select */}
|
||||
{taskType == "select" && (
|
||||
<div className="p-4 w-full h-[400px] overflow-y-auto bg-slate-100 rounded-md dark:bg-[#11131f] dark:text-white">
|
||||
<div className="p-4 w-full h-[380px] overflow-y-auto bg-slate-100 rounded-md dark:bg-[#11131f] dark:text-white">
|
||||
{familyTask?.data?.length ? (
|
||||
familyTask?.data?.map((item, index) => (
|
||||
<div
|
||||
@@ -364,7 +364,7 @@ const AssignTaskPopout = ({
|
||||
</div>
|
||||
)}
|
||||
{taskType == "new" && (
|
||||
<div className="p-4 w-full h-[400px]">
|
||||
<div className="p-4 w-full">
|
||||
<NewTasks
|
||||
formState={formState}
|
||||
setFormState={setFormState}
|
||||
@@ -382,17 +382,25 @@ const AssignTaskPopout = ({
|
||||
<p className="text-lg font-bold text-dark-gray dark:text-white tracking-wide border-b-2">
|
||||
{activeTask?.data?.title}
|
||||
</p>
|
||||
<div className="my-3">
|
||||
{/* <div className="my-3">
|
||||
<Detail
|
||||
label="Description"
|
||||
value={activeTask?.data?.description}
|
||||
/>
|
||||
</div> */}
|
||||
<div className="my-3 w-full">
|
||||
<label className="job-label">
|
||||
Description
|
||||
</label>
|
||||
<p className="p-1 text-sm text-slate-900 dark:text-white">
|
||||
{activeTask?.data?.description}
|
||||
</p>
|
||||
</div>
|
||||
<div className="grid grid-cols-2">
|
||||
<div className="w-full">
|
||||
<div className="my-3 w-full flex items-center gap-1">
|
||||
<label className="job-label">
|
||||
Price
|
||||
Reward
|
||||
</label>
|
||||
<p className="p-1 text-sm text-slate-900 dark:text-white">
|
||||
{PriceFormatter(
|
||||
|
||||
@@ -49,11 +49,91 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
|
||||
return (
|
||||
<form className="w-full flex justify-between items-start">
|
||||
<div className="flex flex-col gap-3 max-w-[77%]">
|
||||
<div className="w-full block sm:grid grid-cols-3 gap-2">
|
||||
|
||||
<div className="w-full flex flex-col gap-2 col-span-2">
|
||||
{/* Title */}
|
||||
<div className="field w-full">
|
||||
<label htmlFor="title" className="job-label">Title</label>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
// label="Title"
|
||||
// labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
type="text"
|
||||
name="title"
|
||||
value={formState.title}
|
||||
inputHandler={handleInputChange}
|
||||
// blurHandler={props.handleBlur}
|
||||
// error={props.errors.title && props.touched.title && props.errors.title}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Description */}
|
||||
{/* <div className="field w-full mb-[5px]">
|
||||
<label htmlFor="description" className="job-label">Description</label>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
// label="Description"
|
||||
// labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
type="text"
|
||||
name="description"
|
||||
value={formState.description}
|
||||
inputHandler={handleInputChange}
|
||||
// blurHandler={props.handleBlur}
|
||||
// error={props.errors.description && props.touched.description && props.errors.description}
|
||||
/>
|
||||
</div> */}
|
||||
<div className="field flex flex-col sm:flex-row w-full gap-2">
|
||||
<div className="w-full">
|
||||
<label
|
||||
htmlFor="description"
|
||||
className='job-label'
|
||||
>
|
||||
Description
|
||||
</label>
|
||||
<textarea
|
||||
id="description"
|
||||
rows="5"
|
||||
className={`input-field px-3 py-2 placeholder:text-base text-dark-gray dark:text-white w-full h-[100px] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-[#dce4e9] rounded-[10px]`}
|
||||
style={{ resize: "none" }}
|
||||
name="description"
|
||||
value={formState.description}
|
||||
onChange={handleInputChange}
|
||||
// onBlur={props.handleBlur}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Details */}
|
||||
<div className="field flex flex-col sm:flex-row w-full gap-2">
|
||||
<div className="w-full">
|
||||
<label
|
||||
htmlFor="Job Delivery Details"
|
||||
className='job-label'
|
||||
>
|
||||
Job Delivery Details
|
||||
{/* {props.errors.job_detail && props.touched.job_detail && <span className="text-[12px] text-red-500">{props.errors.job_detail}</span>} */}
|
||||
</label>
|
||||
<textarea
|
||||
id="Job Delivery Details"
|
||||
rows="5"
|
||||
className={`input-field px-3 py-2 placeholder:text-base text-dark-gray dark:text-white w-full h-[100px] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-[#dce4e9] rounded-[10px]`}
|
||||
style={{ resize: "none" }}
|
||||
name="job_detail"
|
||||
value={formState.job_detail}
|
||||
onChange={handleInputChange}
|
||||
// onBlur={props.handleBlur}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* inputs starts here */}
|
||||
<div className="grid md:grid-cols-3 grid-cols-1 gap-6 mb-[5px]">
|
||||
<div className="w-full flex flex-col gap-2">
|
||||
{/* Currency */}
|
||||
<div className="field w-full mb-6 xl:mb-0">
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="country"
|
||||
className="job-label"
|
||||
@@ -65,7 +145,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
id="country"
|
||||
name="country"
|
||||
value={formState.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 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}
|
||||
// onBlur={props.handleBlur}
|
||||
>
|
||||
@@ -115,7 +195,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
</div>
|
||||
|
||||
{/* Duration */}
|
||||
<div className="field w-full mb-6 xl:mb-0">
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="timeline_days"
|
||||
className="job-label"
|
||||
@@ -127,7 +207,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
id="timeline_days"
|
||||
name="timeline_days"
|
||||
value={formState.timeline_days}
|
||||
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 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}
|
||||
// onBlur={props.handleBlur}
|
||||
>
|
||||
@@ -138,6 +218,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
</option>
|
||||
{publicArray.map(({ name, duration }, idx) => (
|
||||
<option
|
||||
key={idx}
|
||||
className="text-slate-500 text-[13.975px]"
|
||||
value={duration}
|
||||
>
|
||||
@@ -148,74 +229,19 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
)}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Title */}
|
||||
<div className="field w-full mb-[5px]">
|
||||
<label htmlFor="title" className="job-label">Title</label>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
// label="Title"
|
||||
// labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
type="text"
|
||||
name="title"
|
||||
value={formState.title}
|
||||
inputHandler={handleInputChange}
|
||||
// blurHandler={props.handleBlur}
|
||||
// error={props.errors.title && props.touched.title && props.errors.title}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Description */}
|
||||
<div className="field w-full mb-[5px]">
|
||||
<label htmlFor="description" className="job-label">Description</label>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
// label="Description"
|
||||
// labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
type="text"
|
||||
name="description"
|
||||
value={formState.description}
|
||||
inputHandler={handleInputChange}
|
||||
// blurHandler={props.handleBlur}
|
||||
// error={props.errors.description && props.touched.description && props.errors.description}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Details */}
|
||||
<div className="field flex flex-col sm:flex-row w-full mb-[5px] gap-2">
|
||||
{/* Banner Image */}
|
||||
<div className="w-full">
|
||||
<label
|
||||
htmlFor="Job Delivery Details"
|
||||
className='job-label'
|
||||
>
|
||||
Job Delivery Details
|
||||
{/* {props.errors.job_detail && props.touched.job_detail && <span className="text-[12px] text-red-500">{props.errors.job_detail}</span>} */}
|
||||
</label>
|
||||
<textarea
|
||||
id="Job Delivery Details"
|
||||
rows="5"
|
||||
className={`input-field px-3 py-2 placeholder:text-base text-dark-gray dark:text-white w-full h-[100px] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-[#dce4e9] rounded-[10px]`}
|
||||
style={{ resize: "none" }}
|
||||
name="job_detail"
|
||||
value={formState.job_detail}
|
||||
onChange={handleInputChange}
|
||||
// onBlur={props.handleBlur}
|
||||
/>
|
||||
<div className="h-32 w-full">
|
||||
<img
|
||||
src={selectImage}
|
||||
alt="task_banner_img"
|
||||
className="w-full h-full object-contain"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Banner Image */}
|
||||
<div className="max-w-[20%] w-full">
|
||||
<div className="h-32 w-full">
|
||||
<img
|
||||
src={selectImage}
|
||||
alt="task_banner_img"
|
||||
className="w-full h-full object-contain"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
|
||||
@@ -5,6 +5,7 @@ import AvailableJobsCard from "../Cards/AvailableJobsCard";
|
||||
import DataIteration from "../Helpers/DataIteration";
|
||||
import SelectBox from "../Helpers/SelectBox";
|
||||
import NewPaginatedList from "../Pagination/NewPaginatedList";
|
||||
import InfiniteScroll from "../infiniteScroll/InfiniteScroll";
|
||||
|
||||
export default function MainSection({
|
||||
className,
|
||||
@@ -158,6 +159,37 @@ export default function MainSection({
|
||||
)
|
||||
}
|
||||
</NewPaginatedList>
|
||||
// <InfiniteScroll
|
||||
// allData={products}
|
||||
// addItemBy={3}
|
||||
// intialItemsToShow={9}
|
||||
// >
|
||||
// {
|
||||
// ({dataToShow})=>(
|
||||
// <div className="filter-navigate-content w-full min-h-[600px]">
|
||||
// <div
|
||||
// className={
|
||||
// contentDisplay == "grid"
|
||||
// ? "grid lg:grid-cols-3 sm:grid-cols-2 gap-[30px]"
|
||||
// : "w-full"
|
||||
// }
|
||||
// >
|
||||
// {
|
||||
// dataToShow.map((datum, index) => (
|
||||
// <div key={datum.job_uid+index}>
|
||||
// <AvailableJobsCard
|
||||
// contentDisplay={contentDisplay}
|
||||
// image_server={image_server}
|
||||
// datas={datum}
|
||||
// />
|
||||
// </div>
|
||||
// ))
|
||||
// }
|
||||
// </div>
|
||||
// </div>
|
||||
// )
|
||||
// }
|
||||
// </InfiniteScroll>
|
||||
:
|
||||
<div className="w-full h-[40rem] bg-white dark:bg-dark-white flex justify-center items-center">
|
||||
No Jobs Found!
|
||||
|
||||
@@ -0,0 +1,62 @@
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import LoadingSpinner from '../Spinners/LoadingSpinner'
|
||||
|
||||
export default function InfiniteScroll({
|
||||
allData=data,
|
||||
addItemBy=12,
|
||||
intialItemsToShow=39,
|
||||
children
|
||||
}) {
|
||||
|
||||
let [currentPage, setCurrentPage] = useState(intialItemsToShow)
|
||||
|
||||
let [loading, setLoading] = useState(false)
|
||||
|
||||
let dataToShow = allData.slice(0, currentPage)
|
||||
|
||||
// let [winScr, setWinScr] = useState(0)
|
||||
|
||||
const customScroll = ()=>{
|
||||
let wi = window.innerHeight + window.scrollY
|
||||
// let scrollContainer = document.querySelector('.scroll-container').scrollHeight
|
||||
let scrollBody = document.body.offsetHeight
|
||||
if(wi >= scrollBody && allData.length > currentPage){
|
||||
setLoading(true)
|
||||
setTimeout(()=>{
|
||||
setCurrentPage(prev => prev+addItemBy)
|
||||
setLoading(false)
|
||||
},2000)
|
||||
}
|
||||
// else if(window.scrollY < winScr && currentPage > intialItemsToShow){
|
||||
// setCurrentPage(prev => prev-addItemBy)
|
||||
// window.scrollTo(0,wi)
|
||||
// setWinScr(window.scrollY)
|
||||
// }
|
||||
// else if(winScr == 0 && currentPage > intialItemsToShow){
|
||||
// setCurrentPage(prev => intialItemsToShow)
|
||||
// window.scrollTo(0,0)
|
||||
// setWinScr(window.scrollY)
|
||||
// }
|
||||
}
|
||||
useEffect(()=>{
|
||||
window.addEventListener('scroll', customScroll)
|
||||
return () => {
|
||||
window.removeEventListener('scroll', customScroll)
|
||||
}
|
||||
},[currentPage])
|
||||
|
||||
return (
|
||||
<div className='w-full'>
|
||||
|
||||
{children({ dataToShow })}
|
||||
|
||||
{loading &&
|
||||
<div className='w-full my-2 p-2 flex justify-center items-center'>
|
||||
<LoadingSpinner size='8' />
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// let data = new Array(100).fill(0).map((_,i) => i )
|
||||
@@ -123,13 +123,13 @@ function FamilyOfferJobPopout({ details, onClose, situation }) {
|
||||
return (
|
||||
<ModalCom action={onClose} situation={situation}>
|
||||
<div className="logout-modal-wrapper w-[90%] md:w-[768px] bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto">
|
||||
<div className="logout-modal-header w-full flex items-center justify-between lg:p-6 px-[30px] py-[23px] border-b dark:border-[#5356fb29] border-light-purple">
|
||||
<h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
|
||||
<div className="modal-header-con">
|
||||
<h1 className="modal-title">
|
||||
Start Task
|
||||
</h1>
|
||||
<button
|
||||
type="button"
|
||||
className="text-[#374557] dark:text-red-500"
|
||||
className="modal-close-btn"
|
||||
onClick={onClose}
|
||||
>
|
||||
<svg
|
||||
@@ -153,7 +153,7 @@ function FamilyOfferJobPopout({ details, onClose, situation }) {
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div className="md:flex bg-white rounded-lg shadow-lg">
|
||||
<div className="md:flex bg-white rounded-lg">
|
||||
<div className="p-4 w-full md:w-3/4 md:border-r-2">
|
||||
<div className="flex gap-2">
|
||||
<div className="image-wrapper w-32">
|
||||
@@ -261,12 +261,12 @@ function FamilyOfferJobPopout({ details, onClose, situation }) {
|
||||
</div>
|
||||
|
||||
{/* close button */}
|
||||
<div className="p-6 flex justify-end">
|
||||
<div className="modal-footer-wrapper flex justify-end">
|
||||
<button
|
||||
onClick={onClose}
|
||||
disabled={requestStatus.loading}
|
||||
type="button"
|
||||
className="border-gradient text-18 tracking-wide px-2 py-2 rounded-full"
|
||||
className="custom-btn border-gradient"
|
||||
>
|
||||
<span className="text-gradient">Cancel</span>
|
||||
</button>
|
||||
|
||||
@@ -103,13 +103,13 @@ function OfferJobPopout({ details, onClose, situation }) {
|
||||
return (
|
||||
<ModalCom action={onClose} situation={situation}>
|
||||
<div className="logout-modal-wrapper w-[90%] md:w-[768px] bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto">
|
||||
<div className="logout-modal-header w-full flex items-center justify-between lg:p-6 px-[30px] py-[23px] border-b dark:border-[#5356fb29] border-light-purple">
|
||||
<h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
|
||||
<div className="modal-header-con">
|
||||
<h1 className="modal-title">
|
||||
Start Task
|
||||
</h1>
|
||||
<button
|
||||
type="button"
|
||||
className="text-[#374557] dark:text-red-500"
|
||||
className="modal-close-btn"
|
||||
onClick={onClose}
|
||||
>
|
||||
<svg
|
||||
@@ -133,7 +133,7 @@ function OfferJobPopout({ details, onClose, situation }) {
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div className="md:flex bg-white dark:bg-dark-white rounded-lg shadow-lg">
|
||||
<div className="md:flex bg-white dark:bg-dark-white rounded-lg">
|
||||
<div className="p-4 w-full md:w-3/4 md:border-r-2">
|
||||
<p className="text-lg my-5 font-semibold text-slate-900 dark:text-white tracking-wide">
|
||||
{details.title}
|
||||
@@ -234,12 +234,12 @@ function OfferJobPopout({ details, onClose, situation }) {
|
||||
</div>
|
||||
|
||||
{/* close button */}
|
||||
<div className="p-6 flex justify-end">
|
||||
<div className="modal-footer-wrapper flex justify-end">
|
||||
<button
|
||||
onClick={onClose}
|
||||
disabled={requestStatus.loading}
|
||||
type="button"
|
||||
className="border-gradient text-18 tracking-wide px-2 py-2 rounded-full"
|
||||
className="custom-btn border-gradient"
|
||||
>
|
||||
<span className="text-gradient">Cancel</span>
|
||||
</button>
|
||||
|
||||
Reference in New Issue
Block a user