diff --git a/packages/nextjs/components/RegPropertyDetails.tsx b/packages/nextjs/components/RegPropertyDetails.tsx index d9e34c99..4f314703 100644 --- a/packages/nextjs/components/RegPropertyDetails.tsx +++ b/packages/nextjs/components/RegPropertyDetails.tsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from "react"; +import React from "react"; import Link from "next/link"; import { FileUploaderInput } from "~~/components/inputs/FileUploaderInput"; import { RadioBoxesInput } from "~~/components/inputs/RadioBoxesInput"; @@ -23,15 +23,8 @@ interface Props { } const PropertyDetails = ({ value, onChange, readOnly, isDraft = false }: Props) => { - const [vehicleModels, setVehicleModels] = useState([]); - - useEffect(() => { - // Update vehicle models based on the selected make - if (value?.vehicleMake) { - setVehicleModels(VehicleModelOptions[value.vehicleMake] || []); - } - }, [value?.vehicleMake]); - + const getVehicleModels = (make) => VehicleModelOptions[make] || []; + const vehicleModels = getVehicleModels(value?.vehicleMake); const handleChange = (ev: LightChangeEvent) => { const updatedValue = { ...value, [ev.name]: ev.value }; onChange?.({ @@ -39,6 +32,7 @@ const PropertyDetails = ({ value, onChange, readOnly, isDraft = false }: Props) value: updatedValue, }); }; + return (
@@ -81,14 +75,31 @@ const PropertyDetails = ({ value, onChange, readOnly, isDraft = false }: Props) +
{/* Vehicle-specific select inputs */} +