diff --git a/components/src/atoms/InputField/index.tsx b/components/src/atoms/InputField/index.tsx index 57667e6cca9..c6d8eff68ea 100644 --- a/components/src/atoms/InputField/index.tsx +++ b/components/src/atoms/InputField/index.tsx @@ -2,7 +2,12 @@ import * as React from 'react' import styled, { css } from 'styled-components' import { Flex } from '../../primitives' -import { ALIGN_CENTER, DIRECTION_COLUMN, TEXT_ALIGN_RIGHT } from '../../styles' +import { + ALIGN_CENTER, + DIRECTION_COLUMN, + DIRECTION_ROW, + TEXT_ALIGN_RIGHT, +} from '../../styles' import { BORDERS, COLORS } from '../../helix-design-system' import { Icon } from '../../icons' import { RESPONSIVENESS, SPACING, TYPOGRAPHY } from '../../ui-style-constants' @@ -249,7 +254,11 @@ export const InputField = React.forwardRef( > {title != null ? ( - + {title !== null ? ( - + Pausing until{{module}}reaches", "untilTime": "Pausing for" }, + "pipette": "Pipette", "protocol_steps": "Protocol steps", "protocol_timeline": "Protocol timeline", "rename": "Rename", @@ -124,10 +127,12 @@ } }, "time": "Time", + "tiprack": "Tiprack", "tip_position": "{{prefix}} tip position", "touch_tip_position": "Touch tip position from top", "valid_range": "Valid range between {{min}} - {{max}} {{unit}}", "view_details": "View details", + "volume_per_well": "Volume per well", "well_name": "Well {{wellName}}", "well_order_title": "{{prefix}} well order", "well_position": "Well position (x,y,z): " diff --git a/protocol-designer/src/assets/localization/en/shared.json b/protocol-designer/src/assets/localization/en/shared.json index dafebf2b62d..64a5cdffdcc 100644 --- a/protocol-designer/src/assets/localization/en/shared.json +++ b/protocol-designer/src/assets/localization/en/shared.json @@ -104,6 +104,7 @@ "ot2": "Opentrons OT-2", "overwrite_labware": "Overwrite labware", "overwrite": "Click Overwrite to replace the existing labware with the new labware.", + "part": "Part {{current}} / {{max}}", "pipette": "Pipette", "pd_version": "Protocol designer version", "primary_order": "Primary order", diff --git a/protocol-designer/src/components/StepEditForm/fields/DropTipField/__tests__/DropTipField.test.tsx b/protocol-designer/src/components/StepEditForm/fields/DropTipField/__tests__/DropTipField.test.tsx index 8c5426bdaae..195096f0c07 100644 --- a/protocol-designer/src/components/StepEditForm/fields/DropTipField/__tests__/DropTipField.test.tsx +++ b/protocol-designer/src/components/StepEditForm/fields/DropTipField/__tests__/DropTipField.test.tsx @@ -55,7 +55,7 @@ describe('DropTipField', () => { }) it('renders the label and dropdown field with trash bin selected as default', () => { render(props) - screen.getByText('drop tip location') + screen.getByText('Tip drop location') screen.getByRole('combobox', { name: '' }) screen.getByRole('option', { name: 'Trash Bin' }) screen.getByRole('option', { name: 'mock tip' }) diff --git a/protocol-designer/src/molecules/DropdownStepFormField/index.tsx b/protocol-designer/src/molecules/DropdownStepFormField/index.tsx index 6cd81c742c4..869d272ddde 100644 --- a/protocol-designer/src/molecules/DropdownStepFormField/index.tsx +++ b/protocol-designer/src/molecules/DropdownStepFormField/index.tsx @@ -1,5 +1,13 @@ import { useTranslation } from 'react-i18next' -import { DropdownMenu, Flex, SPACING } from '@opentrons/components' +import { + COLORS, + DIRECTION_COLUMN, + DropdownMenu, + Flex, + ListItem, + SPACING, + StyledText, +} from '@opentrons/components' import type { Options } from '@opentrons/components' import type { FieldProps } from '../../pages/Designer/ProtocolSteps/StepForm/types' @@ -30,22 +38,41 @@ export function DropdownStepFormField( return ( - { - updateValue(value) - }} - /> + {options.length > 1 ? ( + { + updateValue(value) + }} + /> + ) : ( + + + {title} + + + + + {options[0].name} + + + + + )} ) } diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/LabwareField.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/LabwareField.tsx index f0c6df3544d..f4c18fd695e 100644 --- a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/LabwareField.tsx +++ b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/LabwareField.tsx @@ -17,12 +17,13 @@ export function LabwareField(props: FieldProps): JSX.Element { ? [...options, ...disposalOptions] : [...options] + console.log('name', name) return ( ) } diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/PipetteField.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/PipetteField.tsx index 50eb6b59997..1f9053b0478 100644 --- a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/PipetteField.tsx +++ b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/PipetteField.tsx @@ -13,7 +13,7 @@ export const PipetteField = (props: FieldProps): JSX.Element => { {...props} options={pipetteOptions} value={value ? String(value) : null} - title={t('select_pipette')} + title={t('pipette')} /> ) } diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/TiprackField.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/TiprackField.tsx index 9f9cca5157e..df9d5ad4fd0 100644 --- a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/TiprackField.tsx +++ b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/TiprackField.tsx @@ -1,6 +1,14 @@ import { useEffect } from 'react' import { useTranslation } from 'react-i18next' import { useSelector } from 'react-redux' +import { + COLORS, + DIRECTION_COLUMN, + Flex, + ListItem, + SPACING, + StyledText, +} from '@opentrons/components' import { getPipetteEntities } from '../../../../../step-forms/selectors' import { getTiprackOptions } from '../../../../../ui/labware/selectors' import { DropdownStepFormField } from '../../../../../molecules' @@ -29,12 +37,34 @@ export function TiprackField(props: TiprackFieldProps): JSX.Element { }, [defaultTiprackUris, value, updateValue]) const hasMissingTiprack = defaultTiprackUris.length > tiprackOptions.length return ( - + <> + {tiprackOptions.length > 1 ? ( + + ) : ( + + + {t('tiprack')} + + + + + {tiprackOptions[0].name} + + + + + )} + ) } diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/VolumeField.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/VolumeField.tsx index 2059a81b389..5f0658ef949 100644 --- a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/VolumeField.tsx +++ b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/VolumeField.tsx @@ -8,7 +8,7 @@ export function VolumeField(props: FieldProps): JSX.Element { return ( diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/WellSelectionField.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/WellSelectionField.tsx index 57125f7b8a1..f12f3e0dd02 100644 --- a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/WellSelectionField.tsx +++ b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/PipetteFields/WellSelectionField.tsx @@ -1,7 +1,9 @@ import { createPortal } from 'react-dom' import { useDispatch, useSelector } from 'react-redux' import { useTranslation } from 'react-i18next' + import { + ALIGN_CENTER, COLORS, DIRECTION_COLUMN, Flex, @@ -13,6 +15,7 @@ import { useHoverTooltip, } from '@opentrons/components' import { COLUMN } from '@opentrons/shared-data' + import { actions as stepsActions, getSelectedStepId, @@ -22,6 +25,7 @@ import { selectors as stepFormSelectors } from '../../../../../step-forms' import { SelectWellsModal } from '../../../../../organisms' import { getMainPagePortalEl } from '../../../../../components/portals/MainPageModalPortal' import { getNozzleType } from '../utils' + import type { FieldProps } from '../types' export type WellSelectionFieldProps = FieldProps & { @@ -94,8 +98,13 @@ export const WellSelectionField = ( const [targetProps, tooltipProps] = useHoverTooltip() return ( <> - - + + {i18n.format(label, 'capitalize')} diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx index a14be039d93..f4ecd3acf00 100644 --- a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx +++ b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx @@ -10,11 +10,11 @@ import { Icon, POSITION_RELATIVE, PrimaryButton, - SPACING, SecondaryButton, + SPACING, StyledText, - TYPOGRAPHY, Toolbox, + TYPOGRAPHY, } from '@opentrons/components' import { stepIconsByType } from '../../../../form-types' import { FormAlerts } from '../../../../organisms' @@ -159,7 +159,7 @@ export function StepFormToolbox(props: StepFormToolboxProps): JSX.Element { 'capitalize' ), t, - }) as string + }) ) } else { setShowFormErrorsAndWarnings(true) @@ -181,7 +181,7 @@ export function StepFormToolbox(props: StepFormToolboxProps): JSX.Element { subHeader={ isMultiStepToolbox ? ( - {t('shared:step', { current: toolboxStep + 1, max: 2 })} + {t('shared:part', { current: toolboxStep + 1, max: 2 })} ) : null } diff --git a/step-generation/src/commandCreators/atomic/dispense.ts b/step-generation/src/commandCreators/atomic/dispense.ts index c06e0035f7b..c009ce34403 100644 --- a/step-generation/src/commandCreators/atomic/dispense.ts +++ b/step-generation/src/commandCreators/atomic/dispense.ts @@ -221,7 +221,7 @@ export const dispense: CommandCreator = ( }, flowRate, // pushOut will always be undefined in step-generation for now - // since there is no easy way to allow users to select a volume for it in PD + // since there is no easy way to allow users to for it in PD }, ...(isAirGap && { meta: { isAirGap } }), },