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

Merge branch 'common-home-banner' of WrenchBoard/Users-Wrench into master

Browse Source
This commit is contained in:
Olusesan Ameye
2023-06-10 20:48:08 +00:00
committed by Gogs
parent d0e1a7acd0 746cd00ec4
commit a2ef201cfd
15 changed files with 99 additions and 236 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Home/HomeSliders.jsx
+2 -2
View File
@@ -22,8 +22,8 @@ export default function HomeSliders(props) {
{/*<div className="item w-full h-full bg-white dark:bg-dark-white rounded-2xl overflow-hidden">*/}
{/* <img src={slider3} alt="slider" className="w-full h-full" />*/}
{/*</div>*/}
{props.bannerList.map((item, index) => (
<div className="item w-full h-full bg-white dark:bg-dark-white rounded-2xl overflow-hidden">
{props.bannerList?.length && props.bannerList.map((item, index) => (
<div key={index} className="item w-full h-full bg-white dark:bg-dark-white rounded-2xl overflow-hidden">
<HomeBannerOffersCard
itemData={item}
/>
src/components/Home/index.jsx
+2 -5
View File
@@ -17,10 +17,7 @@ export default function Home(props) {
const {userDetails} = useSelector((state) => state?.userDetails)
const commonHeadData =()=>{
console.log("COMMON HEAD DATA INDEX ----------------=====---------------------");
return 0;
}
const {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
// FUNCTION TO GET DASH DATA TO DETERMINE CURRENT TASK DUE TIME
const getHomeDate = () => {
@@ -42,7 +39,7 @@ export default function Home(props) {
<Layout>
<div className="home-page-wrapper">
{userDetails && userDetails?.account_type == "FAMILY" && (
<FamilyDash commonHeadData={commonHeadData} />
<FamilyDash commonHeadData={props.bannerList} />
)}
{userDetails && userDetails?.account_type == "FULL" && (
<FullAccountDash nextDueTask={nextDueTask} bannerList={props.bannerList} />
src/components/UserHeader/CommonHead.jsx
+1 -3
View File
@@ -3,15 +3,13 @@ import { Link } from "react-router-dom";
import RecomendedSliders from "./RecomendedSliders";
export default function CommonHead({ className,commonHeadData }) {
const bannerData = commonHeadData();
console.log("UUUUUUUU-",bannerData);
return (
<div
className={`create-nft w-full lg:h-[140px] shadow lg:flex rounded-lg justify-between items-center md:p-2 p-2 bg-white dark:bg-dark-white border-b dark:border-[#5356fb29] -2 border-pink mb-10 ${
className || ""
}`}
>
<RecomendedSliders bannerData={bannerData} />
{commonHeadData?.length > 0 && <RecomendedSliders bannerData={commonHeadData} /> }
{/*<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">*!/*/}
{/* /!* This is common head which will appear as needed , will take many shape*!/*/}
src/components/UserHeader/RecomendedSliders.jsx
+30 -173
View File
@@ -5,20 +5,22 @@ import top3 from "../../assets/images/top-buyer-3.png";
import top4 from "../../assets/images/top-buyer-4.png";
import Icons from "../Helpers/Icons";
import SliderCom from "../Helpers/SliderCom";
import { Link } from "react-router-dom";
export default function RecomendedSliders({ className ,bannerData }) {
export default function RecomendedSliders({ className,bannerData }) {
const settings = {
arrows: false,
dots: false,
infinite: true,
infinite: bannerData.length > 4 ? true : false,
autoplay: true,
slidesToShow: 4,
slidesToShow: bannerData.length > 4 ? 4 : bannerData.length,
slidesToScroll: 1,
responsive: [
{
breakpoint: 426,
settings: {
slidesToShow: 2,
infinite: bannerData.length > 2 ? true : false,
slidesToShow: bannerData.length > 2 ? 2 : bannerData.length,
slidesToScroll: 1,
},
},
@@ -97,177 +99,32 @@ export default function RecomendedSliders({ className ,bannerData }) {
{/*</div>*/}
<div className="slider-content">
<SliderCom settings={settings} selector={sellSlider}>
<div className="item">
<div className="commonHeaderSliderItem">
{/* title */}
<div className="flex justify-center">
<p className="text-base font-bold text-dark-gray dark:text-white">
This is short title
</p>
</div>
{/* username */}
<div className="flex justify-center mb-1">
<p className="text-xs text-thin-light-gray">
Some wondersull text here and more
</p>
</div>
{/* items */}
<div className="flex justify-center">
<div className="flex space-x-1 items-center text-purple text-xs">
<span>(button)</span>
{bannerData.map((item, index) => (
<Link key={index} to={item.link_path}>
<div className="item">
<div className="commonHeaderSliderItem">
{/* title */}
<div className="flex justify-center">
<p className="text-base font-bold text-dark-gray dark:text-white">
{item.short_title}
</p>
</div>
{/* username */}
<div className="flex justify-center mb-1">
<p className="text-xs text-thin-light-gray">
{item.short_description}
</p>
</div>
{/* items */}
<div className="flex justify-center">
<div className="flex space-x-1 items-center text-purple text-xs">
<span>{item.short_button_text}</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div className="item">
<div className="commonHeaderSliderItem">
{/* title */}
<div className="flex justify-center">
<p className="text-base font-bold text-dark-gray dark:text-white">
This is short title
</p>
</div>
{/* username */}
<div className="flex justify-center mb-1">
<p className="text-xs text-thin-light-gray">
Some wondersull text here and more
</p>
</div>
{/* items */}
<div className="flex justify-center">
<div className="flex space-x-1 items-center text-purple text-xs">
<span>(button)</span>
</div>
</div>
</div>
</div>
<div className="item">
<div className="commonHeaderSliderItem">
{/* title */}
<div className="flex justify-center">
<p className="text-base font-bold text-dark-gray dark:text-white">
This is short title
</p>
</div>
{/* username */}
<div className="flex justify-center mb-1">
<p className="text-xs text-thin-light-gray">
Some wondersull text here and more
</p>
</div>
{/* items */}
<div className="flex justify-center">
<div className="flex space-x-1 items-center text-purple text-xs">
<span>(button)</span>
</div>
</div>
</div>
</div>
<div className="item">
<div className="commonHeaderSliderItem">
{/* title */}
<div className="flex justify-center">
<p className="text-base font-bold text-dark-gray dark:text-white">
This is short title
</p>
</div>
{/* username */}
<div className="flex justify-center mb-1">
<p className="text-xs text-thin-light-gray">
Some wondersull text here and more
</p>
</div>
{/* items */}
<div className="flex justify-center">
<div className="flex space-x-1 items-center text-purple text-xs">
<span>(button)</span>
</div>
</div>
</div>
</div>
<div className="item">
<div className="commonHeaderSliderItem">
{/* title */}
<div className="flex justify-center">
<p className="text-base font-bold text-dark-gray dark:text-white">
This is short title
</p>
</div>
{/* username */}
<div className="flex justify-center mb-1">
<p className="text-xs text-thin-light-gray">
Some wondersull text here and more
</p>
</div>
{/* items */}
<div className="flex justify-center">
<div className="flex space-x-1 items-center text-purple text-xs">
<span>(button)</span>
</div>
</div>
</div>
</div>
<div className="item">
<div className="commonHeaderSliderItem">
{/* title */}
<div className="flex justify-center">
<p className="text-base font-bold text-dark-gray dark:text-white">
This is short title
</p>
</div>
{/* username */}
<div className="flex justify-center mb-1">
<p className="text-xs text-thin-light-gray">
Some wondersull text here and more
</p>
</div>
{/* items */}
<div className="flex justify-center">
<div className="flex space-x-1 items-center text-purple text-xs">
<span>(button)</span>
</div>
</div>
</div>
</div>
<div className="item">
<div className="commonHeaderSliderItem">
{/* title */}
<div className="flex justify-center">
<p className="text-base font-bold text-dark-gray dark:text-white">
This is short title
</p>
</div>
{/* username */}
<div className="flex justify-center mb-1">
<p className="text-xs text-thin-light-gray">
Some wondersull text here and more
</p>
</div>
{/* items */}
<div className="flex justify-center">
<div className="flex space-x-1 items-center text-purple text-xs">
<span>(button)</span>
</div>
</div>
</div>
</div>
</Link>
))}
</SliderCom>
</div>
</>
src/middleware/AuthRoute.jsx
+14
View File
@@ -6,6 +6,7 @@ import { useDispatch, useSelector } from "react-redux";
import { updateUserDetails } from "../store/UserDetails";
import { updateJobs } from "../store/jobLists";
import { updateUserJobList } from "../store/userJobList";
import { commonHeadBanner } from "../store/CommonHeadBanner";
const AuthRoute = ({ redirectPath = "/login", children }) => {
const apiCall = useMemo(() => new usersService(), []);
@@ -120,6 +121,19 @@ const AuthRoute = ({ redirectPath = "/login", children }) => {
getMarketActiveJobList();
}, [apiCall, dispatch]);
//FUNCTION TO GET COMMON HEAD DATA
useEffect(()=>{
apiCall.getHeroJBanners().then((res) => {
if (res.data.internal_return < 0) {
return;
}
dispatch(commonHeadBanner(res.data));
})
.catch((error) => {
console.log('ERROR ', error)
});
},[])
return isLogin.loading ? (
<LoadingSpinner size="32" color="sky-blue" height="h-screen" />
) : // Stills needs fixing
src/store/CommonHeadBanner.js
+20
View File
@@ -0,0 +1,20 @@
import { createSlice } from "@reduxjs/toolkit";
const initialState = {
commonHeadBanner: {}
};
export const commonHeadBannerSlice = createSlice({
name: "commonHeadBanner",
initialState,
reducers: {
commonHeadBanner: (state,action) => {
state.commonHeadBanner = {...action.payload}
},
},
});
// Action creators are generated for each case reducer function
export const { commonHeadBanner } = commonHeadBannerSlice.actions;
export default commonHeadBannerSlice.reducer;
src/store/store.js
+3 -1
View File
@@ -5,6 +5,7 @@ import userDetailReducer from "./UserDetails";
import jobReducer from "./jobLists";
import tableReloadReducer from "./TableReloads";
import userJobListReducer from './userJobList'
import commonHeadBannerReducer from './CommonHeadBanner'
export default configureStore({
reducer: {
@@ -12,6 +13,7 @@ export default configureStore({
userDetails: userDetailReducer,
jobLists: jobReducer,
tableReload: tableReloadReducer,
userJobList: userJobListReducer
userJobList: userJobListReducer,
commonHeadBanner: commonHeadBannerReducer
},
});
src/views/BlogPage.jsx
+3 -5
View File
@@ -1,15 +1,13 @@
import React, { useContext, useState, useEffect } from "react";
import BlogItem from "../components/Blogs";
import { useSelector } from "react-redux";
export default function BlogPage() {
const commonHeadData = () => {
console.log("COMMON HEAD DATA ----------------=====---------------------");
return 0;
};
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
return (
<>
<BlogItem commonHeadData={commonHeadData} />
<BlogItem commonHeadData={commonHeadBanner.result_list} />
</>
);
}
src/views/HomePages.jsx
+5 -17
View File
@@ -1,29 +1,17 @@
import React, {useState, useEffect} from 'react'
import Home from "../components/Home";
import usersService from "../services/UsersService";
import { useSelector } from 'react-redux';
export default function HomePages() {
// const [marketActiveJobList, setMarketActiveJobList] = useState([]);
const [bannerList, setBannerList] = useState([]);
const api = new usersService();
const getHeroJBannersList = async () => {
try {
const res = await api.getHeroJBanners();
// console.log("BANNERS->",res.data);
setBannerList(res.data?.result_list);
} catch (error) {
console.log("Error getting BANNERS....");
}
};
useEffect(() => {
getHeroJBannersList();
}, []);
const {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
return (
<>
<Home
bannerList={bannerList}
bannerList={commonHeadBanner?.result_list}
/>
</>
);
src/views/MarketPlacePage.jsx
+4 -5
View File
@@ -1,16 +1,15 @@
import MarketPlace from "../components/MarketPlace";
import { useSelector } from "react-redux";
export default function MarketPlacePage() {
const commonHeadData =()=>{
console.log("COMMON HEAD DATA ----------------=====---------------------");
return 0;
}
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
return (
<>
<MarketPlace
commonHeadData={commonHeadData} />
commonHeadData={commonHeadBanner?.result_list} />
</>
);
}
src/views/MyActiveJobsPage.jsx
+3 -5
View File
@@ -2,12 +2,10 @@ import React, { useContext,useState, useEffect } from "react";
import usersService from "../services/UsersService";
//import MyJobs from "../components/MyJobs";
import MyActiveJobs from "../components/MyActiveJobs";
import { useSelector } from "react-redux";
export default function MyActiveJobsPage() {
const commonHeadData =()=>{
console.log("COMMON HEAD DATA ----------------=====---------------------");
return 0;
}
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
const [MyJobList, setMyJobList] = useState([]);
const api = new usersService();
//TARGET ENDPOINT[POST]http://10.204.5.100:9083/en/wrench/api/v1/jobmanageractive
@@ -28,7 +26,7 @@ export default function MyActiveJobsPage() {
<>
<MyActiveJobs
MyJobList={MyJobList}
commonHeadData={commonHeadData}
commonHeadData={commonHeadBanner.result_list}
/>
</>
);
src/views/MyJobsPage.jsx
+2 -5
View File
@@ -7,10 +7,7 @@ import MyJobs from "../components/MyJobs";
import { useSelector } from "react-redux";
export default function MyJobsPage() {
const commonHeadData = () => {
console.log("COMMON HEAD DATA ----------------=====---------------------");
return 0;
};
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
const {userJobList} = useSelector((state) => state.userJobList)
@@ -38,7 +35,7 @@ export default function MyJobsPage() {
// debugger;
return (
<>
<MyJobs MyJobList={userJobList} commonHeadData={commonHeadData} />
<MyJobs MyJobList={userJobList} commonHeadData={commonHeadBanner.result_list} />
</>
);
}
src/views/MyPendingJobsPage.jsx
+3 -5
View File
@@ -3,12 +3,10 @@ import usersService from "../services/UsersService";
//import MyJobs from "../components/MyJobs";
import MyActiveJobs from "../components/MyActiveJobs";
import MyPendingJobs from "../components/MyPendingJobs";
import { useSelector } from "react-redux";
export default function MyPendingJobsPage() {
const commonHeadData =()=>{
console.log("COMMON HEAD DATA ----------------=====---------------------");
return 0;
}
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
const [MyJobList, setMyJobList] = useState([]);
const api = new usersService();
@@ -29,7 +27,7 @@ export default function MyPendingJobsPage() {
<>
<MyPendingJobs
MyJobList={MyJobList}
commonHeadData={commonHeadData}
commonHeadData={commonHeadBanner.result_list}
/>
</>
);
src/views/MyReviewDueJobsPage.jsx
+3 -5
View File
@@ -1,12 +1,10 @@
import React, { useContext,useState, useEffect } from "react";
import usersService from "../services/UsersService";
import MyReviewDueJobs from "../components/MyActiveJobs/MyReviewDueJobs";
import { useSelector } from "react-redux";
export default function MyReviewDueJobsPage() {
const commonHeadData =()=>{
console.log("COMMON HEAD DATA ----------------=====---------------------");
return 0;
}
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
const [MyJobList, setMyJobList] = useState([]);
const api = new usersService();
const getMyJobList = async () => {
@@ -26,7 +24,7 @@ export default function MyReviewDueJobsPage() {
<>
<MyReviewDueJobs
MyJobList={MyJobList}
commonHeadData={commonHeadData}
commonHeadData={commonHeadBanner.result_list}
/>
</>
);
src/views/MyTaskPage.jsx
+4 -5
View File
@@ -8,6 +8,8 @@ import { useSelector } from "react-redux";
export default function MyTaskPage() {
const { myTaskTable } = useSelector((state) => state.tableReload);
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
const [MyActiveJobList, setMyActiveJobList] = useState({
loading: true,
status: false,
@@ -15,10 +17,7 @@ export default function MyTaskPage() {
});
const [MyActiveOffersList, setMyActiveOffersList] = useState([]);
const api = new usersService();
const commonHeadData = () => {
console.log("COMMON HEAD DATA ----------------=====---------------------");
return 0;
};
const getMyActiveJobList = async () => {
setMyActiveJobList({ loading: true, status: false, data: [] });
try {
@@ -53,7 +52,7 @@ export default function MyTaskPage() {
<MyTasks
ActiveJobList={MyActiveJobList}
MyActiveOffersList={MyActiveOffersList}
commonHeadData={commonHeadData}
commonHeadData={commonHeadBanner?.result_list}
/>
);
}