src/components/Cards/ResourceBlogCard.jsx

@@ -32,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">

src/components/Helpers/SearchCom.jsx

@@ -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>

src/components/Resources/index.jsx

@@ -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>
     );

src/components/Resources/tabs/BlogTab.jsx

@@ -13,7 +13,7 @@ export default function BlogTab({ className, blogdata }) {
           <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 />
+              <SearchCom placeholder='Search Blog Items...' />
             </div>
             {/* filer-dropdown */}
             <div className="flex-1 flex sm:justify-end">