From a84f58a79590d70a4d2cfa11e34fb6f558fbf27a Mon Sep 17 00:00:00 2001
From: Nick Diehl <47604184+ncdiehl11@users.noreply.github.com>
Date: Thu, 16 May 2024 18:16:04 -0400
Subject: [PATCH] fix(app): disable exit button after successful pipette
 attach/detach (#15205)

Closes RQA-2731

On OT-2, after a pipette is attached or detached successfully, the exit
button should only be clickable once, so that many home commands are not
emitted in rapid succession with each click.
---
 app/src/organisms/ChangePipette/ConfirmPipette.tsx | 10 +++++++++-
 .../__tests__/ConfirmPipette.test.tsx              | 14 +++++++++++++-
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/app/src/organisms/ChangePipette/ConfirmPipette.tsx b/app/src/organisms/ChangePipette/ConfirmPipette.tsx
index 2b7b75da8da..0a4768997f5 100644
--- a/app/src/organisms/ChangePipette/ConfirmPipette.tsx
+++ b/app/src/organisms/ChangePipette/ConfirmPipette.tsx
@@ -58,6 +58,7 @@ export function ConfirmPipette(props: ConfirmPipetteProps): JSX.Element {
     actualPipette,
     setConfirmPipetteLevel,
     confirmPipetteLevel,
+    isDisabled,
   } = props
   const { t } = useTranslation('change_pipette')
 
@@ -141,6 +142,7 @@ export function ConfirmPipette(props: ConfirmPipetteProps): JSX.Element {
           <SuccessAndExitButtons
             {...props}
             confirmPipetteLevel={confirmPipetteLevel}
+            isDisabled={isDisabled}
           />
         ) : null}
       </>
@@ -221,6 +223,7 @@ function SuccessAndExitButtons(props: ConfirmPipetteProps): JSX.Element {
     toCalibrationDashboard,
     success,
     wrongWantedPipette,
+    isDisabled,
   } = props
   const { t } = useTranslation('change_pipette')
   return (
@@ -230,11 +233,16 @@ function SuccessAndExitButtons(props: ConfirmPipetteProps): JSX.Element {
         <SecondaryButton
           marginRight={SPACING.spacing8}
           onClick={toCalibrationDashboard}
+          disabled={isDisabled}
         >
           {t('calibrate_pipette_offset')}
         </SecondaryButton>
       ) : null}
-      <PrimaryButton textTransform={TEXT_TRANSFORM_CAPITALIZE} onClick={exit}>
+      <PrimaryButton
+        textTransform={TEXT_TRANSFORM_CAPITALIZE}
+        onClick={exit}
+        disabled={isDisabled}
+      >
         {t('shared:exit')}
       </PrimaryButton>
     </>
diff --git a/app/src/organisms/ChangePipette/__tests__/ConfirmPipette.test.tsx b/app/src/organisms/ChangePipette/__tests__/ConfirmPipette.test.tsx
index 9cc9b232db8..1f4f7a12438 100644
--- a/app/src/organisms/ChangePipette/__tests__/ConfirmPipette.test.tsx
+++ b/app/src/organisms/ChangePipette/__tests__/ConfirmPipette.test.tsx
@@ -427,7 +427,19 @@ describe('ConfirmPipette', () => {
     fireEvent.click(pocBtn)
     expect(props.toCalibrationDashboard).toBeCalled()
   })
-  it('should render buttons as disabled when robot is in motion/isDisabled is true', () => {
+  it('should render buttons as disabled on success when robot is in motion/isDisabled is true', () => {
+    props = {
+      ...props,
+      success: true,
+      isDisabled: true,
+    }
+    const { getByRole } = render(props)
+    expect(getByRole('button', { name: 'exit' })).toBeDisabled()
+    expect(
+      getByRole('button', { name: 'Calibrate pipette offset' })
+    ).toBeDisabled()
+  })
+  it('should render buttons as disabled on failure when robot is in motion/isDisabled is true', () => {
     props = {
       ...props,
       success: false,