|
|
@ -34,6 +34,8 @@ const SectionGridFeaturePlaces: FC<SectionGridFeaturePlacesProps> = ({ |
|
|
|
|
|
|
|
const { countries , tours } = useContext(Context); |
|
|
|
const [countryTours, setCountryTours] = useState(); |
|
|
|
const [limit, setLimit] = useState(7); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -85,13 +87,13 @@ const SectionGridFeaturePlaces: FC<SectionGridFeaturePlacesProps> = ({ |
|
|
|
className={`grid gap-6 md:gap-8 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 ${gridClass}`} |
|
|
|
> |
|
|
|
{countryTours?.length ? ( |
|
|
|
countryTours?.map((stay) => <StayCard2 key={stay.id} data={stay} />) |
|
|
|
countryTours?.map((stay , idx) => limit >= idx && <StayCard2 key={stay.id} data={stay} />) |
|
|
|
) : ( |
|
|
|
<h2>No tours Available</h2> |
|
|
|
)} |
|
|
|
</div> |
|
|
|
<div className="flex mt-16 justify-center items-center"> |
|
|
|
<ButtonPrimary>Show me more</ButtonPrimary> |
|
|
|
<ButtonPrimary onClick={()=>{setLimit((prev)=> prev + 8)}}>Show me more</ButtonPrimary> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
); |
|
|
|