From 1c21bddf02915494ab6f322805c4bfa59a080db4 Mon Sep 17 00:00:00 2001
From: McCarthy <121826239+mccarthyaaron@users.noreply.github.com>
Date: Wed, 7 Aug 2024 22:00:34 +0300
Subject: [PATCH] (fix) O3-3260: When editing an appointment, changing the
 service prevents form submission due to duration field error (#1149)

---
 .../src/form/appointments-form.component.tsx  | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/packages/esm-appointments-app/src/form/appointments-form.component.tsx b/packages/esm-appointments-app/src/form/appointments-form.component.tsx
index 27b0486b1..94df7b62e 100644
--- a/packages/esm-appointments-app/src/form/appointments-form.component.tsx
+++ b/packages/esm-appointments-app/src/form/appointments-form.component.tsx
@@ -489,11 +489,22 @@ const AppointmentsForm: React.FC<AppointmentsFormProps> = ({
                   invalidText="Required"
                   labelText={t('selectService', 'Select a service')}
                   onChange={(event) => {
+                    if (context === 'creating') {
+                      setValue(
+                        'duration',
+                        services?.find((service) => service.name === event.target.value)?.durationMins,
+                      );
+                    } else if (context === 'editing') {
+                      const previousServiceDuration = services?.find(
+                        (service) => service.name === getValues('selectedService'),
+                      )?.durationMins;
+                      const selectedServiceDuration = services?.find((service) => service.name === event.target.value)
+                        ?.durationMins;
+                      if (selectedServiceDuration && previousServiceDuration === getValues('duration')) {
+                        setValue('duration', selectedServiceDuration);
+                      }
+                    }
                     onChange(event);
-                    setValue(
-                      'duration',
-                      services?.find((service) => service.name === event.target.value)?.durationMins,
-                    );
                   }}
                   onBlur={onBlur}
                   value={value}