fix(app): fix quick transfer waste chute option issue (#20183)

* fix(app): fix quick transfer waste chute option issue

Author: koji

app/src/organisms/ODD/QuickTransferFlow/Dispense/hooks/useDispenseSettingsConfig.ts

@@ -55,6 +55,35 @@ export function useDispenseSettingsConfig({
       return t('blow_out_into_waste_chute')
     }
   }
+  const getDisposalVolumeLocationCopy = (): string => {
+    if (state.disposalVolumeDispenseSettings?.blowOutLocation == null) {
+      return t('trashBin')
+    }
+    if (
+      state.disposalVolumeDispenseSettings.blowOutLocation ===
+      SOURCE_WELL_BLOWOUT_DESTINATION
+    ) {
+      return t('blow_out_source_well')
+    }
+    if (
+      typeof state.disposalVolumeDispenseSettings.blowOutLocation ===
+        'object' &&
+      state.disposalVolumeDispenseSettings.blowOutLocation.cutoutFixtureId ===
+        TRASH_BIN_ADAPTER_FIXTURE
+    ) {
+      return t('trashBin')
+    }
+    if (
+      typeof state.disposalVolumeDispenseSettings.blowOutLocation ===
+        'object' &&
+      WASTE_CHUTE_FIXTURES.includes(
+        state.disposalVolumeDispenseSettings.blowOutLocation.cutoutFixtureId
+      )
+    ) {
+      return t('wasteChute')
+    }
+    return t('trashBin')
+  }
 
   const touchTipEnabled = getIsTouchTipEnabled(state.destination)
   const hasLiquidClass = state.liquidClassName !== 'none'
@@ -197,11 +226,7 @@ export function useDispenseSettingsConfig({
         state.disposalVolumeDispenseSettings != null && isMultiTransfer
           ? t('disposal_volume_label', {
               volume: state.disposalVolumeDispenseSettings.volume,
-              location:
-                state.disposalVolumeDispenseSettings.blowOutLocation ===
-                SOURCE_WELL_BLOWOUT_DESTINATION
-                  ? t('blow_out_source_well')
-                  : t('trashBin'),
+              location: getDisposalVolumeLocationCopy(),
               flowRate: state.disposalVolumeDispenseSettings.flowRate,
             })
           : t('option_disabled'),

app/src/organisms/ODD/QuickTransferFlow/QuickTransferAdvancedSettings/DisposalVolume.tsx

@@ -14,6 +14,7 @@ import {
   StyledText,
 } from '@opentrons/components'
 import {
+  FLEX_SINGLE_SLOT_BY_CUTOUT_ID,
   getTipTypeFromTipRackDefinition,
   LOW_VOLUME_PIPETTES,
   TRASH_BIN_ADAPTER_FIXTURE,
@@ -65,41 +66,62 @@ export function DisposalVolume(props: DisposalVolumeProps): JSX.Element {
     if (typeof blowOut.location === 'string') {
       return blowOut.location
     }
-    return `trashBin:${blowOut.location.cutoutId}`
+    if (
+      'cutoutFixtureId' in blowOut.location &&
+      typeof blowOut.location.cutoutFixtureId === 'string' &&
+      WASTE_CHUTE_FIXTURES.includes(blowOut.location.cutoutFixtureId)
+    ) {
+      return `wasteChute:${blowOut.location.cutoutId}`
+    }
+    if ('cutoutId' in blowOut.location) {
+      return `trashBin:${blowOut.location.cutoutId}`
+    }
+    return ''
   }
 
   const [selectedBlowoutLocation, setSelectedBlowoutLocation] =
     useState<string>(getInitialBlowoutLocation(state.blowOutDispense))
   const [flowRate, setFlowRate] = useState<number | null>(null)
   const deckConfig = useNotifyDeckConfigurationQuery().data ?? []
-  const fixtureLocationOptions = deckConfig.filter(
-    cutoutConfig =>
-      WASTE_CHUTE_FIXTURES.includes(cutoutConfig.cutoutFixtureId) ||
-      TRASH_BIN_ADAPTER_FIXTURE === cutoutConfig.cutoutFixtureId
-  )
-
-  const trashBinCutoutId = fixtureLocationOptions.find(
-    option => option.cutoutFixtureId === TRASH_BIN_ADAPTER_FIXTURE
-  )?.cutoutId
 
+  const trashBinCutoutConfig = deckConfig.find(
+    cutoutConfig => cutoutConfig.cutoutFixtureId === TRASH_BIN_ADAPTER_FIXTURE
+  )
   const trashBinOption: BlowOutLocation | undefined =
-    trashBinCutoutId != null
+    trashBinCutoutConfig != null
       ? {
-          cutoutId: trashBinCutoutId,
+          cutoutId: trashBinCutoutConfig.cutoutId,
           cutoutFixtureId: TRASH_BIN_ADAPTER_FIXTURE,
         }
       : undefined
 
+  const wasteChuteOptions = deckConfig
+    .filter(
+      option =>
+        typeof option.cutoutFixtureId === 'string' &&
+        WASTE_CHUTE_FIXTURES.includes(option.cutoutFixtureId)
+    )
+    .map(option => ({
+      option,
+      value: `wasteChute:${option.cutoutId}`,
+      description: t('wasteChute_location', {
+        slotName: FLEX_SINGLE_SLOT_BY_CUTOUT_ID[option.cutoutId],
+      }),
+    }))
+
   const blowoutLocationOptions = [
     ...(trashBinOption != null
       ? [
           {
             option: trashBinOption,
             value: `trashBin:${trashBinOption.cutoutId}`,
-            description: t('trashBin'),
+            description: t('trashBin_location', {
+              slotName: FLEX_SINGLE_SLOT_BY_CUTOUT_ID[trashBinOption.cutoutId],
+            }),
           },
         ]
       : []),
+    ...wasteChuteOptions,
     {
       option: SOURCE_WELL_BLOWOUT_DESTINATION,
       value: SOURCE_WELL_BLOWOUT_DESTINATION,
@@ -113,11 +135,14 @@ export function DisposalVolume(props: DisposalVolumeProps): JSX.Element {
   const flowRatesForSupportedTip: SupportedTip | undefined =
     state.volume < 5 &&
     `lowVolumeDefault` in liquidSpecs &&
+    typeof pipetteName === 'string' &&
     LOW_VOLUME_PIPETTES.includes(pipetteName)
       ? liquidSpecs.lowVolumeDefault.supportedTips[tipType]
       : liquidSpecs.default.supportedTips[tipType]
   const minFlowRate = 0.1
-  const maxFlowRate = Math.floor(flowRatesForSupportedTip?.uiMaxFlowRate ?? 0)
+  const maxFlowRate = Math.floor(
+    (flowRatesForSupportedTip?.uiMaxFlowRate ?? 0) as number
+  )
 
   const flowRateError =
     flowRate != null && (flowRate < minFlowRate || flowRate > maxFlowRate)
@@ -145,11 +170,17 @@ export function DisposalVolume(props: DisposalVolumeProps): JSX.Element {
         return
       }
 
+      const selectedOption = blowoutLocationOptions.find(
+        opt => opt.value === selectedBlowoutLocation
+      )
+      const blowOutLocation: BlowOutLocation =
+        selectedOption?.option ?? (selectedBlowoutLocation as BlowOutLocation)
+
       dispatch({
         type: ACTIONS.SET_DISPOSAL_VOLUME_DISPENSE,
         disposalVolumeDispenseSettings: {
           volume,
-          blowOutLocation: selectedBlowoutLocation as BlowOutLocation,
+          blowOutLocation,
           flowRate,
         },
       })
@@ -257,7 +288,8 @@ export function DisposalVolume(props: DisposalVolumeProps): JSX.Element {
                 key={option.value}
                 isSelected={selectedBlowoutLocation === option.value}
                 onChange={() => {
-                  setSelectedBlowoutLocation(option.value)
+                  const value = String(option.value)
+                  setSelectedBlowoutLocation(value)
                 }}
                 buttonValue={option.value}
                 buttonLabel={option.description}

app/src/organisms/ODD/QuickTransferFlow/QuickTransferAdvancedSettings/__tests__/DisposalVolume.test.tsx

@@ -83,7 +83,7 @@ describe('DisposalVolume', () => {
     await user.click(screen.getByText('Continue'))
     screen.getByText('Select blowout location')
     screen.getByText('Continue')
-    screen.getByText('Trash bin')
+    screen.getByText('Trash bin in C3')
     screen.getByText('Source well')
   })