Update unit type display logic across multiple components to fallback on unitType if formatted type is unavailable; enhance search filters to ensure proper initialization and reset behavior; add new brochures to project data for improved resource availability.

This commit is contained in:
2026-01-26 16:21:16 +05:00
parent 58e8919a12
commit 47ab151843
13 changed files with 75 additions and 35 deletions
+1 -1
View File
@@ -86,7 +86,7 @@ function FloorPopup({ title, complexName, data, onSelect }: FloorPopupProps) {
{count}
</p>
<p className="text-caption-m opacity-70">
{formattedUnitTypes.get(unitType)}
{formattedUnitTypes.get(unitType) || unitType}
</p>
</div>
))
+16 -8
View File
@@ -91,11 +91,18 @@ function SearchFilters({
.json<number>(),
enabled:
!!project &&
!!allUnitTypes &&
!!allCost.min &&
!!allFloors.min &&
!!allArea.min &&
!!allViews.length,
allUnitTypes !== undefined &&
allCost !== undefined &&
allFloors !== undefined &&
allArea !== undefined &&
allViews !== undefined &&
// Wait until filters are initialized to prevent duplicate requests
cost[0] >= 0 &&
cost[1] >= 0 &&
floor[0] >= 0 &&
floor[1] >= 0 &&
area[0] >= 0 &&
area[1] >= 0,
});
function handleSelectProject(project: Project | null) {
@@ -125,9 +132,10 @@ function SearchFilters({
function resetFilters() {
setView("Any view");
setSelectedUnitTypes([]);
setCost([allCost?.min || -1, allCost?.max || -1]);
setFloor([allFloors?.min || -1, allFloors?.max || -1]);
setArea([allArea?.min || -1, allArea?.max || -1]);
// Use actual min/max values if available, otherwise use 0 to keep query enabled
if (allCost) setCost([allCost.min, allCost.max]);
if (allFloors) setFloor([allFloors.min, allFloors.max]);
if (allArea) setArea([allArea.min, allArea.max]);
if (inModal) setInModal(false);
}
+1 -1
View File
@@ -75,7 +75,7 @@ function SelectedComplexCard({
4
</div>
<p className="text-caption-m opacity-70">
{formattedUnitTypes.get(unitType)}
{formattedUnitTypes.get(unitType) || unitType}
</p>
</div>
))}
+1 -1
View File
@@ -84,7 +84,7 @@ function UnitCard({ unit }: { unit: Unit }) {
<p className="text-s">
{`${formattedUnitTypes.get(
unit.unitType
)}, ${unit.squareFt.toLocaleString(undefined, {
) || unit.unitType}, ${unit.squareFt.toLocaleString(undefined, {
maximumFractionDigits: 2,
})} Sqft`}
</p>
+1 -1
View File
@@ -31,7 +31,7 @@ function UnitPopup({
<div className="2xl:space-y-[0.833vw] space-y-3">
<div className="2xl:space-y-[0.556vw] space-y-2">
<p className="text-h5 font-medium">
{formattedUnitTypes.get(unitType)}
{formattedUnitTypes.get(unitType) || unitType}
</p>
<div className="flex items-center 2xl:gap-[0.556vw] gap-2">
{wing && (
+1 -1
View File
@@ -38,7 +38,7 @@ function UnitTypesSelect({
: "ring-[#E2E2DC] text-[#0D1922]/70"
)}
>
{formattedUnitTypes.get(unitType)}
{formattedUnitTypes.get(unitType) || unitType}
</p>
))}
</div>
+1 -1
View File
@@ -26,7 +26,7 @@ export default function BrochureButton({
onClick={handleDownload}
>
<span className="duration-300 text-nowrap text-btn-m">{title}</span>
<span className="2xl:size-[1.389vw] size-5 opacity-70 group-hover:opacity-100 transition-opacity duration-300">
<span className="2xl:size-[1.389vw] size-5 opacity-70 group-hover:opacity-100 transition-opacity duration-300 flex-shrink-0">
<DownloadIcon />
</span>
</Button>
+38 -11
View File
@@ -24,6 +24,14 @@ export const projectBrochures: ProjectBrochures[] = [
title: "Technical Brochure",
link: "/files/brochures/marasi-drive/Technical Brochure.pdf",
},
{
title: "Factsheet",
link: "/files/brochures/marasi-drive/Factsheet.pdf",
},
{
title: "Reasons to buy",
link: "/files/brochures/marasi-drive/Reasons to buy.pdf",
},
],
},
{
@@ -38,8 +46,24 @@ export const projectBrochures: ProjectBrochures[] = [
link: "/files/brochures/downtown/Amenities Brochure.pdf",
},
{
title: "Technical Brochure",
link: "/files/brochures/downtown/Technical Brochure.pdf",
title: "Factsheet",
link: "/files/brochures/downtown/Factsheet.pdf",
},
{
title: "Reasons to buy",
link: "/files/brochures/downtown/Reasons to buy.pdf",
},
{
title: "Typical Floor plan 14-19",
link: "/files/brochures/downtown/Typical Floor plan 14-19.pdf",
},
{
title: "Typical Floor plan 2-13",
link: "/files/brochures/downtown/Typical Floor plan 2-13.pdf",
},
{
title: "Unit Plan",
link: "/files/brochures/downtown/Unit Plan.pdf",
},
],
},
@@ -58,18 +82,21 @@ export const projectBrochures: ProjectBrochures[] = [
title: "Technical Brochure",
link: "/files/brochures/dubai-marina/Technical Brochure.pdf",
},
],
},
{
projectTitle: "Rove Home HQ",
brochures: [
{
title: "Main Brochure",
link: "/files/brochures/hq/Main Brochure.pdf",
title: "Factsheet",
link: "/files/brochures/dubai-marina/Factsheet.pdf",
},
{
title: "Technical Brochure",
link: "/files/brochures/hq/Technical Brochure.pdf",
title: "RHDM Arabic",
link: "/files/brochures/dubai-marina/RHDM Arabic.pdf",
},
{
title: "RHDM Russian",
link: "/files/brochures/dubai-marina/RHDM Russian.pdf",
},
{
title: "RHDM Turkish",
link: "/files/brochures/dubai-marina/RHDM Turkish.pdf",
},
],
},
-4
View File
@@ -1,13 +1,9 @@
export const formattedUnitTypes = new Map([
["1 Bedroom Combined Type C", "1 Bedroom Combined Type C"],
["1 Bedroom Combined Type D", "1 Bedroom Combined Type D"],
["1 BR Squared", "1 Bedroom²"],
["One Bedroom Square", "1 Bedroom²"],
["2 BR Squared", "2 Bedroom²"],
["2 Bedroom Combined", "2 Bedroom Combined"],
["One Bedroom Loft", "1 Bedroom Loft"],
["Two Bedroom Loft", "2 Bedroom Loft"],
["Studio Flex", "Studio Flex"],
["Studio Square", "Studio²"],
["Studio Squared", "Studio²"],
]);
+1 -1
View File
@@ -230,7 +230,7 @@ function FavoritesPage() {
<div className="2xl:p-[1.111vw] 2xl:pt-[0.556vw] md:max-2xl:p-4 md:max-2xl:pt-2 p-3 flex flex-col 2xl:gap-[0.556vw] gap-2 2xl:rounded-[1.111vw] rounded-2xl bg-[#F3F3F2] 2xl:aspect-[310/334] md:max-2xl:aspect-[320/334] aspect-[144/158] 2xl:mb-[1.806vw] md:max-xl:mb-[4.427vw] mb-[5.556vw]">
<div className="flex justify-between items-start">
<p className="md:text-s text-caption-m 2xl:translate-y-[0.694vw] translate-y-2.5">
{formattedUnitTypes.get(unit.unitType)}
{formattedUnitTypes.get(unit.unitType) || unit.unitType}
<span className="max-md:hidden">
{`, ${unit.squareFt.toLocaleString(undefined, {
maximumFractionDigits: 2,
+6 -1
View File
@@ -2,7 +2,7 @@ import FloorSelect, { FloorsData } from "../components/FloorSelect";
import { useParams } from "react-router";
import FloorSidebar from "../components/FloorSidebar";
import { useState, useMemo } from "react";
import { useState, useMemo, useEffect } from "react";
import { useQuery } from "@tanstack/react-query";
import { api } from "../api/ky";
import { SPECIAL_FLOORS } from "../constants/floors";
@@ -19,6 +19,11 @@ function FloorsPage() {
complexName: ComplexName;
}>();
// Reset selectedFloor when complexName changes to prevent race condition
useEffect(() => {
setSelectedFloor(null);
}, [complexName]);
const { data: floorsData } = useQuery({
queryKey: ["floors-data", complexName],
queryFn: () =>
+7 -3
View File
@@ -123,15 +123,15 @@ function SearchPage() {
useEffect(() => {
if (allFloors) setFloor([allFloors.min, allFloors.max]);
}, [allFloors]);
}, [allFloors, project]); // Add project dependency to reset when project changes
useEffect(() => {
if (allCost) setCost([allCost.min, allCost.max]);
}, [allCost]);
}, [allCost, project]); // Add project dependency to reset when project changes
useEffect(() => {
if (allArea) setArea([allArea.min, allArea.max]);
}, [allArea]);
}, [allArea, project]); // Add project dependency to reset when project changes
const { data, fetchNextPage, isLoading, hasNextPage, isFetchingNextPage } =
useInfiniteQuery({
@@ -199,6 +199,10 @@ function SearchPage() {
useEffect(() => {
setSelectedUnitTypes([]);
setView("Any view");
// Reset filters to prevent race condition with old filter data
setCost([-1, -1]);
setFloor([-1, -1]);
setArea([-1, -1]);
}, [project]);
return (
+1 -1
View File
@@ -139,7 +139,7 @@ function UnitPage() {
<div className="flex justify-between items-start">
<div className="2xl:space-y-[1.111vw] space-y-4">
<h3 className="text-h3 font-medium">
{formattedUnitTypes.get(unit.unitType)}
{formattedUnitTypes.get(unit.unitType) || unit.unitType}
</h3>
<div className="2xl:space-y-[0.556vw] space-y-2">
<p className="text-s text-[#00BED7]">{unit.project}</p>