feat(app): remove text size from ODD settings

app/src/assets/localization/en/device_settings.json

@@ -208,7 +208,6 @@
   "show_password": "Show Password",
   "show": "Show",
   "sign_into_wifi": "Sign into Wi-Fi",
-  "sleep_settings_description": "Turn the display to sleep after:",
   "software_is_up_to_date": "Your software is already up to date!",
   "software_update_error": "Software update error",
   "some_robot_controls_are_not_available": "Some robot controls are not available when run is in progress",

app/src/organisms/OnDeviceDisplay/RobotSettingsDashboard/DeviceReset.tsx

@@ -100,13 +100,13 @@ export function DeviceReset({
   }, [dispatch, robotName])
 
   return (
-    <Flex flexDirection={DIRECTION_COLUMN}>
+    <Flex flexDirection={DIRECTION_COLUMN} paddingY={SPACING.spacing32}>
       <Flex alignItems={ALIGN_CENTER} justifyContent={JUSTIFY_SPACE_BETWEEN}>
         <Flex flexDirection={DIRECTION_ROW}>
           <Btn onClick={() => setCurrentOption(null)}>
-            <Icon name="chevron-left" size="2.5rem" />
+            <Icon name="back" size="3rem" />
           </Btn>
-          <StyledText fontSize="2rem" lineHeight="2.75rem" fontWeight="700">
+          <StyledText as="h2" fontWeight={TYPOGRAPHY.fontWeightBold}>
             {t('device_reset')}
           </StyledText>
         </Flex>

app/src/organisms/OnDeviceDisplay/RobotSettingsDashboard/NetworkSettings/index.tsx

@@ -139,7 +139,7 @@ export function NetworkSettings({
           alignItems={ALIGN_START}
         >
           <Btn onClick={handleNavigate}>
-            <Icon name="back" size="3rem" />
+            <Icon name="back" size="3rem" color={COLORS.darkBlack100} />
           </Btn>
           <StyledText as="h2" fontWeight={TYPOGRAPHY.fontWeightBold}>
             {t(screenTitle)}

app/src/organisms/OnDeviceDisplay/RobotSettingsDashboard/RobotSystemVersion.tsx

@@ -57,12 +57,12 @@ export function RobotSystemVersion({
           setShowModal={setShowModal}
         />
       )}
-      <Flex flexDirection={DIRECTION_COLUMN}>
+      <Flex flexDirection={DIRECTION_COLUMN} paddingY={SPACING.spacing32}>
         <Flex justifyContent={JUSTIFY_FLEX_START} alignItems={ALIGN_CENTER}>
           <Btn onClick={() => setCurrentOption(null)}>
-            <Icon name="chevron-left" size="2.5rem" />
+            <Icon name="back" size="3rem" color={COLORS.darkBlack100} />
           </Btn>
-          <StyledText fontSize="2rem" textAlign="center">
+          <StyledText as="h2" fontWeight={TYPOGRAPHY.fontWeightBold}>
             {t('robot_system_version')}
           </StyledText>
         </Flex>

app/src/organisms/OnDeviceDisplay/RobotSettingsDashboard/TouchScreenSleep.tsx

@@ -3,11 +3,13 @@ import { useDispatch, useSelector } from 'react-redux'
 import { useTranslation } from 'react-i18next'
 
 import {
-  Flex,
+  ALIGN_CENTER,
   Btn,
+  COLORS,
   DIRECTION_COLUMN,
+  DIRECTION_ROW,
+  Flex,
   Icon,
-  ALIGN_CENTER,
   SPACING,
 } from '@opentrons/components'
 
@@ -57,22 +59,23 @@ export function TouchScreenSleep({
   }
 
   return (
-    <Flex flexDirection={DIRECTION_COLUMN}>
-      <Flex alignItems={ALIGN_CENTER}>
+    <Flex
+      flexDirection={DIRECTION_COLUMN}
+      paddingY={SPACING.spacing32}
+      gridGap={SPACING.spacing32}
+    >
+      <Flex alignItems={ALIGN_CENTER} flexDirection={DIRECTION_ROW}>
         <Btn onClick={() => setCurrentOption(null)}>
-          <Icon name="chevron-left" size="2.5rem" />
+          <Icon name="back" size="3rem" color={COLORS.darkBlack100} />
         </Btn>
         <StyledText fontSize="2rem" lineHeight="2.75rem" fontWeight="700">
           {t('touchscreen_sleep')}
         </StyledText>
       </Flex>
-      <Flex marginTop={SPACING.spacing40}>
-        <StyledText>{t('sleep_settings_description')}</StyledText>
-      </Flex>
       <Flex
         flexDirection={DIRECTION_COLUMN}
         gridGap={SPACING.spacing8}
-        marginTop={SPACING.spacing24}
+        // marginTop={SPACING.spacing24}
       >
         {settingsButtons.map(radio => (
           <RadioButton

app/src/organisms/OnDeviceDisplay/RobotSettingsDashboard/TouchscreenBrightness.tsx

@@ -5,18 +5,19 @@ import styled, { css } from 'styled-components'
 import clamp from 'lodash/clamp'
 
 import {
-  Flex,
+  ALIGN_CENTER,
+  BORDERS,
+  Box,
   Btn,
+  COLORS,
   DIRECTION_COLUMN,
-  JUSTIFY_FLEX_START,
-  ALIGN_CENTER,
-  Icon,
   DIRECTION_ROW,
-  Box,
+  Flex,
+  Icon,
   JUSTIFY_CENTER,
-  BORDERS,
+  JUSTIFY_FLEX_START,
   SPACING,
-  COLORS,
+  TYPOGRAPHY,
 } from '@opentrons/components'
 
 import { StyledText } from '../../../atoms/text'
@@ -84,15 +85,15 @@ export function TouchscreenBrightness({
   }
 
   return (
-    <Flex flexDirection={DIRECTION_COLUMN}>
+    <Flex flexDirection={DIRECTION_COLUMN} paddingY={SPACING.spacing32}>
       <Flex justifyContent={JUSTIFY_FLEX_START} alignItems={ALIGN_CENTER}>
         <Btn
           onClick={() => setCurrentOption(null)}
           data-testid="TouchscreenBrightness_back_button"
         >
-          <Icon name="chevron-left" size="2.5rem" />
+          <Icon name="back" size="3rem" color={COLORS.darkBlack100} />
         </Btn>
-        <StyledText fontSize="2rem" textAlign="center">
+        <StyledText as="h2" fontWeight={TYPOGRAPHY.fontWeightBold}>
           {t('touchscreen_brightness')}
         </StyledText>
       </Flex>

app/src/organisms/OnDeviceDisplay/RobotSettingsDashboard/UpdateChannel.tsx

@@ -66,15 +66,15 @@ export function UpdateChannel({
   }
 
   return (
-    <Flex flexDirection={DIRECTION_COLUMN}>
+    <Flex flexDirection={DIRECTION_COLUMN} paddingY={SPACING.spacing32}>
       <Flex alignItems={ALIGN_CENTER}>
         <Btn
           onClick={() => setCurrentOption(null)}
           data-testid="UpdateChannel_back_button"
         >
-          <Icon name="chevron-left" size="2.5rem" />
+          <Icon name="back" size="3rem" />
         </Btn>
-        <StyledText fontSize="2rem" lineHeight="2.75rem" fontWeight="700">
+        <StyledText as="h2" fontWeight={TYPOGRAPHY.fontWeightBold}>
           {t('app_settings:update_channel')}
         </StyledText>
       </Flex>

app/src/organisms/OnDeviceDisplay/RobotSettingsDashboard/__tests__/TextSize.test.tsx

@@ -24,8 +24,7 @@ describe('TextSize', () => {
   })
 
   it('should render text and buttons', () => {
-    const [{ getByText, getByTestId }] = render(props)
-    getByText('Text Size')
+    const [{ getByTestId }] = render(props)
     getByTestId('DisplayTextSize_back_button')
     getByTestId('DisplayTextSize_decrease')
     getByTestId('DisplayTextSize_increase')

app/src/pages/OnDeviceDisplay/RobotSettingsDashboard/__tests__/RobotSettingsDashboard.test.tsx

@@ -15,7 +15,6 @@ import {
   TouchscreenBrightness,
   NetworkSettings,
   RobotSystemVersion,
-  TextSize,
   UpdateChannel,
 } from '../../../../organisms/OnDeviceDisplay/RobotSettingsDashboard'
 import { getBuildrootUpdateAvailable } from '../../../../redux/buildroot'
@@ -40,9 +39,6 @@ jest.mock(
 jest.mock(
   '../../../../organisms/OnDeviceDisplay/RobotSettingsDashboard/RobotSystemVersion'
 )
-jest.mock(
-  '../../../../organisms/OnDeviceDisplay/RobotSettingsDashboard/TextSize'
-)
 jest.mock(
   '../../../../organisms/OnDeviceDisplay/RobotSettingsDashboard/TouchscreenBrightness'
 )
@@ -70,7 +66,6 @@ const mockDeviceReset = DeviceReset as jest.MockedFunction<typeof DeviceReset>
 const mockRobotSystemVersion = RobotSystemVersion as jest.MockedFunction<
   typeof RobotSystemVersion
 >
-const mockTextSize = TextSize as jest.MockedFunction<typeof TextSize>
 const mockTouchscreenBrightness = TouchscreenBrightness as jest.MockedFunction<
   typeof TouchscreenBrightness
 >
@@ -102,7 +97,6 @@ describe('RobotSettingsDashboard', () => {
     mockNetworkSettings.mockReturnValue(<div>Mock Network Settings</div>)
     mockDeviceReset.mockReturnValue(<div>Mock Device Reset</div>)
     mockRobotSystemVersion.mockReturnValue(<div>Mock Robot System Version</div>)
-    mockTextSize.mockReturnValue(<div>Mock Text Size</div>)
     mockTouchscreenBrightness.mockReturnValue(
       <div>Mock Touchscreen Brightness</div>
     )
@@ -130,7 +124,6 @@ describe('RobotSettingsDashboard', () => {
     )
     getByText('Touchscreen Sleep')
     getByText('Touchscreen Brightness')
-    getByText('Text Size')
     getByText('Device Reset')
     getByText('Update Channel')
     getByText('Enable Developer Tools')
@@ -190,13 +183,6 @@ describe('RobotSettingsDashboard', () => {
     getByText('Mock Touchscreen Brightness')
   })
 
-  it('should render component when tapping text size', () => {
-    const [{ getByText }] = render()
-    const button = getByText('Text Size')
-    fireEvent.click(button)
-    getByText('Mock Text Size')
-  })
-
   it('should render component when tapping device rest', () => {
     const [{ getByText }] = render()
     const button = getByText('Device Reset')

app/src/pages/OnDeviceDisplay/RobotSettingsDashboard/index.tsx

@@ -117,12 +117,6 @@ export function RobotSettingsDashboard(): JSX.Element {
             setCurrentOption={setCurrentOption}
             iconName="brightness"
           />
-          <RobotSettingButton
-            settingName={t('text_size')}
-            currentOption="TextSize"
-            setCurrentOption={setCurrentOption}
-            iconName="text-size"
-          />
           <RobotSettingButton
             settingName={t('device_reset')}
             currentOption="DeviceReset"

app/src/pages/OnDeviceDisplay/__tests__/ProtocolSetup.test.tsx

@@ -25,10 +25,10 @@ import { useMostRecentCompletedAnalysis } from '../../../organisms/LabwarePositi
 import { ProtocolSetupLiquids } from '../../../organisms/ProtocolSetupLiquids'
 import { getProtocolModulesInfo } from '../../../organisms/Devices/ProtocolRun/utils/getProtocolModulesInfo'
 import { ProtocolSetupModules } from '../../../organisms/ProtocolSetupModules'
-import { Snackbar } from '../../../atoms/Snackbar'
 import { getUnmatchedModulesForProtocol } from '../../../organisms/ProtocolSetupModules/utils'
 import { useLaunchLPC } from '../../../organisms/LabwarePositionCheck/useLaunchLPC'
 import { ConfirmCancelRunModal } from '../../../organisms/OnDeviceDisplay/RunningProtocol'
+import { mockProtocolModuleInfo } from '../../../organisms/ProtocolSetupInstruments/__fixtures__'
 import {
   useRunControls,
   useRunStatus,
@@ -50,7 +50,6 @@ jest.mock('../../../organisms/ProtocolSetupModules/utils')
 jest.mock('../../../organisms/OnDeviceDisplay/RunningProtocol')
 jest.mock('../../../organisms/RunTimeControl/hooks')
 jest.mock('../../../organisms/ProtocolSetupLiquids')
-jest.mock('../../../atoms/Snackbar')
 
 const mockGetDeckDefFromRobotType = getDeckDefFromRobotType as jest.MockedFunction<
   typeof getDeckDefFromRobotType
@@ -101,7 +100,6 @@ const mockUseLaunchLPC = useLaunchLPC as jest.MockedFunction<
 const mockUseLPCDisabledReason = useLPCDisabledReason as jest.MockedFunction<
   typeof useLPCDisabledReason
 >
-const mockSnackbar = Snackbar as jest.MockedFunction<typeof Snackbar>
 
 const render = (path = '/') => {
   return renderWithProviders(
@@ -152,7 +150,6 @@ describe('ProtocolSetup', () => {
   beforeEach(() => {
     mockLaunchLPC = jest.fn()
     mockUseLPCDisabledReason.mockReturnValue(null)
-    mockSnackbar.mockReturnValue(<div>Mock Snackbar</div>)
     mockUseAttachedModules.mockReturnValue([])
     mockProtocolSetupModules.mockReturnValue(
       <div>Mock ProtocolSetupModules</div>
@@ -254,7 +251,10 @@ describe('ProtocolSetup', () => {
       .mockReturnValue(mockRobotSideAnalysis)
     when(mockGetProtocolModulesInfo)
       .calledWith(mockRobotSideAnalysis, ot3StandardDeckDef as any)
-      .mockReturnValue([])
+      .mockReturnValue(mockProtocolModuleInfo)
+    when(mockGetUnmatchedModulesForProtocol)
+      .calledWith([], mockProtocolModuleInfo)
+      .mockReturnValue({ missingModuleIds: [], remainingAttachedModules: [] })
     const [{ getByText, queryByText }] = render(`/runs/${RUN_ID}/setup/`)
     expect(queryByText('Mock ProtocolSetupModules')).toBeNull()
     queryByText('Modules')?.click()
@@ -277,13 +277,4 @@ describe('ProtocolSetup', () => {
     expect(mockLaunchLPC).toHaveBeenCalled()
     getByText('mock LPC Wizard')
   })
-
-  it('should launch a snackbar when user tries to launch LPC when setup is incomplete', () => {
-    mockUseLPCDisabledReason.mockReturnValue('mock disabled reason')
-    const [{ getByText }] = render(`/runs/${RUN_ID}/setup/`)
-    getByText('Currently unavailable')
-    getByText('Labware Position Check').click()
-    expect(mockLaunchLPC).not.toHaveBeenCalled()
-    getByText('Mock Snackbar')
-  })
 })