Merge branch 'resources-page' of WrenchBoard/Users-Wrench into master

src/components/AuthPages/AuthProfile/CollectionTab.jsx

@@ -43,7 +43,7 @@ export default function CollectionTab({ className, products }) {
               <DataIteration
                 datas={products}
                 startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products.length}
+                endLength={products?.length}
               >
                 {({ datas }) => (
                   <CollectionCard key={datas.uniqKey} collectionData={datas} />

src/components/AuthPages/AuthProfile/CreateSaleSlider.jsx

@@ -42,7 +42,9 @@ export default function CreateSaleSlider({
       {/* heading */}
       <div className="flex justify-between items-center mb-6">
         <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Sell</h1>
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+            Create for Sell
+          </h1>
         </div>
         <div className="slider-btns flex space-x-4">
           <button onClick={nextHandler} type="button">
@@ -89,7 +91,7 @@ export default function CreateSaleSlider({
       <div className="trending-products relative w-full">
         <SliderCom selector={trendingSlider} settings={settings}>
           {products &&
-            products.length > 0 &&
+            products?.length > 0 &&
             products.map((item) => (
               <ProductCardStyleTwo
                 key={item.id}

src/components/AuthPages/AuthProfile/CreatedBidsSlider.jsx

@@ -49,7 +49,9 @@ export default function CreatedBidsSlider({
       {/* heading */}
       <div className="flex justify-between items-center mb-6">
         <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Bits</h1>
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+            Create for Bits
+          </h1>
         </div>
         <div className="slider-btns flex space-x-4">
           <button onClick={nextHandler} type="button">
@@ -96,7 +98,7 @@ export default function CreatedBidsSlider({
       <div className="trending-products relative w-full">
         <SliderCom selector={trendingSlider} settings={settings}>
           {products &&
-            products.length > 0 &&
+            products?.length > 0 &&
             products.map((item) => (
               <ProductCardStyleOne
                 key={item.id}

src/components/AuthPages/AuthProfile/OnSaleTab.jsx

@@ -43,7 +43,7 @@ export default function OnSaleTab({ className, products }) {
               <DataIteration
                 datas={products}
                 startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products.length}
+                endLength={products?.length}
               >
                 {({ datas }) => (
                   <ProductCardStyleTwo key={datas.id} datas={datas} />

src/components/AuthPages/AuthProfile/OwnTab.jsx

@@ -43,7 +43,7 @@ export default function OwnTab({ className, products }) {
               <DataIteration
                 datas={products}
                 startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products.length}
+                endLength={products?.length}
               >
                 {({ datas }) => (
                   <ProductCardStyleOne key={datas.id} datas={datas} />

src/components/AuthPages/SignUp/index.jsx

@@ -113,7 +113,7 @@ export default function SignUp() {
   return (
     <>
       <div className="layout-wrapper login">
-        <div className="main-wrapper w-full xl:h-screen h-full xl:py-10 py-12 overflow-y-auto">
+        <div className="main-wrapper login-wrapper w-full xl:h-screen h-full xl:py-10 py-12 overflow-y-auto">
           <div className=" h-full">
             <div className="flex-1 flex justify-center items-center">
               <div className="w-full">

src/components/AuthPages/UserProfile/CollectionTab.jsx

@@ -43,7 +43,7 @@ export default function CollectionTab({ className, products }) {
               <DataIteration
                 datas={products}
                 startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products.length}
+                endLength={products?.length}
               >
                 {({ datas }) => (
                   <CollectionCard key={datas.uniqKey} collectionData={datas} />

src/components/AuthPages/UserProfile/CreateSaleSlider.jsx

@@ -42,7 +42,9 @@ export default function CreateSaleSlider({
       {/* heading */}
       <div className="flex justify-between items-center mb-6">
         <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Sell</h1>
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+            Create for Sell
+          </h1>
         </div>
         <div className="slider-btns flex space-x-4">
           <button onClick={nextHandler} type="button">
@@ -89,7 +91,7 @@ export default function CreateSaleSlider({
       <div className="trending-products relative w-full">
         <SliderCom selector={trendingSlider} settings={settings}>
           {products &&
-            products.length > 0 &&
+            products?.length > 0 &&
             products.map((item) => (
               <ProductCardStyleTwo
                 key={item.id}

src/components/AuthPages/UserProfile/CreatedBidsSlider.jsx

@@ -49,7 +49,9 @@ export default function CreatedBidsSlider({
       {/* heading */}
       <div className="flex justify-between items-center mb-6">
         <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Bits</h1>
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+            Create for Bits
+          </h1>
         </div>
         <div className="slider-btns flex space-x-4">
           <button onClick={nextHandler} type="button">
@@ -96,7 +98,7 @@ export default function CreatedBidsSlider({
       <div className="trending-products relative w-full">
         <SliderCom selector={trendingSlider} settings={settings}>
           {products &&
-            products.length > 0 &&
+            products?.length > 0 &&
             products.map((item) => (
               <ProductCardStyleOne
                 key={item.id}

src/components/AuthPages/UserProfile/OnSaleTab.jsx

@@ -43,7 +43,7 @@ export default function OnSaleTab({ className, products }) {
               <DataIteration
                 datas={products}
                 startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products.length}
+                endLength={products?.length}
               >
                 {({ datas }) => (
                   <ProductCardStyleTwo key={datas.id} datas={datas} />

src/components/AuthPages/UserProfile/OwnTab.jsx

@@ -43,7 +43,7 @@ export default function OwnTab({ className, products }) {
               <DataIteration
                 datas={products}
                 startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products.length}
+                endLength={products?.length}
               >
                 {({ datas }) => (
                   <ProductCardStyleOne key={datas.id} datas={datas} />

src/components/Cards/ProductCardStyleOne.jsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import { useState } from "react";
 import { Link } from "react-router-dom";
 import { toast } from "react-toastify";
 import localImgLoad from "../../lib/localImgLoad";
@@ -6,6 +6,7 @@ import CountDown from "../Helpers/CountDown";
 import Icons from "../Helpers/Icons";
 
 export default function ProductCardStyleOne({ datas, hidden = false }) {
+  const [imageUrl, setImageUrl] = useState("");
   const [addFavorite, setValue] = useState(false);
   const [options, setOption] = useState(false);
   const favoriteHandler = () => {
@@ -17,6 +18,8 @@ export default function ProductCardStyleOne({ datas, hidden = false }) {
       toast.warn("Remove to Favorite List");
     }
   };
+
+
   return (
     <div className="card-style-one flex flex-col justify-between w-full h-[387px] bg-white dark:bg-dark-white   p-3 pb rounded-2xl">
       <div className="content">

src/components/Resources/index.jsx

@@ -4,21 +4,21 @@ import { Link } from "react-router-dom";
 // import profileBanner from "../../assets/images/profile-cover.png";
 // import collections from "../../data/collectionplan_data.json"; Should this be cleaned off?
 // import marketPlace from "../../data/marketplace_data.json";
+import LoadingSpinner from "../../components/Spinners/LoadingSpinner"
 import products from "../../data/product_data.json";
 import Layout from "../Partials/Layout";
-import ActivitiesTab from "./ActivitiesTab";
-import CollectionTab from "./CollectionTab";
-import CreatedTab from "./CreatedTab";
-import HiddenProductsTab from "./HiddenProductsTab";
-import OnSaleTab from "./OnSaleTab";
-import OwnTab from "./OwnTab";
-import LoadingSpinner from "../Spinners/LoadingSpinner";
+import {
+  ActivitiesTab,
+  CollectionTab,
+  CreatedTab,
+  HiddenProductsTab,
+  OnSaleTab,
+  OwnTab,
+} from "./tabs";
 
 export default function Resources(props) {
   // console.log("RESOURCES=>", props);
-  // const mainProducts = products.datas;
   const ownProducts = products.datas;
-
   // Resource Props
   const __resources = props.MyResourceData;
 
@@ -89,7 +89,7 @@ export default function Resources(props) {
   const TabList = ({ tabCategories }) => {
     return (
       <ul className="lg:flex lg:space-x-14 space-x-8">
-        {tabCategories.length > 0 &&
+        {tabCategories?.length > 0 &&
           tabCategories?.map((tabValue, idx) => (
             <TabItem
               key={tabValue.id}
@@ -105,38 +105,38 @@ export default function Resources(props) {
     <>
       <Layout>
         <div className="nft-authprofile-wrapper w-full">
-          {props.MyResourceData.length == 0 ||
-          Object.keys(props.MyResourceData).length == 0 ? (
+          {__resources.length == 0 ||
+          Object.keys(__resources).length == 0 ? (
             <div className="w-full h-full flex items-center justify-center">
               <LoadingSpinner size={16} color="sky-blue" />
             </div>
           ) : (
-            <div className="main-wrapper w-full">
-              <div className="content-wrapper-profile-only w-full mb-6">
-                <div className="auth-tab-content relative mb-10">
-                  <div className="lg:flex justify-between">
-                    <div className="tab-items">
-                      <ul className="lg:flex lg:space-x-14 space-x-8">
-                        <TabList tabCategories={tab_categories} />
-                      </ul>
-                    </div>
-                    <div style={{ transform: "translateY(-22px)" }}>
-                      <Link
-                        to="/upload-product"
-                        className="btn-gradient lg:flex hidden w-[153px] h-[46px] rounded-full text-white justify-center items-center"
-                      >
-                        Upload Product
-                      </Link>
-                    </div>
+          <div className="main-wrapper w-full">
+            <div className="content-wrapper-profile-only w-full mb-6">
+              <div className="auth-tab-content relative mb-10">
+                <div className="lg:flex justify-between">
+                  <div className="tab-items">
+                    <ul className="lg:flex lg:space-x-14 space-x-8">
+                      <TabList tabCategories={tab_categories} />
+                    </ul>
+                  </div>
+                  <div style={{ transform: "translateY(-22px)" }}>
+                    <Link
+                      to="/upload-product"
+                      className="btn-gradient lg:flex hidden w-[153px] h-[46px] rounded-full text-white justify-center items-center"
+                    >
+                      Upload Product
+                    </Link>
                   </div>
-                  <div className="hidden lg:block w-full h-[1px] bg-[#DCD5FE] dark:bg-[#5356fb29] absolute top-[42px] left-0"></div>
                 </div>
-              </div>
-
-              <div className="tab-cotainer w-full mb-10">
-                {selectedTabComponent}
+                <div className="hidden lg:block w-full h-[1px] bg-[#DCD5FE] dark:bg-[#5356fb29] absolute top-[42px] left-0"></div>
               </div>
             </div>
+
+            <div className="tab-cotainer w-full mb-10">
+              {selectedTabComponent}
+            </div>
+          </div>
           )}
         </div>
       </Layout>

src/components/Resources/tabs/ActivitiesTab.jsx

@@ -1,8 +1,7 @@
-import React from "react";
-import dataImage1 from "../../assets/images/data-table-user-1.png";
-import dataImage2 from "../../assets/images/data-table-user-2.png";
-import dataImage3 from "../../assets/images/data-table-user-3.png";
-import dataImage4 from "../../assets/images/data-table-user-4.png";
+import dataImage1 from "../../../assets/images/data-table-user-1.png";
+import dataImage2 from "../../../assets/images/data-table-user-2.png";
+import dataImage3 from "../../../assets/images/data-table-user-3.png";
+import dataImage4 from "../../../assets/images/data-table-user-4.png";
 
 export default function ActivitiesTab({ className }) {
   return (

src/components/Resources/tabs/CollectionTab.jsx

@@ -1,7 +1,6 @@
-import React from "react";
-import CollectionCard from "../Cards/CollectionCard";
-import DataIteration from "../Helpers/DataIteration";
-import SearchCom from "../Helpers/SearchCom";
+import CollectionCard from "../../Cards/CollectionCard";
+import DataIteration from "../../Helpers/DataIteration";
+import SearchCom from "../../Helpers/SearchCom";
 
 export default function CollectionTab({ className, products }) {
   return (

src/components/Resources/tabs/CreateSaleSlider.jsx

@@ -1,7 +1,7 @@
-import React, { useRef } from "react";
-import ProductCardStyleTwo from "../Cards/ProductCardStyleTwo";
-import Icons from "../Helpers/Icons";
-import SliderCom from"../Helpers/SliderCom";
+import { useRef } from "react";
+import ProductCardStyleTwo from "../../Cards/ProductCardStyleTwo";
+import Icons from "../../Helpers/Icons";
+import SliderCom from "../../Helpers/SliderCom";
 
 export default function CreateSaleSlider({
   className,
@@ -42,7 +42,9 @@ export default function CreateSaleSlider({
       {/* heading */}
       <div className="flex justify-between items-center mb-6">
         <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Sell</h1>
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+            Create for Sell
+          </h1>
         </div>
         <div className="slider-btns flex space-x-4">
           <button onClick={nextHandler} type="button">
@@ -89,7 +91,7 @@ export default function CreateSaleSlider({
       <div className="trending-products relative w-full">
         <SliderCom selector={trendingSlider} settings={settings}>
           {products &&
-            products.length > 0 &&
+            products?.length > 0 &&
             products.map((item) => (
               <ProductCardStyleTwo
                 key={item.id}

src/components/Resources/tabs/CreatedBidsSlider.jsx

@@ -1,7 +1,7 @@
-import React, { useRef } from "react";
-import ProductCardStyleOne from "../Cards/ProductCardStyleOne";
-import Icons from "../Helpers/Icons";
-import SliderCom from "../Helpers/SliderCom";
+import { useRef } from "react";
+import ProductCardStyleOne from "../../Cards/ProductCardStyleOne";
+import Icons from "../../Helpers/Icons";
+import SliderCom from "../../Helpers/SliderCom";
 
 export default function CreatedBidsSlider({
   className,
@@ -49,7 +49,9 @@ export default function CreatedBidsSlider({
       {/* heading */}
       <div className="flex justify-between items-center mb-6">
         <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Bits</h1>
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+            Create for Bits
+          </h1>
         </div>
         <div className="slider-btns flex space-x-4">
           <button onClick={nextHandler} type="button">
@@ -96,7 +98,7 @@ export default function CreatedBidsSlider({
       <div className="trending-products relative w-full">
         <SliderCom selector={trendingSlider} settings={settings}>
           {products &&
-            products.length > 0 &&
+            products?.length > 0 &&
             products.map((item) => (
               <ProductCardStyleOne
                 key={item.id}

src/components/Resources/tabs/CreatedTab.jsx

@@ -1,5 +1,4 @@
-import React from "react";
-import SearchCom from "../Helpers/SearchCom";
+import SearchCom from "../../Helpers/SearchCom";
 import CreatedBidsSlider from "./CreatedBidsSlider";
 import CreateSaleSlider from "./CreateSaleSlider";
 

src/components/Resources/tabs/HiddenProductsTab.jsx

@@ -1,5 +1,4 @@
-import React from "react";
-import SearchCom from "../Helpers/SearchCom";
+import SearchCom from "../../Helpers/SearchCom";
 import CreatedBidsSlider from "./CreatedBidsSlider";
 import CreateSaleSlider from "./CreateSaleSlider";
 

src/components/Resources/tabs/OnSaleTab.jsx

@@ -1,7 +1,6 @@
-import React from "react";
-import ProductCardStyleTwo from "../Cards/ProductCardStyleTwo";
-import DataIteration from "../Helpers/DataIteration";
-import SearchCom from "../Helpers/SearchCom";
+import ProductCardStyleTwo from "../../Cards/ProductCardStyleTwo";
+import DataIteration from "../../Helpers/DataIteration";
+import SearchCom from "../../Helpers/SearchCom";
 
 export default function OnSaleTab({ className, products }) {
   return (
@@ -43,7 +42,7 @@ export default function OnSaleTab({ className, products }) {
               <DataIteration
                 datas={products}
                 startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products.length}
+                endLength={products?.length}
               >
                 {({ datas }) => (
                   <ProductCardStyleTwo key={datas.id} datas={datas} />

src/components/Resources/tabs/OwnTab.jsx

@@ -1,7 +1,6 @@
-import React from "react";
-import ProductCardStyleOne from "../Cards/ProductCardStyleOne";
-import DataIteration from "../Helpers/DataIteration";
-import SearchCom from "../Helpers/SearchCom";
+import ProductCardStyleOne from "../../Cards/ProductCardStyleOne";
+import DataIteration from "../../Helpers/DataIteration";
+import SearchCom from "../../Helpers/SearchCom";
 
 export default function OwnTab({ className, products }) {
   return (
@@ -43,7 +42,7 @@ export default function OwnTab({ className, products }) {
               <DataIteration
                 datas={products}
                 startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products.length}
+                endLength={products?.length}
               >
                 {({ datas }) => (
                   <ProductCardStyleOne key={datas.id} datas={datas} />

src/components/Resources/tabs/index.js

@@ -0,0 +1,15 @@
+import ActivitiesTab from "./ActivitiesTab";
+import CollectionTab from "./CollectionTab";
+import CreatedTab from "./CreatedTab";
+import HiddenProductsTab from "./HiddenProductsTab";
+import OnSaleTab from "./OnSaleTab";
+import OwnTab from "./OwnTab";
+
+export {
+  ActivitiesTab,
+  CollectionTab,
+  CreatedTab,
+  HiddenProductsTab,
+  OnSaleTab,
+  OwnTab,
+};

src/components/Saved/MainSection.jsx

@@ -8,7 +8,7 @@ export default function MainSection({ products }) {
       <DataIteration
         datas={products}
         startLength={process.env.REACT_APP_ZERO_STATE}
-        endLength={products.length}
+        endLength={products?.length}
       >
         {({ datas }) => (
           <div key={datas.id + Math.random()} className="item">

src/index.css

@@ -824,7 +824,7 @@ TODO: Responsive ===========================
 
 
 /* LoginPage */
-.main-wrapper{
+.main-wrapper.login-wrapper{
   background-image: url('./assets/images/login-dots.jpg');
   background-attachment: fixed;
   background-size: contain;