import React from "react";
import ParentWaiting from "../MyOffers/ParentWaiting";
import MyOffersFamilyTable from "../MyTasks/MyOffersFamilyTable";
import FamilyActiveLSlde from "./FamilyActiveLSlde";
import { Link } from "react-router-dom";

export default function FamilyDash({ familyOffers, MyActiveJobList }) {
  // console.log("PROPS IN FAMILY DASH->", familyOffers?.result_list);

  const trending = MyActiveJobList;
  return (
    <div>
      <div className="home-page-wrapper">
        {/* <CommonHead commonHeadData={props.commonHeadData} /> */}

        <div className="w-full mb-4 grid grid-cols-2 md:grid-cols-4 gap-2 md:gap-4">
          {[1,2,3,4,5].map((item, index) => (
            <Link to='/' className={`h-40 rounded-lg shadow-sm ${index%2==0 ? 'bg-red-200/50' : 'bg-sky-300/50'}`}>
              <div >

              </div>
            </Link>
          ))}
        </div>
        
        <div className="my-4">
          <h1 className="my-4 text-26 font-bold text-dark-gray dark:text-white tracking-wide">Resources</h1>
          <div className="w-full grid grid-cols-2 md:grid-cols-3 gap-2 md:gap-4">
            {[1,2,3,4,5].map((item, index) => (
              <Link to='/' className={`h-40 rounded-lg shadow-sm ${index%2==0 ? 'bg-red-200/50' : 'bg-sky-300/50'}`}>
                <div >

                </div>
              </Link>
            ))}
          </div>
        </div>

        {familyOffers?.result_list && familyOffers?.result_list.length > 0 && (
          <MyOffersFamilyTable
            familyOffers={familyOffers?.result_list}
            image_server={familyOffers?.session_image_server}
            className="mb-10"
          />
        )}
        {trending && trending.length > 0 && (
          <FamilyActiveLSlde
            trending={trending}
            className="mb-10"
            image_server={familyOffers?.session_image_server}
          />
        )}

        {/*<TopSellerTopBuyerSliderSection className="mb-10" />*/}
        <ParentWaiting className="mb-10" />
      </div>
    </div>
  );
}