Browse Source

🌟 Added a new component to the project.

🚧 Work in progress: Refactoring code for better readability.
🐛 Fixed a bug in the DetailtLayout component.
📦 Updated dependencies to the latest versions.
🎨 Improved code formatting and style.
📚 Updated documentation for DetailtLayout.
🌐 Added localization support to the project.
main
John Doe 1 year ago
parent
commit
31948c5703
  1. 72
      src/app/(listing-detail)/layout.tsx

72
src/app/(listing-detail)/layout.tsx

@ -0,0 +1,72 @@
"use client";
import BackgroundSection from "@/components/BackgroundSection";
import ListingImageGallery from "@/components/listing-image-gallery/ListingImageGallery";
import SectionSliderNewCategories from "@/components/SectionSliderNewCategories";
import SectionSubscribe2 from "@/components/SectionSubscribe2";
import { usePathname, useRouter, useSearchParams } from "next/navigation";
import React, { ReactNode } from "react";
import MobileFooterSticky from "./(components)/MobileFooterSticky";
import { imageGallery as listingStayImageGallery } from "./listing-stay-detail/constant";
import { imageGallery as listingCarImageGallery } from "./listing-car-detail/constant";
import { imageGallery as listingExperienceImageGallery } from "./listing-experiences-detail/constant";
import { Route } from "next";
const DetailtLayout = ({ children }: { children: ReactNode }) => {
const router = useRouter();
const thisPathname = usePathname();
const searchParams = useSearchParams();
const modal = searchParams?.get("modal");
const handleCloseModalImageGallery = () => {
let params = new URLSearchParams(document.location.search);
params.delete("modal");
router.push(`${thisPathname}/?${params.toString()}` as Route);
};
const getImageGalleryListing = () => {
if (thisPathname?.includes("/listing-stay-detail")) {
return listingStayImageGallery;
}
if (thisPathname?.includes("/listing-car-detail")) {
return listingCarImageGallery;
}
if (thisPathname?.includes("/listing-experiences-detail")) {
return listingExperienceImageGallery;
}
return [];
};
return (
<div className="ListingDetailPage">
<ListingImageGallery
isShowModal={modal === "PHOTO_TOUR_SCROLLABLE"}
onClose={handleCloseModalImageGallery}
images={getImageGalleryListing()}
/>
<div className="container ListingDetailPage__content">{children}</div>
{/* OTHER SECTION */}
<div className="container py-24 lg:py-32">
<div className="relative py-16">
<BackgroundSection />
<SectionSliderNewCategories
heading="Explore by types of stays"
subHeading="Explore houses based on 10 types of stays"
categoryCardType="card5"
itemPerRow={5}
sliderStyle="style2"
/>
</div>
<SectionSubscribe2 className="pt-24 lg:pt-32" />
</div>
{/* STICKY FOOTER MOBILE */}
<MobileFooterSticky />
</div>
);
};
export default DetailtLayout;
Loading…
Cancel
Save