fix(protocol-designer): fix small DQA bugs

Fixes 3 small style bugs for 1) copy for importing a protocol on PD landing page, 2) background color of selected off deck location, and 3) height of divider in liquid overflow menu Closes RQA-3646, Closes RQA-3672, Closes RQA-3683
Opentrons · Jan 9, 2025 · d50de78 · d50de78
1 parent ffbff3a
commit d50de78
Show file tree

Hide file tree

Showing 5 changed files with 6 additions and 5 deletions.
diff --git a/protocol-designer/src/assets/localization/en/shared.json b/protocol-designer/src/assets/localization/en/shared.json
@@ -37,6 +37,7 @@
   "heatershakermoduletype": "Heater-shaker Module",
   "hints": "Hints",
   "import": "Import",
+  "import_existing_protocol": "Import existing protocol",
   "incorrect_file_header": "Invalid file type",
   "incorrect_file_type_body": "Protocol Designer only accepts JSON protocol files created with Protocol Designer. Upload a valid file to continue.",
   "invalid_json_file_body": "This JSON file is either missing required information or contains sections that Protocol Designer cannot read. At this time we do not support JSON files created outside of Protocol Designer.",

diff --git a/protocol-designer/src/pages/Designer/LiquidsOverflowMenu.tsx b/protocol-designer/src/pages/Designer/LiquidsOverflowMenu.tsx
@@ -5,10 +5,10 @@ import { useLocation } from 'react-router-dom'
 import {
   ALIGN_CENTER,
   BORDERS,
-  Box,
   COLORS,
   CURSOR_POINTER,
   DIRECTION_COLUMN,
+  Divider,
   Flex,
   Icon,
   LiquidIcon,
@@ -92,7 +92,7 @@ export function LiquidsOverflowMenu(
         )
       })}
       {liquids.length > 0 ? (
-        <Box width="100%" border={`1px solid ${COLORS.grey20}`} />
+        <Divider color={COLORS.grey20} marginY="0" />
       ) : null}
       <MenuItem
         data-testid="defineLiquid"

diff --git a/protocol-designer/src/pages/Designer/Offdeck/Offdeck.tsx b/protocol-designer/src/pages/Designer/Offdeck/Offdeck.tsx
@@ -126,7 +126,7 @@ export function OffDeck(props: DeckSetupTabType): JSX.Element {
               justifyContent={JUSTIFY_CENTER}
               alignItems={ALIGN_CENTER}
               borderRadius={BORDERS.borderRadius8}
-              backgroundColor={COLORS.grey20}
+              backgroundColor={COLORS.white}
             >
               <Flex
                 padding={SPACING.spacing60}

diff --git a/protocol-designer/src/pages/Landing/__tests__/Landing.test.tsx b/protocol-designer/src/pages/Landing/__tests__/Landing.test.tsx
@@ -58,7 +58,7 @@ describe('Landing', () => {
     )
     fireEvent.click(screen.getByRole('button', { name: 'Create a protocol' }))
     expect(vi.mocked(toggleNewProtocolModal)).toHaveBeenCalled()
-    screen.getByText('Edit existing protocol')
+    screen.getByText('Import existing protocol')
     screen.getByRole('img', { name: 'welcome image' })
   })
 

diff --git a/protocol-designer/src/pages/Landing/index.tsx b/protocol-designer/src/pages/Landing/index.tsx
@@ -149,7 +149,7 @@ export function Landing(): JSX.Element {
         <StyledLabel>
           <Flex css={LINK_BUTTON_STYLE}>
             <StyledText desktopStyle="bodyLargeRegular">
-              {t('edit_existing')}
+              {t('import_existing_protocol')}
             </StyledText>
           </Flex>
           <input type="file" onChange={loadFile} />