fix(protocol-designer): perserve uppercase letters of step name

fixes RQA-3398
Opentrons · Oct 23, 2024 · e36930a · e36930a
1 parent 1deeb88
commit e36930a
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 4 deletions.
diff --git a/protocol-designer/src/organisms/RenameStepModal/index.tsx b/protocol-designer/src/organisms/RenameStepModal/index.tsx
@@ -17,7 +17,7 @@ import {
   TYPOGRAPHY,
   InputField,
 } from '@opentrons/components'
-import { i18n } from '../../assets/localization'
+import { capitalizeFirstLetter } from '../../pages/Designer/ProtocolSteps/StepForm/utils'
 import { getTopPortalEl } from '../../components/portals/TopPortal'
 import { renameStep } from '../../labware-ingred/actions'
 import type { FormData } from '../../form-types'
@@ -31,7 +31,7 @@ export function RenameStepModal(props: RenameStepModalProps): JSX.Element {
   const { onClose, formData } = props
   const dispatch = useDispatch()
   const { t } = useTranslation(['form', 'shared', 'protocol_steps'])
-  const initialName = i18n.format(t(formData.stepName), 'capitalize')
+  const initialName = capitalizeFirstLetter(t(formData.stepName))
   const [stepName, setStepName] = useState<string>(initialName)
   const [stepDetails, setStepDetails] = useState<string>(
     String(formData.stepDetails)

diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/StepFormToolbox.tsx
@@ -36,7 +36,7 @@ import {
   TemperatureTools,
   ThermocyclerTools,
 } from './StepTools'
-import { getSaveStepSnackbarText } from './utils'
+import { capitalizeFirstLetter, getSaveStepSnackbarText } from './utils'
 import type { StepFieldName } from '../../../../steplist/fieldLevel'
 import type { FormData, StepType } from '../../../../form-types'
 import type { FieldPropsByName, FocusHandlers, StepFormProps } from './types'
@@ -210,7 +210,7 @@ export function StepFormToolbox(props: StepFormToolboxProps): JSX.Element {
           <Flex gridGap={SPACING.spacing8} alignItems={ALIGN_CENTER}>
             <Icon size="1rem" name={icon} />
             <StyledText desktopStyle="bodyLargeSemiBold">
-              {i18n.format(t(formData.stepName), 'capitalize')}
+              {capitalizeFirstLetter(t(formData.stepName))}
             </StyledText>
           </Flex>
         }

diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/utils.ts b/protocol-designer/src/pages/Designer/ProtocolSteps/StepForm/utils.ts
@@ -322,3 +322,6 @@ export const getSaveStepSnackbarText = (
     return t(`protocol_steps:save_no_errors`, { stepType: stepTypeDisplayName })
   }
 }
+
+export const capitalizeFirstLetter = (stepName: string): string =>
+  stepName.charAt(0).toUpperCase() + stepName.slice(1)