Client: Dialogs: ChangeNameDialog: add hotkeys

packages/client/src/components/dialogs/ChangeNameDialog/index.js

@@ -34,6 +34,10 @@ const ChangeNameDialog = (props) => {
     }
   };
 
+  const onKeyDown = (e) => {
+    if (e.keyCode === 13 || e.which === 13) onSaveClick();
+  };
+
   const onSaveClick = async () => {
     const newProfile = profile;
     newProfile.firstName = firstName;
@@ -76,6 +80,8 @@ const ChangeNameDialog = (props) => {
             onChange={(e) => setFirstName(e.target.value)}
             placeholder={t("Common:FirstName")}
             isDisabled={isSaving}
+            onKeyDown={onKeyDown}
+            tabIndex={1}
           />
         </FieldContainer>
 
@@ -90,6 +96,8 @@ const ChangeNameDialog = (props) => {
             onChange={(e) => setLastName(e.target.value)}
             placeholder={t("Common:LastName")}
             isDisabled={isSaving}
+            onKeyDown={onKeyDown}
+            tabIndex={2}
           />
         </FieldContainer>
       </ModalDialog.Body>
@@ -102,6 +110,7 @@ const ChangeNameDialog = (props) => {
           primary={true}
           onClick={onSaveClick}
           isLoading={isSaving}
+          tabIndex={3}
         />
         <Button
           key="CloseBtn"
@@ -110,6 +119,7 @@ const ChangeNameDialog = (props) => {
           scale
           onClick={onClose}
           isDisabled={isSaving}
+          tabIndex={4}
         />
       </ModalDialog.Footer>
     </ModalDialogContainer>