fix(app): Update robot rename rule (#10318)

* Updated robot naming rule and test cases

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

@@ -85,11 +85,10 @@
   "use_older_aspirate": "Use older aspirate behavior",
   "use_older_aspirate_description": "Aspirate with the less accurate volumetric calibrations that were used before version 3.7.0. Use this if you need consistency with pre-v3.7.0 results. This only affects GEN1 P10S, P10M, P50M, and P300S pipettes.",
   "rename_robot_slideout_title": "Rename Robot",
-  "rename_robot_slideout_description": "Please enter 35 characters max using valid inputs: letters, numbers, spaces and these special characters: !?$*’-_.",
   "rename_robot_slideout_label": "Robot Name",
   "rename_robot_button": "Rename robot",
   "rename_robot_input_limitation_label": "35 characters max",
-  "rename_robot_input_error_message": "Please enter 35 characters max using valid inputs: letters, numbers, spaces and these special characters: !?$*’-_.",
+  "rename_robot_input_limitation_detail": "Please enter 35 characters max using valid inputs: letters and numbers",
   "factory_reset_slideout_title": "Factory Reset",
   "factory_reset_slideout_description": "Select the robot data to clear.",
   "factory_reset_slideout_warning_message": "Factory resets cannot be undone",

app/src/organisms/Devices/RobotSettings/AdvancedTab/AdvancedTabSlideouts/RenameRobotSlideout.tsx

@@ -30,10 +30,10 @@ interface FormikErrors {
 }
 
 /* max length is 35 and min length is 1
-   allow users to use alphabets, numbers, space, ', !, ?, $, _, .(dot), and -
-   not allow users to use space at the beginning of a new name
+   allow users to use alphabets(a-z & A-Z) and numbers
+   https://github.com/Opentrons/opentrons/issues/10214
 */
-const REGEX_RENAME_ROBOT_PATTERN = /^\S([a-zA-Z0-9\s-_.!$?*]{0,35})$/
+const REGEX_RENAME_ROBOT_PATTERN = /^([a-zA-Z0-9]{0,35})$/
 const regexPattern = new RegExp(REGEX_RENAME_ROBOT_PATTERN)
 
 export function RenameRobotSlideout({
@@ -62,7 +62,7 @@ export function RenameRobotSlideout({
       const errors: FormikErrors = {}
       const newName = values.newRobotName
       if (!regexPattern.test(newName)) {
-        errors.newRobotName = t('rename_robot_input_error_message')
+        errors.newRobotName = t('rename_robot_input_limitation_detail')
       }
       return errors
     },
@@ -100,7 +100,7 @@ export function RenameRobotSlideout({
     >
       <Flex flexDirection={DIRECTION_COLUMN}>
         <StyledText as="p" marginBottom={SPACING.spacing4}>
-          {t('rename_robot_slideout_description')}
+          {t('rename_robot_input_limitation_detail')}
         </StyledText>
         <StyledText
           as="label"

app/src/organisms/Devices/RobotSettings/AdvancedTab/AdvancedTabSlideouts/__tests__/RenameRobotSlideout.test.tsx

@@ -32,7 +32,7 @@ describe('RobotSettings RenameRobotSlideout', () => {
 
     getByText('Rename Robot')
     getByText(
-      'Please enter 35 characters max using valid inputs: letters, numbers, spaces and these special characters: !?$*’-_.'
+      'Please enter 35 characters max using valid inputs: letters and numbers'
     )
     getByText('Robot Name')
     getByText('35 characters max')
@@ -61,7 +61,7 @@ describe('RobotSettings RenameRobotSlideout', () => {
     expect(input).toHaveValue('mockInput@@@')
     const renameButton = getByRole('button', { name: 'Rename robot' })
     const error = await findByText(
-      'Please enter 35 characters max using valid inputs: letters, numbers, spaces and these special characters: !?$*’-_.'
+      'Please enter 35 characters max using valid inputs: letters and numbers'
     )
     await waitFor(() => {
       expect(renameButton).toBeDisabled()
@@ -73,12 +73,29 @@ describe('RobotSettings RenameRobotSlideout', () => {
     const [{ getByRole, findByText }] = render()
     const input = getByRole('textbox')
     fireEvent.change(input, {
-      target: { value: 'This is more than 35 characters This is a mock' },
+      target: { value: 'aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa' },
     })
-    expect(input).toHaveValue('This is more than 35 characters This is a mock')
+    expect(input).toHaveValue('aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa')
     const renameButton = getByRole('button', { name: 'Rename robot' })
     const error = await findByText(
-      'Please enter 35 characters max using valid inputs: letters, numbers, spaces and these special characters: !?$*’-_.'
+      'Please enter 35 characters max using valid inputs: letters and numbers'
+    )
+    await waitFor(() => {
+      expect(renameButton).toBeDisabled()
+      expect(error).toBeInTheDocument()
+    })
+  })
+
+  it('button should be disabled and render the error message when a user tries to use space', async () => {
+    const [{ getByRole, findByText }] = render()
+    const input = getByRole('textbox')
+    fireEvent.change(input, {
+      target: { value: 'Hello world123' },
+    })
+    expect(input).toHaveValue('Hello world123')
+    const renameButton = getByRole('button', { name: 'Rename robot' })
+    const error = await findByText(
+      'Please enter 35 characters max using valid inputs: letters and numbers'
     )
     await waitFor(() => {
       expect(renameButton).toBeDisabled()
@@ -95,14 +112,14 @@ describe('RobotSettings RenameRobotSlideout', () => {
     expect(input).toHaveValue(' ')
     const renameButton = getByRole('button', { name: 'Rename robot' })
     const error = await findByText(
-      'Please enter 35 characters max using valid inputs: letters, numbers, spaces and these special characters: !?$*’-_.'
+      'Please enter 35 characters max using valid inputs: letters and numbers'
     )
     await waitFor(() => {
       expect(renameButton).toBeDisabled()
       expect(error).toBeInTheDocument()
     })
   })
-  // TODO: The following test case will be tested in the future
+  // TODO: kj   The following test case will be tested in the future
   // it('should close the slideout when a user change the name successfully', () => {
   //   const [{ getByRole }, store] = render()
   //   expect(store.dispatch).toHaveBeenCalledWith(removeRobot('otie'))