@opentrons/components 0.1.7-alpha.0 → 0.1.7-alpha.1

package/src/hardware-sim/ProtocolDeck/utils/getModulesInSlots.ts

@@ -1,129 +0,0 @@
-import {
-  SPAN7_8_10_11_SLOT,
-  getModuleDef2,
-  getLoadedLabwareDefinitionsByUri,
-} from '@opentrons/shared-data'
-import type {
-  CompletedProtocolAnalysis,
-  LoadLabwareRunTimeCommand,
-  ProtocolAnalysisOutput,
-  LoadModuleRunTimeCommand,
-  RunTimeCommand,
-  ModuleLocation,
-  ModuleModel,
-  LabwareDefinition2,
-} from '@opentrons/shared-data'
-import { getInitialLoadedLabwareByAdapter } from './getInitiallyLoadedLabwareByAdapter'
-
-interface ModuleInSlot {
-  moduleModel: ModuleModel
-  moduleLocation: ModuleLocation
-  nestedLabwareId: string | null
-  nestedLabwareDef: LabwareDefinition2 | null
-  nestedLabwareNickName: string | null
-}
-export const getModulesInSlots = (
-  protocolAnalysis: ProtocolAnalysisOutput | CompletedProtocolAnalysis
-): ModuleInSlot[] => {
-  if (protocolAnalysis != null && 'modules' in protocolAnalysis) {
-    const { commands, modules, labware } = protocolAnalysis
-    const initialLoadedLabwareByAdapter = getInitialLoadedLabwareByAdapter(
-      commands
-    )
-    return modules.reduce<ModuleInSlot[]>((acc, module) => {
-      const moduleDef = getModuleDef2(module.model)
-      const nestedLabwareId =
-        commands
-          .filter(
-            (command): command is LoadLabwareRunTimeCommand =>
-              command.commandType === 'loadLabware'
-          )
-          .find(
-            (command: LoadLabwareRunTimeCommand) =>
-              typeof command.params.location === 'object' &&
-              'moduleId' in command.params.location &&
-              command.params.location.moduleId === module.id
-          )?.result?.labwareId ?? null
-      const nestedLabware = labware.find(
-        item => nestedLabwareId != null && item.id === nestedLabwareId
-      )
-      const labwareDefinitionsByUri = getLoadedLabwareDefinitionsByUri(commands)
-      const nestedLabwareDef =
-        nestedLabware != null
-          ? labwareDefinitionsByUri[nestedLabware.definitionUri]
-          : null
-      const moduleInitialLoadInfo = getModuleInitialLoadInfo(
-        module.id,
-        commands
-      )
-      let slotName = moduleInitialLoadInfo.location.slotName
-      // Note: this is because PD for OT2 represents the slot the TC sits in as a made up slot. We want it to be rendered in slot 7
-      if (slotName === SPAN7_8_10_11_SLOT) {
-        slotName = '7'
-      }
-
-      const labwareInAdapterInMod =
-        nestedLabwareId != null
-          ? initialLoadedLabwareByAdapter[nestedLabwareId]
-          : null
-      //  NOTE: only rendering the labware on top most layer so
-      //  either the adapter or the labware are rendered but not both
-      const topLabwareDefinition =
-        labwareInAdapterInMod?.result?.definition ?? nestedLabwareDef
-      const topLabwareId =
-        labwareInAdapterInMod?.result?.labwareId ?? nestedLabwareId
-      const topLabwareDisplayName =
-        labwareInAdapterInMod != null
-          ? labwareInAdapterInMod.params.displayName?.toString() ?? null
-          : nestedLabware?.displayName?.toString() ?? null
-      return [
-        ...acc,
-        {
-          moduleModel: moduleDef.model,
-          moduleLocation: { slotName },
-          nestedLabwareId: topLabwareId,
-          nestedLabwareDef: topLabwareDefinition,
-          nestedLabwareNickName: topLabwareDisplayName,
-        },
-      ]
-    }, [])
-  }
-
-  return []
-}
-
-function getModuleInitialLoadInfo(
-  moduleId: string,
-  commands: RunTimeCommand[]
-): {
-  location: ModuleLocation
-  protocolLoadOrder: number
-} {
-  const moduleLoadIndex = commands.findIndex(
-    (command: RunTimeCommand): command is LoadModuleRunTimeCommand =>
-      command.commandType === 'loadModule' &&
-      command.result?.moduleId === moduleId
-  )
-
-  if (moduleLoadIndex === -1) {
-    throw new Error(
-      'expected to be able to find module location, but could not'
-    )
-  }
-
-  const protocolLoadOrder = commands
-    .slice(0, moduleLoadIndex)
-    .reduce(
-      (moduleLoadCount, command) =>
-        command.commandType === 'loadModule'
-          ? moduleLoadCount + 1
-          : moduleLoadCount,
-      0
-    )
-
-  return {
-    location: (commands[moduleLoadIndex] as LoadModuleRunTimeCommand).params
-      .location,
-    protocolLoadOrder,
-  }
-}

package/src/hardware-sim/ProtocolDeck/utils/getStandardDeckViewLayerBlockList.ts

@@ -1,29 +0,0 @@
-import type { RobotType } from '@opentrons/shared-data'
-
-const OT2_STANDARD_DECK_VIEW_LAYER_BLOCK_LIST: string[] = [
-  'calibrationMarkings',
-  'fixedBase',
-  'doorStops',
-  'metalFrame',
-  'removalHandle',
-  'removableDeckOutline',
-  'screwHoles',
-]
-
-const OT3_STANDARD_DECK_VIEW_LAYER_BLOCK_LIST: string[] = [
-  'DECK_BASE',
-  'BARCODE_COVERS',
-]
-
-export const getStandardDeckViewLayerBlockList = (
-  robotType: RobotType
-): string[] => {
-  switch (robotType) {
-    case 'OT-2 Standard':
-      return OT2_STANDARD_DECK_VIEW_LAYER_BLOCK_LIST
-    case 'OT-3 Standard':
-      return OT3_STANDARD_DECK_VIEW_LAYER_BLOCK_LIST
-    default:
-      return []
-  }
-}

package/src/hardware-sim/ProtocolDeck/utils/getWellFillFromLabwareId.ts

@@ -1,30 +0,0 @@
-import type { Liquid } from '@opentrons/shared-data'
-import type { WellFill } from '../../Labware'
-import type { LabwareByLiquidId } from '../types'
-
-export function getWellFillFromLabwareId(
-  labwareId: string,
-  liquidsInLoadOrder: Liquid[],
-  labwareByLiquidId: LabwareByLiquidId
-): WellFill {
-  let labwareWellFill: WellFill = {}
-  const liquidIds = Object.keys(labwareByLiquidId)
-  const labwareInfo = Object.values(labwareByLiquidId)
-
-  labwareInfo.forEach((labwareArray, index) => {
-    labwareArray.forEach(labware => {
-      if (labware.labwareId === labwareId) {
-        const liquidId = liquidIds[index]
-        const liquid = liquidsInLoadOrder.find(liquid => liquid.id === liquidId)
-        const wellFill: {
-          [well: string]: string
-        } = {}
-        Object.keys(labware.volumeByWell).forEach(key => {
-          wellFill[key] = liquid?.displayColor ?? ''
-        })
-        labwareWellFill = { ...labwareWellFill, ...wellFill }
-      }
-    })
-  })
-  return labwareWellFill
-}

package/src/hardware-sim/ProtocolDeck/utils/index.ts

@@ -1,4 +0,0 @@
-export * from './getLabwareInSlots'
-export * from './getStandardDeckViewLayerBlockList'
-export * from './getLabwareInfoByLiquidId'
-export * from './getWellFillFromLabwareId'

package/src/instrument/PipetteSelect.stories.tsx

@@ -1,40 +0,0 @@
-import * as React from 'react'
-import { PipetteSelect as PipetteSelectComponent } from './PipetteSelect'
-
-import type { Story, Meta } from '@storybook/react'
-
-export default {
-  title: 'Library/Organisms/Pipette Select',
-} as Meta
-
-const Template: Story<React.ComponentProps<typeof PipetteSelectComponent>> = ({
-  pipetteName,
-  ...args
-}) => {
-  const [pipetteNameControlled, setPipetteNameControlled] = React.useState(
-    pipetteName
-  )
-  const handleChange = (pipName: string): unknown => {
-    setPipetteNameControlled(pipName)
-  }
-  return (
-    <PipetteSelectComponent
-      {...args}
-      pipetteName={pipetteNameControlled}
-      onPipetteChange={handleChange}
-    />
-  )
-}
-export const PipetteSelect = Template.bind({})
-PipetteSelect.args = {
-  nameBlocklist: [
-    'p20_multi_gen2',
-    'p300_multi_gen2',
-    'p20_single_flex',
-    'p300_single_flex',
-    'p1000_single_flex',
-    'p1000_multi_flex',
-    'p50_multi_flex',
-  ],
-  enableNoneOption: true,
-}

package/src/instrument/PipetteSelect.tsx

@@ -1,170 +0,0 @@
-import groupBy from 'lodash/groupBy'
-import {
-  getAllPipetteNames,
-  getPipetteNameSpecs,
-  GEN1,
-  GEN2,
-  FLEX,
-} from '@opentrons/shared-data'
-import { Flex } from '../primitives'
-import { Select, CONTEXT_VALUE } from '../forms'
-import styles from './PipetteSelect.module.css'
-import type { PipetteNameSpecs } from '@opentrons/shared-data'
-import type { ActionMeta, SingleValue, MultiValue } from 'react-select'
-import type { SelectOption } from '../forms'
-export interface PipetteSelectProps {
-  /** currently selected value, optional in case selecting triggers immediate action */
-  pipetteName?: string | null
-  /** react-select change handler */
-  onPipetteChange: (
-    pipetteName: string | null,
-    e: ActionMeta<SelectOption>
-  ) => void
-  /** list of pipette names to omit */
-  nameBlocklist?: string[]
-  /** whether or not "None" shows up as the default option */
-  enableNoneOption?: boolean
-  /** input tabIndex */
-  tabIndex?: string | number
-  /** classes to apply to the top-level component */
-  className?: string
-  /** custom id to be applied. likely to be used as a data test id for e2e testing */
-  id?: string
-  disabled?: boolean
-}
-
-// TODO(mc, 2019-10-14): i18n
-const NONE = 'None'
-const OPTION_NONE = { value: '', label: NONE }
-
-const PIPETTE_SORT = ['maxVolume', 'channels'] as const
-
-// @ts-expect-error(mc, 2021-04-27): use TS type guard for filter
-const allPipetteNameSpecs: PipetteNameSpecs[] = getAllPipetteNames(
-  ...PIPETTE_SORT
-)
-  .map(getPipetteNameSpecs)
-  .filter(Boolean)
-
-const specsByCategory = groupBy(allPipetteNameSpecs, 'displayCategory')
-
-const specToOption = ({
-  name,
-  displayName,
-}: PipetteNameSpecs): { value: string; label: string } => ({
-  value: name,
-  label: displayName,
-})
-
-export const PipetteSelect = (props: PipetteSelectProps): JSX.Element => {
-  const {
-    tabIndex,
-    className,
-    enableNoneOption,
-    id,
-    nameBlocklist = [],
-    disabled = false,
-  } = props
-  const allowlist = ({ value }: SelectOption): boolean => {
-    return !nameBlocklist.some(n => n === value)
-  }
-  const flexOptions = specsByCategory[FLEX].map(specToOption).filter(allowlist)
-  const gen2Options = specsByCategory[GEN2].map(specToOption).filter(allowlist)
-  const gen1Options = specsByCategory[GEN1].map(specToOption).filter(allowlist)
-  const groupedOptions = [
-    ...(enableNoneOption ? [OPTION_NONE] : []),
-    ...(flexOptions.length > 0 ? [{ options: flexOptions }] : []),
-    ...(gen2Options.length > 0 ? [{ options: gen2Options }] : []),
-    ...(gen1Options.length > 0 ? [{ options: gen1Options }] : []),
-  ]
-  const defaultValue = enableNoneOption ? OPTION_NONE : null
-  const value =
-    allPipetteNameSpecs
-      .filter(s => s.name === props.pipetteName)
-      .map(specToOption)[0] || defaultValue
-
-  return (
-    <Select
-      isSearchable={false}
-      menuPosition="fixed"
-      className={className}
-      options={groupedOptions}
-      value={value}
-      isDisabled={disabled}
-      defaultValue={defaultValue}
-      tabIndex={tabIndex as number}
-      id={id}
-      onChange={(
-        option: SingleValue<SelectOption> | MultiValue<SelectOption>,
-        e: ActionMeta<SelectOption>
-      ) => {
-        const value = (option as SelectOption).value
-          ? (option as SelectOption).value
-          : null
-        props.onPipetteChange(value, e)
-      }}
-      formatOptionLabel={(option, { context }) => {
-        const { value } = option
-        const label = option.label || value
-        const specs = allPipetteNameSpecs.find(s => s.name === value)
-
-        return context === CONTEXT_VALUE || value === '' || !specs ? (
-          label
-        ) : (
-          <PipetteNameItem {...specs} />
-        )
-      }}
-    />
-  )
-}
-
-const PipetteNameItem = (props: PipetteNameSpecs): JSX.Element => {
-  const { channels, name, displayCategory } = props
-  const volumeClassMaybeMatch = name && name.match(/p(\d+)/i)
-  const volumeClass = volumeClassMaybeMatch ? volumeClassMaybeMatch[1] : ''
-  let displayChannels = ''
-  if (channels === 1) {
-    displayChannels = 'Single-Channel'
-  } else if (channels === 8) {
-    displayChannels = '8-Channel'
-  } else if (channels === 96) {
-    displayChannels = '96-Channel'
-  }
-  return (
-    <Flex
-      data-test={dataIdFormat(
-        'PipetteNameItem',
-        volumeClass,
-        channels,
-        displayCategory
-      )}
-    >
-      <div className={styles.pipette_volume_class}>{volumeClass}</div>
-      <div className={styles.pipette_channels}>{displayChannels}</div>
-      <div className={styles.pipette_category}>
-        {channels === 96 ? 'FLEX' : displayCategory}
-      </div>
-    </Flex>
-  )
-}
-
-const dataIdFormat = (
-  componentName: string,
-  volumeClass: string,
-  channels: number,
-  displayCategory: string
-): string => {
-  let dataIdFormatChannels
-  if (channels === 1) {
-    dataIdFormatChannels = 'SingleChannel'
-  } else if (channels === 8) {
-    dataIdFormatChannels = 'MultiChannel'
-  } else {
-    dataIdFormatChannels = '96-Channel'
-  }
-  const dataIdFormatVolumeClass = volumeClass.toLowerCase()
-  const dataIdFormatDisplayCategory =
-    displayCategory.charAt(0) + displayCategory.slice(1).toLowerCase()
-
-  return `${componentName}_${dataIdFormatVolumeClass}${dataIdFormatChannels}${dataIdFormatDisplayCategory}`
-}

package/src/instrument/__tests__/PipetteSelect.test.tsx

@@ -1,4 +0,0 @@
-import { describe, it } from 'vitest'
-describe('PipetteSelect', () => {
-  it.todo('replace deprecated enzyme test')
-})