fix(app): properly display no liquids used text in protocol details/s…

…etup (#14144) * fix(app): properly display no liquids used text in protocol details/setup closes RQA-2006
Opentrons · Dec 11, 2023 · f7caea6 · f7caea6
1 parent d5d3968
commit f7caea6
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 5 deletions.
diff --git a/app/src/organisms/Devices/ProtocolRun/ProtocolRunSetup.tsx b/app/src/organisms/Devices/ProtocolRun/ProtocolRunSetup.tsx
@@ -1,7 +1,10 @@
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
 
-import { parseAllRequiredModuleModels } from '@opentrons/api-client'
+import {
+ parseAllRequiredModuleModels,
+ parseLiquidsInLoadOrder,
+} from '@opentrons/api-client'
 import {
  ALIGN_CENTER,
  COLORS,
@@ -133,8 +136,16 @@ export function ProtocolRunSetup({
  })
 
  if (robot == null) return null
- const hasLiquids =
- protocolAnalysis != null && protocolAnalysis.liquids?.length > 0
+
+ const liquids = protocolAnalysis?.liquids ?? []
+
+ const liquidsInLoadOrder =
+ protocolAnalysis != null
+ ? parseLiquidsInLoadOrder(liquids, protocolAnalysis.commands)
+ : []
+
+ const hasLiquids = liquidsInLoadOrder.length > 0
+
  const hasModules = protocolAnalysis != null && modules.length > 0
 
  const protocolDeckConfig = getSimplestDeckConfigForProtocol(protocolAnalysis)

diff --git a/app/src/organisms/Devices/ProtocolRun/__tests__/ProtocolRunSetup.test.tsx b/app/src/organisms/Devices/ProtocolRun/__tests__/ProtocolRunSetup.test.tsx
@@ -1,7 +1,10 @@
 import * as React from 'react'
 import { when, resetAllWhenMocks } from 'jest-when'
 
-import { parseAllRequiredModuleModels } from '@opentrons/api-client'
+import {
+ parseAllRequiredModuleModels,
+ parseLiquidsInLoadOrder,
+} from '@opentrons/api-client'
 import {
  partialComponentPropsMatcher,
  renderWithProviders,
@@ -76,6 +79,9 @@ const mockUseStoredProtocolAnalysis = useStoredProtocolAnalysis as jest.MockedFu
 const mockParseAllRequiredModuleModels = parseAllRequiredModuleModels as jest.MockedFunction<
  typeof parseAllRequiredModuleModels
 >
+const mockParseLiquidsInLoadOrder = parseLiquidsInLoadOrder as jest.MockedFunction<
+ typeof parseLiquidsInLoadOrder
+>
 const mockSetupLabware = SetupLabware as jest.MockedFunction<
  typeof SetupLabware
 >
@@ -142,6 +148,7 @@ describe('ProtocolRunSetup', () => {
  ...MOCK_ROTOCOL_LIQUID_KEY,
  } as unknown) as ProtocolAnalysisOutput)
  when(mockParseAllRequiredModuleModels).mockReturnValue([])
+ when(mockParseLiquidsInLoadOrder).mockReturnValue([])
  when(mockUseRobot)
  .calledWith(ROBOT_NAME)
  .mockReturnValue(mockConnectedRobot)

diff --git a/app/src/organisms/ProtocolDetails/ProtocolLiquidsDetails.tsx b/app/src/organisms/ProtocolDetails/ProtocolLiquidsDetails.tsx
@@ -45,7 +45,7 @@ export const ProtocolLiquidsDetails = (
  overflowY="auto"
  data-testid="LiquidsDetailsTab"
  >
- {liquids.length > 0 ? (
+ {liquidsInLoadOrder.length > 0 ? (
  liquidsInLoadOrder?.map((liquid, index) => {
  return (
  <React.Fragment key={liquid.id}>

diff --git a/app/src/organisms/ProtocolDetails/__tests__/ProtocolLiquidsDetails.test.tsx b/app/src/organisms/ProtocolDetails/__tests__/ProtocolLiquidsDetails.test.tsx
@@ -63,6 +63,7 @@ describe('ProtocolLiquidsDetails', () => {
  })
  it('renders the correct info for no liquids in the protocol', () => {
  props.liquids = []
+ mockParseLiquidsInLoadOrder.mockReturnValue([])
  const [{ getByText, getByLabelText }] = render(props)
  getByText('No liquids are specified for this protocol')
  getByLabelText('ProtocolLIquidsDetails_noLiquidsIcon')