From 556535f5b12fed77d65cf5e1ad8da0276e610906 Mon Sep 17 00:00:00 2001
From: Jamey Huffnagle <jamey.huffnagle@opentrons.com>
Date: Wed, 29 May 2024 12:23:54 -0400
Subject: [PATCH] #15277 feedback

---
 app/src/molecules/InterventionModal/index.tsx | 28 ++++++++++++-------
 .../ErrorRecoveryWizard.tsx                   |  2 +-
 2 files changed, 19 insertions(+), 11 deletions(-)

diff --git a/app/src/molecules/InterventionModal/index.tsx b/app/src/molecules/InterventionModal/index.tsx
index f43ce12b16c..c696434377c 100644
--- a/app/src/molecules/InterventionModal/index.tsx
+++ b/app/src/molecules/InterventionModal/index.tsx
@@ -16,10 +16,11 @@ import {
   POSITION_STICKY,
   SPACING,
 } from '@opentrons/components'
-import type { IconName } from '@opentrons/components'
 
 import { getIsOnDevice } from '../../redux/config'
 
+import type { IconName } from '@opentrons/components'
+
 export type ModalType = 'intervention-required' | 'error'
 
 const BASE_STYLE = {
@@ -97,15 +98,22 @@ export interface InterventionModalProps {
   children: React.ReactNode
 }
 
-export function InterventionModal(props: InterventionModalProps): JSX.Element {
-  const modalType = props.type ?? 'intervention-required'
+export function InterventionModal({
+  type,
+  titleHeading,
+  iconHeadingOnClick,
+  iconName,
+  iconHeading,
+  children,
+}: InterventionModalProps): JSX.Element {
+  const modalType = type ?? 'intervention-required'
   const headerColor =
     modalType === 'error' ? ERROR_COLOR : INTERVENTION_REQUIRED_COLOR
   const border = `${BORDER_STYLE_BASE} ${
     modalType === 'error' ? ERROR_COLOR : INTERVENTION_REQUIRED_COLOR
   }`
   const headerJustifyContent =
-    props.titleHeading != null ? JUSTIFY_SPACE_BETWEEN : undefined
+    titleHeading != null ? JUSTIFY_SPACE_BETWEEN : undefined
 
   const isOnDevice = useSelector(getIsOnDevice)
   const modalStyle = isOnDevice ? MODAL_ODD_STYLE : MODAL_DESKTOP_STYLE
@@ -124,17 +132,17 @@ export function InterventionModal(props: InterventionModalProps): JSX.Element {
             {...HEADER_STYLE}
             backgroundColor={headerColor}
             justifyContent={headerJustifyContent}
-            onClick={props.iconHeadingOnClick}
+            onClick={iconHeadingOnClick}
           >
-            {props.titleHeading}
+            {titleHeading}
             <Flex alignItems={ALIGN_CENTER} gridGap={SPACING.spacing12}>
-              {props.iconName != null ? (
-                <Icon name={props.iconName} size={SPACING.spacing32} />
+              {iconName != null ? (
+                <Icon name={iconName} size={SPACING.spacing32} />
               ) : null}
-              {props.iconHeading != null ? props.iconHeading : null}
+              {iconHeading != null ? iconHeading : null}
             </Flex>
           </Flex>
-          {props.children}
+          {children}
         </Box>
       </Flex>
     </Flex>
diff --git a/app/src/organisms/ErrorRecoveryFlows/ErrorRecoveryWizard.tsx b/app/src/organisms/ErrorRecoveryFlows/ErrorRecoveryWizard.tsx
index 7ace297cfb6..aa9864d50b9 100644
--- a/app/src/organisms/ErrorRecoveryFlows/ErrorRecoveryWizard.tsx
+++ b/app/src/organisms/ErrorRecoveryFlows/ErrorRecoveryWizard.tsx
@@ -18,7 +18,7 @@ import type { FailedCommand, IRecoveryMap, RecoveryContentProps } from './types'
 import type {
   useRouteUpdateActions,
   UseRouteUpdateActionsResult,
-      useRecoveryCommands,
+  useRecoveryCommands,
   UseRecoveryCommandsResult,
 } from './utils'