Compare commits

...

8 Commits

Author SHA1 Message Date
victorAnumudu 9f11e8b415 input error position changed 2023-07-03 19:32:18 +01:00
CHIEFSOFT\ameye a1d74b773d family pictures 2023-07-02 19:30:48 -04:00
ameye 7969199584 Merge branch 'blog-count' of WrenchBoard/Users-Wrench into master 2023-07-02 21:44:55 +00:00
victorAnumudu 9dd8f49ff8 blog count implemented 2023-07-02 22:12:28 +01:00
ameye fa5e9b8107 Merge branch 'resources-page' of WrenchBoard/Users-Wrench into master 2023-07-02 16:56:36 +00:00
Ebube 3e7ab11e62 Merge branch 'master' of https://gitlab.chiefsoft.net/WrenchBoard/Users-Wrench into resources-page 2023-07-02 17:40:38 +01:00
Ebube 6f259ad8ad . 2023-07-02 16:24:49 +01:00
ameye a31a20652f Merge branch 'resources-blog-tab' of WrenchBoard/Users-Wrench into master 2023-07-02 11:52:54 +00:00
16 changed files with 214 additions and 109 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

+13 -21
View File
@@ -23,15 +23,15 @@ const validationSchema = Yup.object().shape({
})
.required("Price is required"),
title: Yup.string()
.min(3, "Minimum 3 characters")
.max(100, "Maximum 25 characters")
.min(25, "Minimum 25 characters")
.max(45, "Maximum 45 characters")
.required("Title is required"),
description: Yup.string()
.min(3, "Minimum 3 characters")
.min(25, "Minimum 25 characters")
.max(250, "Maximum 250 characters")
.required("Description is required"),
job_detail: Yup.string()
.min(3, "Minimum 3 characters")
.min(25, "Minimum 25 characters")
.max(250, "Maximum 250 characters")
.required("Details is required"),
timeline_days: Yup.number()
@@ -162,19 +162,16 @@ function AddJob({ popUpHandler, categories }) {
<div className="field w-full mb-6 xl:mb-0">
<label
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 flex item-center gap-1"
>
Currency
{props.errors.country && props.touched.country && <span className="text-[12px] text-red-500">{props.errors.country}</span>}
</label>
<select
id="country"
name="country"
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 ${
props.errors.country && props.touched.country
? "border-[#ff0a0a63] shadow-red-500 border-[0.5px] animate-shake"
: "border border-[#f5f8fa] dark:border-[#5e6278]"
}`}
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}
onBlur={props.handleBlur}
>
@@ -218,7 +215,7 @@ function AddJob({ popUpHandler, categories }) {
value={props.values.price}
inputHandler={props.handleChange}
blurHandler={props.handleBlur}
errorBorder={props.errors.price && props.touched.price}
error={props.errors.price && props.touched.price && props.errors.price}
/>
</div>
</div>
@@ -236,7 +233,7 @@ function AddJob({ popUpHandler, categories }) {
value={props.values.title}
inputHandler={props.handleChange}
blurHandler={props.handleBlur}
errorBorder={props.errors.title && props.touched.title}
error={props.errors.title && props.touched.title && props.errors.title}
/>
</div>
@@ -252,9 +249,7 @@ function AddJob({ popUpHandler, categories }) {
value={props.values.description}
inputHandler={props.handleChange}
blurHandler={props.handleBlur}
errorBorder={
props.errors.description && props.touched.description
}
error={props.errors.description && props.touched.description && props.errors.description}
/>
</div>
@@ -263,18 +258,15 @@ function AddJob({ popUpHandler, categories }) {
<div className="sm:w-[60%] w-full">
<label
htmlFor="Job Delivery Details"
className='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"'
className='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex items-center gap-1'
>
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] ${
props.errors.job_detail && props.touched.job_detail
? "border-[#ff0a0a63] shadow-red-500 border-[0.5px] animate-shake"
: "border border-[#f5f8fa] dark:border-[#5e6278]"
} rounded-[10px]`}
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={props.values.job_detail}
+72
View File
@@ -0,0 +1,72 @@
import React, { useState } from "react";
import { Link } from "react-router-dom";
import { toast } from "react-toastify";
import localImgLoad from "../../lib/localImgLoad";
import Icons from "../Helpers/Icons";
export default function FamilyMarketCard({
className,
datas,
hidden = false,
}) {
// debugger;
const [addFavorite, setValue] = useState(datas.whishlisted);
const [options, setOption] = useState(false);
const favoriteHandler = () => {
if (!addFavorite) {
setValue(true);
toast.success("Added to Favorite List");
} else {
setValue(false);
toast.warn("Remove to Favorite List");
}
};
return (
<div
className={`card-style-two w-full h-[336px] p-[20px] bg-white dark:bg-dark-white rounded-2xl section-shadow ${
className || ""
}`}
>
<div className="flex flex-col justify-between w-full h-full">
<div className="thumbnail-area w-full">
<div
className="w-full h-[236px] p-6 rounded-xl overflow-hidden"
style={{
background: `url(${`https://blog.float.sg/wp-content/uploads/${datas.meta_value}`}) 0% 0% / cover no-repeat`,
}}
>
<div className="product-two-options flex justify-between mb-5 relative">
<div className="status">
{datas?.isActive && (
<span className="text-xs px-3 py-1.5 tracking-wide rounded-full bg-gold text-white">
Active
</span>
)}
</div>
</div>
{hidden && <div className="flex justify-center"></div>}
</div>
</div>
<div className="details-area">
{/* title */}
<Link to="/shop-details" className="mb-2.5">
<h1 className="font-bold text-xl tracking-wide line-clamp-1 text-dark-gray dark:text-white capitalize">
{datas.post_title}
</h1>
</Link>
<div className="flex justify-between">
<div className="flex items-center space-x-2"></div>
<div>
<button
type="button"
className="px-4 py-2.5 text-white text-sm bg-pink rounded-full tracking-wide"
>
View
</button>
</div>
</div>
</div>
</div>
</div>
);
}
+5 -8
View File
@@ -1,10 +1,6 @@
import React, { useState } from "react";
import { Link } from "react-router-dom";
import { toast } from "react-toastify";
import localImgLoad from "../../lib/localImgLoad";
import Icons from "../Helpers/Icons";
import Image from '../../assets/images/Linkedin.png'
export default function ProductCardStyleTwo({
className,
@@ -36,8 +32,8 @@ export default function ProductCardStyleTwo({
<div
className="w-full h-[236px] p-6 rounded-xl overflow-hidden"
style={{
background: `url(${`https://blog.wrenchboard.com/wp-content/uploads/${datas.meta_value}`}) 0% 0% / cover no-repeat`,
// background: `url(${`${bg}${datas.meta_value}`}) 0% 0% / cover no-repeat`,
// background: `url(${`https://blog.wrenchboard.com/wp-content/uploads/${datas.meta_value}`}) 0% 0% / cover no-repeat`,
background: `url(${`${bg}${datas.meta_value}`}) 0% 0% / cover no-repeat`,
}}
>
<div className="product-two-options flex justify-between mb-5 relative">
@@ -54,9 +50,9 @@ export default function ProductCardStyleTwo({
</div>
<div className="details-area">
{/* title */}
<a href={datas.guid} target="_blank" className="mb-2.5">
<a href={datas.guid} target="_blank" className="mb-2.5" rel="noreferrer">
<h1 className="font-bold text-xl tracking-wide line-clamp-1 text-dark-gray dark:text-white capitalize">
{datas.post_title}
{datas.post_title || "dummy title..."}
</h1>
</a>
<div className="flex justify-between">
@@ -66,6 +62,7 @@ export default function ProductCardStyleTwo({
href={datas.guid}
target="_blank"
className="px-4 py-2.5 text-white text-sm bg-pink rounded-full tracking-wide"
rel="noreferrer"
>
View
</a>
+36 -10
View File
@@ -3,6 +3,11 @@ import InputCom from "../Helpers/Inputs/InputCom";
import Layout from "../Partials/Layout";
import SiteService from "../../services/SiteService";
import ModalCom from "../Helpers/ModalCom";
import DataIteration from "../Helpers/DataIteration";
import SearchCom from "../Helpers/SearchCom";
import collections from "../../data/collectionplan_data.json";
import FamilyMarketCard from "../Cards/FamilyMarketCard";
import { Link } from "react-router-dom";
export default function FamilyMarket() {
const [selectTab, setValue] = useState("today");
@@ -24,7 +29,6 @@ export default function FamilyMarket() {
setValue(value);
};
return (
<Layout>
{/*<CommonHead />*/}
@@ -37,15 +41,8 @@ export default function FamilyMarket() {
<span
className={`${selectTab === "today" ? "block" : "hidden"}`}
>
Family Market
Suggest Task to the Parents
</span>
{/* <button
onClick={popUpHandler}
type="button"
className="text-white btn-gradient text-lg tracking-wide px-5 py-2 rounded-full"
>
Add
</button> */}
</h1>
</div>
<div className="slider-btns flex space-x-4">
@@ -55,11 +52,40 @@ export default function FamilyMarket() {
></div>
</div>
</div>
{/* Body */}
<div className="filter-section w-full items-center sm:flex justify-between mb-6">
{/* filter-search */}
<div className="sm:w-1/2 w-full sm:pr-20 pr-0 mb-5 sm:mb-0">
<SearchCom />
</div>
{/* filer-dropdown */}
<div className="flex-1 flex sm:justify-end">
<Link
to="/upload-product"
className="btn-gradient lg:flex hidden w-[153px] h-[46px] rounded-full text-white justify-center items-center"
>
Any Other Task
</Link>
</div>
</div>
<div className="content-section w-full-width">
<div className="grid lg:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-[30px]">
<DataIteration
datas={collections?.data}
startLength={process.env.REACT_APP_ZERO_STATE}
endLength={collections?.data.length}
>
{({ datas }) => (
<FamilyMarketCard key={datas.id} datas={datas} />
)}
</DataIteration>
</div>
</div>
</div>
</div>
{popUp && (
<ModalCom action={popUpHandler} situation={popUp}>
{/* */}
{/* */}
</ModalCom>
)}
</Layout>
@@ -22,7 +22,7 @@ export default function InputCom({
spanTag,
inputBg,
direction,
errorBorder,
error,
}) {
const inputRef = useRef(null);
// Entry Validation
@@ -48,7 +48,7 @@ export default function InputCom({
<div className={`flex items-center justify-between mb-2.5 ${labelClass}`}>
{label && (
<label
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 flex items-center gap-1"
htmlFor={name}
>
{label}
@@ -62,6 +62,8 @@ export default function InputCom({
{spanTag}
</span>
)}
{/* displays error is any */}
{error && <span className="text-[12px] text-red-500">{error}</span>}
</label>
)}
{forgotPassword && (
@@ -74,11 +76,7 @@ export default function InputCom({
)}
</div>
<div
className={`input-wrapper border ${
errorBorder
? "border-[#ff0a0a63] border-[0.5px] shadow-red-500 animate-shake"
: "border border-[#f5f8fa] dark:border-[#5e6278]"
} w-full rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base ${inputClass}`}
className={`input-wrapper border w-full rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base ${inputClass}`}
>
<input
placeholder={placeholder}
+2 -2
View File
@@ -1,7 +1,7 @@
import React from "react";
import Icons from "./Icons";
export default function SearchCom({ className, inputClasses }) {
export default function SearchCom({ className, inputClasses, placeholder }) {
return (
<div
className={`w-full h-[48px] pl-8 flex rounded-full overflow-hidden bg-white dark:bg-dark-white ${
@@ -17,7 +17,7 @@ export default function SearchCom({ className, inputClasses }) {
inputClasses || ""
}`}
type="text"
placeholder="Search items, collections..."
placeholder={placeholder || 'Search items, collections...'}
/>
</div>
</div>
@@ -25,8 +25,8 @@ export default function ParentWaiting({ className }) {
Waiting for Parent to Get Started...
</h1>
</div>
<div className="overview-section-wrapper lg:flex lg:h-[494px] lg:pace-x-2 flex-1">
<div className="lg:w-[540px] w-full h-full bg-white dark:bg-dark-white flex-[50%] rounded-2xl overflow-hidden mb-10">
<div className="overview-section-wrapper lg:flex lg:h-[494px] lg:pace-x-2 flex-1 lg:gap-8">
<div className=" w-full h-full bg-white dark:bg-dark-white flex-[50%] rounded-2xl overflow-hidden mb-10">
<img
src={activeAidsBanner}
alt="banner"
+16 -2
View File
@@ -27,7 +27,7 @@ export default function Resources(props) {
const tab_categories = __resources?.tab_categories?.data;
const collectionProducts = __resources?.collectiondata?.data;
const onSaleProducts = __resources?.marketdata?.data;
const CreatedBits = __resources?.productdata?.data;
const CreatedBits = __resources?.productdata?.datas;
const blogItems = __resources?.blogdata?.payload;
const [tab, setTab] = useState(tab_categories ? tab_categories[0]?.name : "");
@@ -60,6 +60,19 @@ export default function Resources(props) {
// Tab Item Component
const TabItem = ({ tabValue, isActive }) => {
let countNumber = (name) => { // FUNCTION TO DETERMINE THE COUNT NUMBER
if(name == 'blog'){
return blogItems?.blogdata?.length
}else if(name == 'onsale'){
return onSaleProducts?.length
}else if(name == 'owned'){
return ownProducts?.length
}else if(name == 'created'){
return CreatedSell?.length + CreatedBits?.length
}else{
return 0
}
}
return (
<li
className={`relative group inline`}
@@ -81,7 +94,8 @@ export default function Resources(props) {
: "text-thin-light-gray bg-[#F2B8FD]"
}`}
>
16
{/* 16 blog, onsale, owned,created */}
{countNumber(tabValue.name)}
</span>
</li>
);
+57 -51
View File
@@ -4,56 +4,62 @@ import SearchCom from "../../Helpers/SearchCom";
import ResourceBlogCard from "../../Cards/ResourceBlogCard";
export default function BlogTab({ className, blogdata }) {
// debugger;
return (
<>
<div className={`onsale-tab-wrapper w-full ${className || ""}`}>
<div className="main-container w-full">
<div className="filter-section w-full items-center sm:flex justify-between mb-6">
{/* filter-search */}
<div className="sm:w-1/2 w-full sm:pr-20 pr-0 mb-5 sm:mb-0">
<SearchCom />
</div>
{/* filer-dropdown */}
<div className="flex-1 flex sm:justify-end">
{/* <div className="flex space-x-1 items-center">*/}
{/*<span className="text-18 text-thin-light-gray">*/}
{/* Recently Received*/}
{/*</span>*/}
{/* <span>*/}
{/* <svg*/}
{/* width="20"*/}
{/* height="10"*/}
{/* viewBox="0 0 13 6"*/}
{/* fill="none"*/}
{/* xmlns="http://www.w3.org/2000/svg"*/}
{/* >*/}
{/* <path*/}
{/* opacity="0.7"*/}
{/* d="M12.4124 0.247421C12.3327 0.169022 12.2379 0.106794 12.1335 0.0643287C12.0291 0.0218632 11.917 0 11.8039 0C11.6908 0 11.5787 0.0218632 11.4743 0.0643287C11.3699 0.106794 11.2751 0.169022 11.1954 0.247421L7.27012 4.07837C7.19045 4.15677 7.09566 4.219 6.99122 4.26146C6.88678 4.30393 6.77476 4.32579 6.66162 4.32579C6.54848 4.32579 6.43646 4.30393 6.33202 4.26146C6.22758 4.219 6.13279 4.15677 6.05312 4.07837L2.12785 0.247421C2.04818 0.169022 1.95338 0.106794 1.84895 0.0643287C1.74451 0.0218632 1.63249 0 1.51935 0C1.40621 0 1.29419 0.0218632 1.18975 0.0643287C1.08531 0.106794 0.990517 0.169022 0.910844 0.247421C0.751218 0.404141 0.661621 0.616141 0.661621 0.837119C0.661621 1.0581 0.751218 1.2701 0.910844 1.42682L4.84468 5.26613C5.32677 5.73605 5.98027 6 6.66162 6C7.34297 6 7.99647 5.73605 8.47856 5.26613L12.4124 1.42682C12.572 1.2701 12.6616 1.0581 12.6616 0.837119C12.6616 0.616141 12.572 0.404141 12.4124 0.247421Z"*/}
{/* fill="#374557"*/}
{/* fillOpacity="0.6"*/}
{/* />*/}
{/* </svg>*/}
{/*</span>*/}
{/* </div>*/}
</div>
</div>
<div className="content-section w-full-width">
<div className="grid lg:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-[30px]">
<DataIteration
datas={blogdata?.blogdata}
startLength={process.env.REACT_APP_ZERO_STATE}
endLength={blogdata?.blogdata.length}
>
{({ datas }) => (
<ResourceBlogCard key={datas.id} datas={datas} bg={blogdata.image_url} />
)}
</DataIteration>
</div>
</div>
</div>
console.log("Blog data here>> ", blogdata);
// debugger;
return (
<>
<div className={`onsale-tab-wrapper w-full ${className || ""}`}>
<div className="main-container w-full">
<div className="filter-section w-full items-center sm:flex justify-between mb-6">
{/* filter-search */}
<div className="sm:w-1/2 w-full sm:pr-20 pr-0 mb-5 sm:mb-0">
<SearchCom placeholder='Search Blog Items...' />
</div>
</>
);
{/* filer-dropdown */}
<div className="flex-1 flex sm:justify-end">
{/* <div className="flex space-x-1 items-center">*/}
{/*<span className="text-18 text-thin-light-gray">*/}
{/* Recently Received*/}
{/*</span>*/}
{/* <span>*/}
{/* <svg*/}
{/* width="20"*/}
{/* height="10"*/}
{/* viewBox="0 0 13 6"*/}
{/* fill="none"*/}
{/* xmlns="http://www.w3.org/2000/svg"*/}
{/* >*/}
{/* <path*/}
{/* opacity="0.7"*/}
{/* d="M12.4124 0.247421C12.3327 0.169022 12.2379 0.106794 12.1335 0.0643287C12.0291 0.0218632 11.917 0 11.8039 0C11.6908 0 11.5787 0.0218632 11.4743 0.0643287C11.3699 0.106794 11.2751 0.169022 11.1954 0.247421L7.27012 4.07837C7.19045 4.15677 7.09566 4.219 6.99122 4.26146C6.88678 4.30393 6.77476 4.32579 6.66162 4.32579C6.54848 4.32579 6.43646 4.30393 6.33202 4.26146C6.22758 4.219 6.13279 4.15677 6.05312 4.07837L2.12785 0.247421C2.04818 0.169022 1.95338 0.106794 1.84895 0.0643287C1.74451 0.0218632 1.63249 0 1.51935 0C1.40621 0 1.29419 0.0218632 1.18975 0.0643287C1.08531 0.106794 0.990517 0.169022 0.910844 0.247421C0.751218 0.404141 0.661621 0.616141 0.661621 0.837119C0.661621 1.0581 0.751218 1.2701 0.910844 1.42682L4.84468 5.26613C5.32677 5.73605 5.98027 6 6.66162 6C7.34297 6 7.99647 5.73605 8.47856 5.26613L12.4124 1.42682C12.572 1.2701 12.6616 1.0581 12.6616 0.837119C12.6616 0.616141 12.572 0.404141 12.4124 0.247421Z"*/}
{/* fill="#374557"*/}
{/* fillOpacity="0.6"*/}
{/* />*/}
{/* </svg>*/}
{/*</span>*/}
{/* </div>*/}
</div>
</div>
<div className="content-section w-full-width">
<div className="grid lg:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-[30px]">
<DataIteration
datas={blogdata?.blogdata}
startLength={process.env.REACT_APP_ZERO_STATE}
endLength={blogdata?.blogdata.length}
>
{({ datas }) => (
<ResourceBlogCard
key={datas.id}
datas={datas}
bg={blogdata.image_url}
/>
)}
</DataIteration>
</div>
</div>
</div>
</div>
</>
);
}
+6 -6
View File
@@ -1,9 +1,9 @@
import FamilyManage from "../components/FamilyAcc/FamilyManage";
export default function FamilyManagePage() {
return (
<>
<FamilyManage />
</>
);
}
return (
<>
<FamilyManage />
</>
);
}