diff --git a/protocol-designer/src/pages/Designer/DeckSetup/SelectedHoveredItems.tsx b/protocol-designer/src/pages/Designer/DeckSetup/SelectedHoveredItems.tsx index 71f07b973e3..2f3d0b4323d 100644 --- a/protocol-designer/src/pages/Designer/DeckSetup/SelectedHoveredItems.tsx +++ b/protocol-designer/src/pages/Designer/DeckSetup/SelectedHoveredItems.tsx @@ -7,6 +7,8 @@ import { import { selectors } from '../../../labware-ingred/selectors' import { getOnlyLatestDefs } from '../../../labware-defs' import { getCustomLabwareDefsByURI } from '../../../labware-defs/selectors' +import { getInitialDeckSetup } from '../../../step-forms/selectors' +import { LabwareOnDeck } from '../../../components/DeckSetup/LabwareOnDeck' import { ModuleLabel } from './ModuleLabel' import { LabwareLabel } from '../LabwareLabel' import { FixtureRender } from './FixtureRender' @@ -48,20 +50,44 @@ export const SelectedHoveredItems = ( } = selectedSlotInfo const customLabwareDefs = useSelector(getCustomLabwareDefsByURI) const defs = getOnlyLatestDefs() - + const deckSetup = useSelector(getInitialDeckSetup) + const { labware, modules } = deckSetup + const matchingSelectedLabwareOnDeck = Object.values(labware).find(labware => { + const moduleUnderLabware = Object.values(modules).find( + mod => mod.id === labware.slot + ) + const matchingSlot = + moduleUnderLabware != null ? moduleUnderLabware.slot : labware.slot + return ( + matchingSlot === selectedSlot.slot && + labware.labwareDefURI === selectedLabwareDefUri + ) + }) + const matchingSelectedNestedLabwareOnDeck = Object.values(labware).find( + lw => { + const adapterUnderLabware = Object.values(labware).find( + lab => lab.id === lw.slot + ) + if (adapterUnderLabware == null) { + return + } + const moduleUnderLabware = Object.values(modules).find( + mod => mod.id === adapterUnderLabware.slot + ) + const matchingSlot = + moduleUnderLabware != null + ? moduleUnderLabware.slot + : adapterUnderLabware.slot + return ( + lw.labwareDefURI === selectedNestedLabwareDefUri && + matchingSlot === selectedSlot.slot + ) + } + ) const hoveredLabwareDef = hoveredLabware != null ? defs[hoveredLabware] ?? customLabwareDefs[hoveredLabware] ?? null : null - const selectedLabwareDef = - selectedLabwareDefUri != null - ? defs[selectedLabwareDefUri] ?? customLabwareDefs[selectedLabwareDefUri] - : null - const selectedNestedLabwareDef = - selectedNestedLabwareDefUri != null - ? defs[selectedNestedLabwareDefUri] ?? - customLabwareDefs[selectedNestedLabwareDefUri] - : null const orientation = slotPosition != null @@ -83,9 +109,9 @@ export const SelectedHoveredItems = ( } labwareInfos.push(selectedLabwareLabel) } - if (selectedNestedLabwareDef != null && hoveredLabware == null) { + if (matchingSelectedNestedLabwareOnDeck != null && hoveredLabware == null) { const selectedNestedLabwareLabel = { - text: selectedNestedLabwareDef.metadata.displayName, + text: matchingSelectedNestedLabwareOnDeck.def.metadata.displayName, isSelected: true, isLast: hoveredLabware == null, } @@ -132,19 +158,23 @@ export const SelectedHoveredItems = ( orientation={orientation} > <> - {selectedLabwareDef != null && + {matchingSelectedLabwareOnDeck != null && selectedModuleModel != null && hoveredLabware == null ? ( - - - + ) : null} - {selectedNestedLabwareDef != null && + {matchingSelectedNestedLabwareOnDeck != null && selectedModuleModel != null && hoveredLabware == null ? ( - - - + ) : null} {hoveredLabwareDef != null && selectedModuleModel != null ? ( @@ -165,41 +195,47 @@ export const SelectedHoveredItems = ( ) : null} ) : null} - {selectedLabwareDef != null && + {matchingSelectedLabwareOnDeck != null && slotPosition != null && selectedModuleModel == null && hoveredLabware == null ? ( <> - - - + {selectedNestedLabwareDefUri == null ? ( ) : null} ) : null} - {selectedNestedLabwareDef != null && + {matchingSelectedNestedLabwareOnDeck != null && slotPosition != null && selectedModuleModel == null && hoveredLabware == null ? ( <> - - - - {selectedLabwareDef != null ? ( + + {matchingSelectedLabwareOnDeck != null ? ( { const actual = await importOriginal() return { ...actual, - LabwareRender: vi.fn(), Module: vi.fn(), } }) @@ -43,6 +48,20 @@ describe('SelectedHoveredItems', () => { hoveredFixture: null, slotPosition: [0, 0, 0], } + vi.mocked(getInitialDeckSetup).mockReturnValue({ + modules: {}, + additionalEquipmentOnDeck: {}, + pipettes: {}, + labware: { + labware: { + id: 'mockId', + def: fixture24Tuberack as LabwareDefinition2, + labwareDefURI: 'fixture/fixture_universal_flat_bottom_adapter/1', + slot: 'D3', + }, + }, + }) + vi.mocked(LabwareOnDeck).mockReturnValue(
mock LabwareOnDeck
) vi.mocked(selectors.getZoomedInSlotInfo).mockReturnValue({ selectedLabwareDefUri: null, selectedNestedLabwareDefUri: null, @@ -52,7 +71,6 @@ describe('SelectedHoveredItems', () => { }) vi.mocked(getCustomLabwareDefsByURI).mockReturnValue({}) vi.mocked(FixtureRender).mockReturnValue(
mock FixtureRender
) - vi.mocked(LabwareRender).mockReturnValue(
mock LabwareRender
) vi.mocked(Module).mockReturnValue(
mock Module
) }) it('renders a selected fixture by itself', () => { @@ -70,9 +88,9 @@ describe('SelectedHoveredItems', () => { }) render(props) screen.getByText('mock FixtureRender') - screen.getByText('mock LabwareRender') + screen.getByText('mock LabwareOnDeck') expect(screen.queryByText('mock Module')).not.toBeInTheDocument() - screen.getByText('Fixture Opentrons Universal Flat Heater-Shaker Adapter') + screen.getByText('Opentrons screwcap 2mL tuberack') }) it('renders a selected module', () => { vi.mocked(selectors.getZoomedInSlotInfo).mockReturnValue({ @@ -102,6 +120,25 @@ describe('SelectedHoveredItems', () => { screen.getByText('Fixture Opentrons Universal Flat Heater-Shaker Adapter') }) it('renders selected fixture and both labware and nested labware', () => { + vi.mocked(getInitialDeckSetup).mockReturnValue({ + modules: {}, + additionalEquipmentOnDeck: {}, + pipettes: {}, + labware: { + labware: { + id: 'mockId', + def: fixture24Tuberack as LabwareDefinition2, + labwareDefURI: 'fixture/fixture_universal_flat_bottom_adapter/1', + slot: 'D3', + }, + labware2: { + id: 'mockId2', + def: fixture24Tuberack as LabwareDefinition2, + labwareDefURI: 'fixture/fixture_universal_flat_bottom_adapter/1', + slot: 'mockId', + }, + }, + }) vi.mocked(selectors.getZoomedInSlotInfo).mockReturnValue({ selectedLabwareDefUri: 'fixture/fixture_universal_flat_bottom_adapter/1', selectedNestedLabwareDefUri: @@ -112,12 +149,10 @@ describe('SelectedHoveredItems', () => { }) render(props) screen.getByText('mock FixtureRender') - expect(screen.getAllByText('mock LabwareRender')).toHaveLength(2) - expect( - screen.getAllByText( - 'Fixture Opentrons Universal Flat Heater-Shaker Adapter' - ) - ).toHaveLength(2) + expect(screen.getAllByText('mock LabwareOnDeck')).toHaveLength(2) + expect(screen.getAllByText('Opentrons screwcap 2mL tuberack')).toHaveLength( + 2 + ) }) it('renders nothing when there is a hovered module but selected fixture', () => { props.hoveredModule = HEATERSHAKER_MODULE_V1