fix(app): blur quick transfer well selection reset button on click (#…

…16048) blurs the quick transfer source and destination well selection reset buttons on click to remove the button focus styling closes RQA-2863
Opentrons · Aug 26, 2024 · 0da0f4d · 0da0f4d
1 parent 132e86f
commit 0da0f4d
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 2 deletions.
diff --git a/app/src/organisms/QuickTransferFlow/SelectDestWells.tsx b/app/src/organisms/QuickTransferFlow/SelectDestWells.tsx
@@ -107,9 +107,10 @@ export function SelectDestWells(props: SelectDestWellsProps): JSX.Element {
   const resetButtonProps: React.ComponentProps<typeof SmallButton> = {
     buttonType: 'tertiaryLowLight',
     buttonText: t('shared:reset'),
-    onClick: () => {
+    onClick: (e: React.MouseEvent<HTMLButtonElement>) => {
       setIsNumberWellsSelectedError(false)
       setSelectedWells({})
+      e.currentTarget.blur?.()
     },
   }
   let labwareDefinition =

diff --git a/app/src/organisms/QuickTransferFlow/SelectSourceWells.tsx b/app/src/organisms/QuickTransferFlow/SelectSourceWells.tsx
@@ -52,8 +52,9 @@ export function SelectSourceWells(props: SelectSourceWellsProps): JSX.Element {
   const resetButtonProps: React.ComponentProps<typeof SmallButton> = {
     buttonType: 'tertiaryLowLight',
     buttonText: t('shared:reset'),
-    onClick: () => {
+    onClick: (e: React.MouseEvent<HTMLButtonElement>) => {
       setSelectedWells({})
+      e.currentTarget.blur?.()
     },
   }
   let displayLabwareDefinition = state.source