banner feedback fixed

src/components/Cards/ResourceBlogCard.jsx

@@ -0,0 +1,79 @@
+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 ProductCardStyleTwo({
+                                                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>
+    );
+}

src/components/FamilyAcc/Tabs/FamilyManageTabs.jsx

@@ -14,6 +14,9 @@ import LoadingSpinner from "../../Spinners/LoadingSpinner";
 import profile from "../../../assets/images/profile-info-profile.png";
 import FamilyTasks from "./FamilyTasks";
 
+import AssignTaskPopout from '../FamilyPopout/AssignTaskPopout'
+
+
 export default function FamilyManageTabs({
   className,
   accountDetails,
@@ -50,6 +53,13 @@ export default function FamilyManageTabs({
   const tabHandler = (value) => {
     setTab(value);
   };
+
+  let [familyTaskPopout, setFamilyTaskPopout] = useState(false) // DETERMINES WHEN FAMILY ADD TASK POPOUT DISPLAYS
+
+  const familyPopUpHandler = () => { // FUNCTION TO CHANGE THE FAMILY ADD TASK POPOIUT STATE
+    setFamilyTaskPopout(prev => !prev)
+  }
+
   //   For profile uploads
   const [profileImg, setProfileImg] = useState(profile);
   // profile img
@@ -120,7 +130,7 @@ export default function FamilyManageTabs({
       className={`w-full bg-white dark:bg-dark-white overflow-y-auto rounded-2xl section-shadow min-h-[520px] max-h-[600px] ${
         className || ""
       }`}
-    >
+    > 
       <div className="relative w-full overflow-x-auto sm:rounded-lg">
         <Suspense
           fallback={
@@ -141,21 +151,31 @@ export default function FamilyManageTabs({
             </div>
             <div className="col-span-3 justify-self-end h-full w-full">
               <div className="flex flex-col w-full">
-                <ul className="flex-[0.1] flex gap-2 items-center border-b border-b-[#FAFAF] w-full">
-                  {tabs.map(({ name, id }) => (
-                    <li
-                      onClick={() => tabHandler(name)}
-                      className={`p-4 flex hover:text-purple transition-all ease-in-out items-center cursor-pointer overflow-hidden text-xl ${
-                        tab === name
-                          ? "text-purple border-r"
-                          : " text-thin-light-gray"
-                      }`}
-                      key={id}
-                    >
-                      <h1>{name}</h1>
-                    </li>
-                  ))}
-                </ul>
+                <div className="w-full pr-8 flex items-center gap-1">
+                  <ul className="flex gap-2 items-center border-b border-b-[#FAFAF] w-full">
+                    {tabs.map(({ name, id }) => (
+                      <li
+                        onClick={() => tabHandler(name)}
+                        className={`p-4 flex hover:text-purple transition-all ease-in-out items-center cursor-pointer overflow-hidden text-xl ${
+                          tab === name
+                            ? "text-purple border-r"
+                            : " text-thin-light-gray"
+                        }`}
+                        key={id}
+                      >
+                        <h1>{name}</h1>
+                      </li>
+                    ))}
+                  </ul>
+                  <button
+                    type="button"
+                    onClick={familyPopUpHandler}
+                    className="p-1 my-1 w-[100px] flex justify-center items-center btn-gradient text-base rounded-full text-white"
+                  >
+                    Add task
+                    {/* {accountDetails?.firstname} */}
+                  </button>
+                </div>
                 <div className="flex-[0.9] lg:min-h-[450px] h-full">
                   {/* Your content here */}
                   {tabs.map(({ name, id }) => {
@@ -171,7 +191,6 @@ export default function FamilyManageTabs({
                             className={className}
                             loader={details.familyTasks.loading}
                             familyData={details.familyTasks.data}
-                            familyDetails={details.familyDetails.data}
                             accountDetails={accountDetails}
                           />
                         )}
@@ -193,6 +212,15 @@ export default function FamilyManageTabs({
           </div>
         </Suspense>
       </div>
+
+      {/* FAMILY ADD TASK POPOUT */}
+      {familyTaskPopout &&
+        <AssignTaskPopout 
+          action={familyPopUpHandler}
+          situation={familyTaskPopout}
+          familyDetails={details.familyDetails.data}
+        />
+      }
     </div>
   );
 }

src/components/FamilyAcc/Tabs/FamilyTasks.jsx

@@ -8,18 +8,12 @@ import Icons from "../../Helpers/Icons";
 import { PriceFormatter } from "../../Helpers/PriceFormatter";
 import ModalCom from "../../Helpers/ModalCom";
 import Detail from "../../jobPopout/popoutcomponent/Detail";
-import AssignTaskPopout from "../FamilyPopout/AssignTaskPopout";
 
-export default function FamilyTasks({ familyData, familyDetails, className, loader, accountDetails }) {
+
+export default function FamilyTasks({ familyData, className, loader, accountDetails }) {
   let navigate = useNavigate();
   let { pathname } = useLocation();
 
-  let [familyTaskPopout, setFamilyTaskPopout] = useState(false)
-
-  const familyPopUpHandler = () => {
-    setFamilyTaskPopout(prev => !prev)
-  }
-
   const [currentPage, setCurrentPage] = useState(0);
   const indexOfFirstItem = Number(currentPage);
   const indexOfLastItem =
@@ -43,15 +37,6 @@ export default function FamilyTasks({ familyData, familyDetails, className, load
         </div>
       ) : (
         <>
-          <div className="w-full p-2 my-2 flex justify-end items-center">
-            <button
-              type="button"
-              onClick={familyPopUpHandler}
-              className="px-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
-            >
-              Add task for {familyDetails?.firstname}
-            </button>
-          </div>
           {familyData && familyData?.result_list && (
             <div className="relative w-full overflow-x-auto sm:rounded-lg flex flex-col justify-between h-full">
               <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
@@ -157,13 +142,6 @@ export default function FamilyTasks({ familyData, familyDetails, className, load
           )}
         </>
       )}
-      {familyTaskPopout &&
-        <AssignTaskPopout 
-          action={familyPopUpHandler}
-          situation={familyTaskPopout}
-          familyDetails={familyDetails}
-        />
-      }
     </div>
   );
 }

src/components/Home/Hero.jsx

@@ -61,10 +61,10 @@ export default function Hero({ className, bannerList, nextDueTask }) {
             <div className="flex flex-col justify-between">
               <p className="text-base text-white tracking-wide">Current Task</p>
               <p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
-                {nextDueTask.next_due.item_code}
+                {(nextDueTask.next_due.item_code).substr(0,4)+'...'}
               </p>
               <p className="text-base text-white tracking-wide">
-                {nextDueTask.next_due.price} Naira
+                {nextDueTask.next_due.price * 0.01} Naira
               </p>
             </div>
             <div className="w-[1px] h-full bg-white-opacity"></div>

src/components/Resources/index.jsx

@@ -8,7 +8,7 @@ import LoadingSpinner from "../../components/Spinners/LoadingSpinner";
 import products from "../../data/product_data.json";
 import Layout from "../Partials/Layout";
 import {
-  ActivitiesTab,
+  ActivitiesTab, BlogTab,
   CollectionTab,
   CreatedTab,
   HiddenProductsTab,
@@ -21,13 +21,14 @@ export default function Resources(props) {
   const ownProducts = products.datas;
   // Resource Props
   const __resources = props.MyResourceData;
-
+//debugger;
   // Collection Items
   const collectionProducts = __resources?.collectiondata?.data;
   const tab_categories = __resources?.tab_categories?.data;
   const onSaleProducts = __resources?.marketdata?.data;
   const CreatedSell = __resources?.marketdata?.data;
   const CreatedBits = __resources?.productdata?.data;
+  const blogItems =   __resources?.blogdata?.payload;
 
   const [tab, setTab] = useState(tab_categories ? tab_categories[0]?.name : "");
 
@@ -39,6 +40,7 @@ export default function Resources(props) {
 
   // Category Components
   const tabComponents = {
+    blog: <BlogTab blogdata={blogItems} />,
     onsale: <OnSaleTab products={onSaleProducts} />,
     owned: <OwnTab products={ownProducts} />,
     created: (
@@ -124,7 +126,7 @@ export default function Resources(props) {
                         to="/upload-product"
                         className="btn-gradient lg:flex hidden w-[153px] h-[46px] rounded-full text-white justify-center items-center"
                       >
-                        Upload Product
+                        Add My Item
                       </Link>
                     </div>
                   </div>

src/components/Resources/tabs/BlogTab.jsx

@@ -0,0 +1,59 @@
+import ProductCardStyleTwo from "../../Cards/ProductCardStyleTwo";
+import DataIteration from "../../Helpers/DataIteration";
+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} />
+                                )}
+                            </DataIteration>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </>
+    );
+}

src/components/Resources/tabs/index.js

@@ -4,8 +4,10 @@ import CreatedTab from "./CreatedTab";
 import HiddenProductsTab from "./HiddenProductsTab";
 import OnSaleTab from "./OnSaleTab";
 import OwnTab from "./OwnTab";
+import BlogTab from "./BlogTab";
 
 export {
+  BlogTab,
   ActivitiesTab,
   CollectionTab,
   CreatedTab,