fix: drop downs not populating on edit

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

@@ -114,6 +114,8 @@ export const VehicleForm: React.FC<VehicleFormProps> = ({
   const watchedMake = watch('make');
   const watchedModel = watch('model');
   const watchedTrim = watch('trimLevel');
+  const watchedEngine = watch('engine');
+  const watchedTransmission = watch('transmission');
 
   // Load years on component mount
   useEffect(() => {
@@ -560,6 +562,10 @@ export const VehicleForm: React.FC<VehicleFormProps> = ({
           </label>
           <select
             {...register('engine')}
+            value={watchedEngine || ''}
+            onChange={(e) => {
+              setValue('engine', e.target.value);
+            }}
             className="w-full px-3 py-2 border rounded-md min-h-[44px] bg-white text-gray-900 border-gray-300 focus:outline-none focus:ring-2 focus:ring-primary-500 dark:bg-scuro dark:text-avus dark:border-silverstone dark:focus:ring-abudhabi dark:focus:border-abudhabi"
             disabled={loadingDropdowns || !watchedTrim || engines.length === 0}
             style={{ fontSize: '16px' }}
@@ -588,6 +594,10 @@ export const VehicleForm: React.FC<VehicleFormProps> = ({
           </label>
           <select
             {...register('transmission')}
+            value={watchedTransmission || ''}
+            onChange={(e) => {
+              setValue('transmission', e.target.value);
+            }}
             className="w-full px-3 py-2 border rounded-md min-h-[44px] bg-white text-gray-900 border-gray-300 focus:outline-none focus:ring-2 focus:ring-primary-500 dark:bg-scuro dark:text-avus dark:border-silverstone dark:focus:ring-abudhabi dark:focus:border-abudhabi"
             disabled={loadingDropdowns || !watchedTrim || transmissions.length === 0}
             style={{ fontSize: '16px' }}