Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 victorAnumudu
|
f2aa7d12b5 | ||
 ameye
|
4f4e4c0034 |
@@ -14,7 +14,9 @@ export default function SocketIOContextProvider({children}) {
|
||||
|
||||
// // Messages States
|
||||
// const [message, setMessage] = useState("");
|
||||
const [socketMsgReceived, setSocketMsgReceived] = useState({type:'', msg:''});
|
||||
const [socketMsgReceived, setSocketMsgReceived] = useState('');
|
||||
|
||||
const [updateMarket, setUpdateMarket] = useState(false)
|
||||
|
||||
const joinRoom = (room) => {
|
||||
if (room !== "") {
|
||||
@@ -24,7 +26,8 @@ export default function SocketIOContextProvider({children}) {
|
||||
|
||||
useEffect(() => {
|
||||
socket.on("received_refreshmarket_jobs", (data) => {
|
||||
setSocketMsgReceived({type: 'market', msg: data?.message});
|
||||
setSocketMsgReceived(data?.message);
|
||||
setUpdateMarket(prev => !prev)
|
||||
});
|
||||
}, [socket]);
|
||||
|
||||
@@ -33,6 +36,7 @@ export default function SocketIOContextProvider({children}) {
|
||||
joinRoom,
|
||||
setSocketMsgReceived,
|
||||
socketMsgReceived,
|
||||
updateMarket,
|
||||
}
|
||||
|
||||
return (
|
||||
|
||||
@@ -2,22 +2,16 @@ import React, { useState, useEffect } from 'react';
|
||||
import blogOne from '../../assets/images/blog-1.jpg';
|
||||
import blogTwo from '../../assets/images/blog-2.jpg';
|
||||
import blogThree from '../../assets/images/blog-3.jpg';
|
||||
import JobsData from '../../Services/JobsData';
|
||||
// import JobsData from '../../Services/JobsData';
|
||||
import getConfig from './../../Config/config'
|
||||
import CountDownTimer from '../Helper/CountDownTimer';
|
||||
import { SocketValues } from '../../Contexts/SocketIOContext';
|
||||
|
||||
let CurrentJobsHero = () => {
|
||||
|
||||
let {socketMsgReceived} = SocketValues() // destructure FROM SOCKET
|
||||
|
||||
let CurrentJobsHero = ({jobs}) => {
|
||||
|
||||
var site = getConfig()[0];
|
||||
|
||||
var dashUrl = process.env.REACT_APP_DASH_URL;
|
||||
|
||||
let [jobs, setJobs] = useState([])
|
||||
|
||||
function titleLen(title){
|
||||
let maxl = 45;
|
||||
title.replace('/', ' ');
|
||||
@@ -28,14 +22,6 @@ let CurrentJobsHero = () => {
|
||||
return (title.length > maxl)? title.substring(0,maxl-2)+'...': title;
|
||||
}
|
||||
|
||||
useEffect(()=>{
|
||||
JobsData().then(res => {
|
||||
setJobs(res.data.result_list);
|
||||
}).catch(err => {
|
||||
console.log('startjoblist error', err)
|
||||
})
|
||||
},[socketMsgReceived])
|
||||
|
||||
return (
|
||||
<>
|
||||
{jobs.length < 1 ?
|
||||
|
||||
@@ -2,7 +2,7 @@ import React from 'react';
|
||||
import heroThumb from '../../assets/images/hero-thumb-7.png';
|
||||
import CurrentJobsHero from "./CurrentJobsHero";
|
||||
|
||||
function HomeNigeria() {
|
||||
function HomeNigeria({jobs}) {
|
||||
return (
|
||||
<>
|
||||
<section className="appie-hero-area">
|
||||
@@ -46,7 +46,7 @@ function HomeNigeria() {
|
||||
{/* <img src={heroThumb} alt="" />*/}
|
||||
{/* </div>*/}
|
||||
{/*</div>*/}
|
||||
<CurrentJobsHero />
|
||||
<CurrentJobsHero jobs={jobs} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,141 +1,121 @@
|
||||
import React, { Component } from 'react';
|
||||
import React, { Component, useEffect, useState } from 'react';
|
||||
import blogOne from '../../assets/images/blog-1.jpg';
|
||||
import blogTwo from '../../assets/images/blog-2.jpg';
|
||||
import blogThree from '../../assets/images/blog-3.jpg';
|
||||
import JobsData from '../../Services/JobsData';
|
||||
// import JobsData from '../../Services/JobsData';
|
||||
import getConfig from './../../Config/config'
|
||||
import CountDownTimer from '../Helper/CountDownTimer';
|
||||
|
||||
class RecentJobsOne extends Component {
|
||||
let RecentJobsOne = ({jobs}) => {
|
||||
|
||||
constructor() {
|
||||
// debugger;
|
||||
super();
|
||||
this.state = { jobsDataResults: [] };
|
||||
|
||||
var site = getConfig()[0];
|
||||
|
||||
var dashUrl = process.env.REACT_APP_DASH_URL;
|
||||
|
||||
function titleLen(title){
|
||||
let maxl = 45;
|
||||
title.replace('/', ' ');
|
||||
title.replace('www.', '');
|
||||
title.replace('.com', '');
|
||||
title.replace('http//', '');
|
||||
|
||||
return (title.length > maxl)? title.substring(0,maxl-2)+'...': title;
|
||||
}
|
||||
|
||||
async componentDidMount(){
|
||||
// debugger;
|
||||
JobsData().then(res => {
|
||||
this.setState({jobsDataResults:res.data.result_list});
|
||||
}).catch(err => {
|
||||
console.log('startjoblist error', err)
|
||||
})
|
||||
}
|
||||
|
||||
titleLen(title){
|
||||
let maxl = 45;
|
||||
title.replace('/', ' ');
|
||||
title.replace('www.', '');
|
||||
title.replace('.com', '');
|
||||
title.replace('http//', '');
|
||||
|
||||
return (title.length > maxl)? title.substring(0,maxl-2)+'...': title;
|
||||
}
|
||||
// if (jobsDataResults ()== null){
|
||||
// return null;
|
||||
// }
|
||||
render() {
|
||||
var site = getConfig()[0];
|
||||
if ( this.state.jobsDataResults== undefined ){
|
||||
return null;
|
||||
}
|
||||
var dashUrl = process.env.REACT_APP_DASH_URL;
|
||||
|
||||
if (this.state.jobsDataResults.length == 0){
|
||||
return <></>;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<section className="appie-blog-area pt-90 pb-95">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="appie-section-title text-center">
|
||||
<h3 className="appie-title">Current Projects</h3>
|
||||
</div>
|
||||
</div>
|
||||
return (
|
||||
<>
|
||||
{jobs.length < 1 ?
|
||||
null
|
||||
:
|
||||
<section className="appie-blog-area pt-90 pb-95">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="appie-section-title text-center">
|
||||
<h3 className="appie-title">Current Projects</h3>
|
||||
</div>
|
||||
<div className="row">
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
|
||||
{
|
||||
this.state.jobsDataResults.map((i, index) => {
|
||||
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
|
||||
var postDt = new Date(i.expire).toLocaleDateString("en-US", options);
|
||||
if(index < 24){
|
||||
return (
|
||||
<div className="col-md-6 col-xl-3">
|
||||
<div
|
||||
className="appie-single-service container-fluid mt-30 wow animated fadeInUp boxBorder d-flex align-items-center"
|
||||
data-wow-duration="3000ms"
|
||||
data-wow-delay="200ms"
|
||||
>
|
||||
<div className="content d-flex flex-column justify-content-between" style={{height: '200px', width: '100%'}}>
|
||||
<div className="titleBox">
|
||||
<h3 className="title">
|
||||
<a href={dashUrl}>
|
||||
<span className='font_black'>{this.titleLen(i.title)} </span>
|
||||
{
|
||||
jobs.map((i, index) => {
|
||||
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
|
||||
var postDt = new Date(i.expire).toLocaleDateString("en-US", options);
|
||||
if(index < 24){
|
||||
return (
|
||||
<div className="col-md-6 col-xl-3">
|
||||
<div
|
||||
className="appie-single-service container-fluid mt-30 wow animated fadeInUp boxBorder d-flex align-items-center"
|
||||
data-wow-duration="3000ms"
|
||||
data-wow-delay="200ms"
|
||||
>
|
||||
<div className="content d-flex flex-column justify-content-between" style={{height: '250px', width: '100%'}}>
|
||||
<div className="titleBox">
|
||||
<h3 className="title">
|
||||
<a href={dashUrl}>
|
||||
<span className='font_black'>{titleLen(i.title)} </span>
|
||||
</a>
|
||||
</h3>
|
||||
</div>
|
||||
<div className='p-0 container-fluid'>
|
||||
<div><hr /></div>
|
||||
<div className="blog-meta">
|
||||
<ul>
|
||||
<li className="expire">
|
||||
<a href={dashUrl} className='d-block'>
|
||||
<div className='font_red d-flex align-items-start'>
|
||||
<div className='pr-2'>Expires :</div>
|
||||
<CountDownTimer targetDate={postDt}/>
|
||||
</div>
|
||||
</a>
|
||||
</h3>
|
||||
</div>
|
||||
<div className='p-0 container-fluid'>
|
||||
<div><hr /></div>
|
||||
<div className="blog-meta">
|
||||
<ul>
|
||||
<li className="expire">
|
||||
<a href={dashUrl} className='d-block'>
|
||||
<div className='font_red d-flex align-items-start'>
|
||||
<div className='pr-2'>Expires :</div>
|
||||
<CountDownTimer targetDate={postDt}/>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className='lmoreTxt d-flex justify-content-end align-items-center'>
|
||||
<a href={process.env.REACT_APP_DASH_URL_LOGIN}>
|
||||
Learn More <i className="fal fa-arrow-right" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className='lmoreTxt d-flex justify-content-end align-items-center'>
|
||||
<a href={process.env.REACT_APP_DASH_URL_LOGIN}>
|
||||
Learn More <i className="fal fa-arrow-right" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
<div className="col-lg-3 col-md-6">
|
||||
<div
|
||||
className="appie-blog-item mt-30 wow animated fadeInUp"
|
||||
data-wow-duration="3000ms"
|
||||
data-wow-delay="600ms"
|
||||
>
|
||||
|
||||
<div className="content">
|
||||
|
||||
<h3 className="title">
|
||||
<a href={dashUrl}>
|
||||
Find more opportunities at our marketplace.
|
||||
</a>
|
||||
</h3>
|
||||
<a href="https://dashboard.wrenchboard.com/login">
|
||||
Login now <i className="fal fa-arrow-right" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
<div className="col-lg-3 col-md-6">
|
||||
<div
|
||||
className="appie-blog-item mt-30 wow animated fadeInUp"
|
||||
data-wow-duration="3000ms"
|
||||
data-wow-delay="600ms"
|
||||
>
|
||||
|
||||
<div className="content">
|
||||
|
||||
<h3 className="title">
|
||||
<a href={dashUrl}>
|
||||
Find more opportunities at our marketplace.
|
||||
</a>
|
||||
</h3>
|
||||
<a href="https://dashboard.wrenchboard.com/login">
|
||||
Login now <i className="fal fa-arrow-right" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default RecentJobsOne;
|
||||
@@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import useToggle from '../../Hooks/useToggle';
|
||||
import BackToTop from '../BackToTop';
|
||||
import Drawer from '../Mobile/Drawer';
|
||||
@@ -19,20 +19,34 @@ import WrenchBoardHome from './WrenchBoardHome';
|
||||
import RecentJobsOne from './RecentJobsOne';
|
||||
import HomeNigeria from "./HomeNigeria";
|
||||
import FeaturedScreen from './FeaturedScreen';
|
||||
import { SocketValues } from '../../Contexts/SocketIOContext';
|
||||
import JobsData from '../../Services/JobsData';
|
||||
//import BlogData from './../../Services/BlogData';
|
||||
|
||||
function HomeOne() {
|
||||
|
||||
let {updateMarket} = SocketValues() // destructure FROM SOCKET
|
||||
|
||||
const [drawer, drawerAction] = useToggle(false);
|
||||
|
||||
let [jobs, setJobs] = useState([])
|
||||
|
||||
useEffect(()=>{
|
||||
JobsData().then(res => {
|
||||
setJobs(res.data.result_list);
|
||||
}).catch(err => {
|
||||
console.log('startjoblist error', err)
|
||||
})
|
||||
},[updateMarket])
|
||||
|
||||
return (
|
||||
<>
|
||||
<Drawer drawer={drawer} action={drawerAction.toggle} />
|
||||
<HomeOneHeader action={drawerAction.toggle} />
|
||||
<HomeNigeria />
|
||||
<HomeNigeria jobs={jobs} />
|
||||
{/*<HeroHomeOne />*/}
|
||||
<ServicesHomeOne />
|
||||
<RecentJobsOne />
|
||||
<RecentJobsOne jobs={jobs} />
|
||||
<FeaturesHomeOne />
|
||||
{/*<FaqHomeOne />*/}
|
||||
{/*<TrafficHomeOne />*/}
|
||||
|
||||
Reference in New Issue
Block a user