fix(protocol-designer): update Heater-shaker to Heater-Shaker (#16966)

* fix(protocol-designer): update Heater-shaker to Heater-Shaker

Author: koji

protocol-designer/src/assets/localization/en/protocol_steps.json

@@ -44,7 +44,7 @@
       "open": "open"
     }
   },
-  "heater_shaker_settings": "Heater-shaker settings",
+  "heater_shaker_settings": "Heater-Shaker Settings",
   "in": "in",
   "into": "into",
   "magnetic_module": {

protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepTools/HeaterShakerTools/index.tsx

@@ -41,7 +41,7 @@ export function HeaterShakerTools(props: StepFormProps): JSX.Element {
         gridGap={SPACING.spacing4}
         paddingX={SPACING.spacing16}
       >
-        <StyledText desktopStyle="bodyDefaultRegular" color={COLORS.grey60}>
+        <StyledText desktopStyle="bodyDefaultSemiBold">
           {t('protocol_steps:heater_shaker_settings')}
         </StyledText>
         <ToggleExpandStepFormField

protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/__tests__/utils.test.ts

@@ -84,6 +84,11 @@ describe('capitalizeFirstLetter', () => {
       'Move labware to D3 on top of Magnetic Block'
     )
   })
+
+  it('should capitalize the first letter of a step name and leave the rest unchanged', () => {
+    const moduleName = 'Heater-shaker'
+    expect(capitalizeFirstLetter(moduleName)).toBe('Heater-Shaker')
+  })
 })
 
 describe('getFormErrorsMappedToField', () => {

protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/utils.ts

@@ -337,8 +337,17 @@ export const getSaveStepSnackbarText = (
   }
 }
 
-export const capitalizeFirstLetter = (stepName: string): string =>
-  `${stepName.charAt(0).toUpperCase()}${stepName.slice(1)}`
+export const capitalizeFirstLetter = (stepName: string): string => {
+  // Note - check is for heater-shaker
+  if (stepName.includes('-')) {
+    return stepName
+      .split('-')
+      .map(word => word.charAt(0).toUpperCase() + word.slice(1))
+      .join('-')
+  } else {
+    return `${stepName.charAt(0).toUpperCase()}${stepName.slice(1)}`
+  }
+}
 
 type ErrorMappedToField = Record<string, FormError>
 

protocol-designer/src/pages/Designer/ProtocolSteps/Timeline/__tests__/utils.test.tsx

@@ -4,7 +4,7 @@ import { capitalizeFirstLetterAfterNumber } from '../utils'
 describe('capitalizeFirstLetterAfterNumber', () => {
   it('should capitalize the first letter of a step type', () => {
     expect(capitalizeFirstLetterAfterNumber('1. heater-shaker')).toBe(
-      '1. Heater-shaker'
+      '1. Heater-Shaker'
     )
     expect(capitalizeFirstLetterAfterNumber('22. thermocycler')).toBe(
       '22. Thermocycler'

protocol-designer/src/pages/Designer/ProtocolSteps/Timeline/utils.ts

@@ -5,8 +5,14 @@ import type { StepIdType } from '../../../../form-types'
 
 export const capitalizeFirstLetterAfterNumber = (title: string): string =>
   title.replace(
-    /(^[\d\W]*)([a-zA-Z])/,
-    (match, prefix, firstLetter) => `${prefix}${firstLetter.toUpperCase()}`
+    /(^[\d\W]*)([a-zA-Z])|(-[a-zA-Z])/g,
+    (match, prefix, firstLetter) => {
+      if (prefix) {
+        return `${prefix}${firstLetter.toUpperCase()}`
+      } else {
+        return `${match.charAt(0)}${match.charAt(1).toUpperCase()}`
+      }
+    }
   )
 
 const VOLUME_SIG_DIGITS_DEFAULT = 2