Google Maps Bug

frontend/src/features/vehicles/components/VehicleForm.tsx

@@ -67,6 +67,15 @@ export const VehicleForm: React.FC<VehicleFormProps> = ({
   initialData,
   loading,
 }) => {
+  const formatVehicleLabel = (value?: string): string => {
+    if (!value) return '';
+    return value
+      .split(' ')
+      .filter(Boolean)
+      .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+      .join(' ');
+  };
+
   const [years, setYears] = useState<number[]>([]);
   const [makes, setMakes] = useState<DropdownOption[]>([]);
   const [models, setModels] = useState<DropdownOption[]>([]);
@@ -338,7 +347,7 @@ export const VehicleForm: React.FC<VehicleFormProps> = ({
             <option value="">Select Make</option>
             {makes.map((make) => (
               <option key={make.id} value={make.name}>
-                {make.name}
+                {formatVehicleLabel(make.name)}
               </option>
             ))}
           </select>
@@ -357,7 +366,7 @@ export const VehicleForm: React.FC<VehicleFormProps> = ({
             <option value="">Select Model</option>
             {models.map((model) => (
               <option key={model.id} value={model.name}>
-                {model.name}
+                {formatVehicleLabel(model.name)}
               </option>
             ))}
           </select>