fix(app): add error handling for failed maintenance run creation (#16818

)

Closes RABR-663 and RABR-667

During calibration flows, we currently don't have any error handling for failure to create a maintenance run. If a user exits pipette calibration and re-enters too quickly, for example, the "Move gantry to front" button is disabled indefinitely. This PR just adds some basic error handling if a maintenance run fails to be created successfully.

app/src/organisms/GripperWizardFlows/index.tsx

@@ -71,6 +71,7 @@ export function GripperWizardFlows(
   const [createdMaintenanceRunId, setCreatedMaintenanceRunId] = useState<
     string | null
   >(null)
+  const [errorMessage, setErrorMessage] = useState<null | string>(null)
 
   // we should start checking for run deletion only after the maintenance run is created
   // and the useCurrentRun poll has returned that created id
@@ -86,6 +87,9 @@ export function GripperWizardFlows(
     onSuccess: response => {
       setCreatedMaintenanceRunId(response.data.id)
     },
+    onError: error => {
+      setErrorMessage(error.message)
+    },
   })
 
   const { data: maintenanceRunData } = useNotifyCurrentMaintenanceRun({
@@ -117,7 +121,6 @@ export function GripperWizardFlows(
   ])
 
   const [isExiting, setIsExiting] = useState<boolean>(false)
-  const [errorMessage, setErrorMessage] = useState<null | string>(null)
 
   const handleClose = (): void => {
     if (props?.onComplete != null) {
@@ -298,9 +301,12 @@ export const GripperWizard = (
         isRobotMoving={isRobotMoving}
       />
     )
-  } else if (
+  }
+  // These flows often have custom error messaging, so this fallback modal is shown only in specific circumstances.
+  else if (
     (isExiting && errorMessage != null) ||
-    maintenanceRunStatus === RUN_STATUS_FAILED
+    maintenanceRunStatus === RUN_STATUS_FAILED ||
+    (errorMessage != null && createdMaintenanceRunId == null)
   ) {
     onExit = handleClose
     modalContent = (

app/src/organisms/PipetteWizardFlows/index.tsx

@@ -113,6 +113,7 @@ export const PipetteWizardFlows = (
   const [createdMaintenanceRunId, setCreatedMaintenanceRunId] = useState<
     string | null
   >(null)
+  const [errorMessage, setShowErrorMessage] = useState<null | string>(null)
   // we should start checking for run deletion only after the maintenance run is created
   // and the useCurrentRun poll has returned that created id
   const [
@@ -143,6 +144,9 @@ export const PipetteWizardFlows = (
       onSuccess: response => {
         setCreatedMaintenanceRunId(response.data.id)
       },
+      onError: error => {
+        setShowErrorMessage(error.message)
+      },
     },
     host
   )
@@ -169,7 +173,6 @@ export const PipetteWizardFlows = (
     closeFlow,
   ])
 
-  const [errorMessage, setShowErrorMessage] = useState<null | string>(null)
   const [isExiting, setIsExiting] = useState<boolean>(false)
   const proceed = (): void => {
     if (!isCommandMutationLoading) {
@@ -281,9 +284,11 @@ export const PipetteWizardFlows = (
   let onExit
   if (currentStep == null) return null
   let modalContent: JSX.Element = <div>UNASSIGNED STEP</div>
+  // These flows often have custom error messaging, so this fallback modal is shown only in specific circumstances.
   if (
     (isExiting && errorMessage != null) ||
-    maintenanceRunData?.data.status === RUN_STATUS_FAILED
+    maintenanceRunData?.data.status === RUN_STATUS_FAILED ||
+    (errorMessage != null && createdMaintenanceRunId == null)
   ) {
     modalContent = (
       <SimpleWizardBody