Add tiprack selection to overview screen based on updated designs

Opentrons · May 16, 2024 · 75577eb · 75577eb
1 parent 7e5759d
commit 75577eb
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 1 deletion.
diff --git a/app/src/organisms/QuickTransferFlow/Overview.tsx b/app/src/organisms/QuickTransferFlow/Overview.tsx
@@ -35,6 +35,10 @@ export function Overview(props: OverviewProps): JSX.Element | null {
       option: t('pipette'),
       value: state.pipette.displayName,
     },
+    {
+      option: t('tip_rack'),
+      value: state.tipRack.metadata.displayName,
+    },
     {
       option: t('source_labware'),
       value: state.sourceLabware.metadata.displayName,
@@ -61,7 +65,7 @@ export function Overview(props: OverviewProps): JSX.Element | null {
       {displayItems.map(displayItem => (
         <ListItem type="noActive" key={displayItem.option}>
           <Flex justifyContent={JUSTIFY_SPACE_BETWEEN} width="100%">
-            <StyledText css={TYPOGRAPHY.level4HeaderSemiBold} width="30rem">
+            <StyledText css={TYPOGRAPHY.level4HeaderSemiBold} width="20rem">
               {displayItem.option}
             </StyledText>
             <StyledText

diff --git a/app/src/organisms/QuickTransferFlow/__tests__/Overview.test.tsx b/app/src/organisms/QuickTransferFlow/__tests__/Overview.test.tsx
@@ -21,6 +21,11 @@ describe('Overview', () => {
         pipette: {
           displayName: 'Pipette display name',
         } as any,
+        tipRack: {
+          metadata: {
+            displayName: 'Tip rack display name',
+          },
+        } as any,
         sourceLabware: {
           metadata: {
             displayName: 'Source labware name',
@@ -44,6 +49,8 @@ describe('Overview', () => {
     render(props)
     screen.getByText('Pipette')
     screen.getByText('Pipette display name')
+    screen.getByText('Tip rack')
+    screen.getByText('Tip rack display name')
     screen.getByText('Source labware')
     screen.getByText('Source labware name')
     screen.getByText('Destination labware')
@@ -57,6 +64,11 @@ describe('Overview', () => {
         pipette: {
           displayName: 'Pipette display name',
         } as any,
+        tipRack: {
+          metadata: {
+            displayName: 'Tip rack display name',
+          },
+        } as any,
         sourceLabware: {
           metadata: {
             displayName: 'Source labware name',
@@ -80,6 +92,11 @@ describe('Overview', () => {
         pipette: {
           displayName: 'Pipette display name',
         } as any,
+        tipRack: {
+          metadata: {
+            displayName: 'Tip rack display name',
+          },
+        } as any,
         sourceLabware: {
           metadata: {
             displayName: 'Source labware name',