fix: Prevent scroll when focusing

client/src/components/BoardMembershipsStep/BoardMembershipsStep.jsx

@@ -43,7 +43,9 @@ const BoardMembershipsStep = React.memo(
     );
 
     useEffect(() => {
-      searchField.current.focus();
+      searchField.current.focus({
+        preventScroll: true,
+      });
     }, []);
 
     return (

client/src/components/Boards/AddPopup/AddPopup.jsx

@@ -63,7 +63,9 @@ const AddStep = React.memo(({ onCreate, onClose }) => {
   }, [openStep]);
 
   useEffect(() => {
-    nameField.current.focus();
+    nameField.current.focus({
+      preventScroll: true,
+    });
   }, []);
 
   useDidUpdate(() => {

client/src/components/LabelsStep/LabelsStep.jsx

@@ -89,7 +89,9 @@ const LabelsStep = React.memo(
     );
 
     useEffect(() => {
-      searchField.current.focus();
+      searchField.current.focus({
+        preventScroll: true,
+      });
     }, []);
 
     if (step) {

client/src/components/Memberships/AddPopup/AddPopup.jsx

@@ -61,7 +61,9 @@ const AddStep = React.memo(
     );
 
     useEffect(() => {
-      searchField.current.focus();
+      searchField.current.focus({
+        preventScroll: true,
+      });
     }, []);
 
     if (step) {

client/src/components/UserAddPopup/UserAddPopup.jsx

@@ -88,7 +88,9 @@ const UserAddStep = React.memo(
     }, [onCreate, data]);
 
     useEffect(() => {
-      emailField.current.focus();
+      emailField.current.focus({
+        preventScroll: true,
+      });
     }, []);
 
     useEffect(() => {

client/src/components/UserEmailEditStep/UserEmailEditStep.jsx

@@ -90,7 +90,9 @@ const UserEmailEditStep = React.memo(
     }, [email, usePasswordConfirmation, onUpdate, onClose, data]);
 
     useEffect(() => {
-      emailField.current.focus();
+      emailField.current.focus({
+        preventScroll: true,
+      });
     }, []);
 
     useEffect(() => {

client/src/components/UserPasswordEditStep/UserPasswordEditStep.jsx

@@ -71,7 +71,9 @@ const UserPasswordEditStep = React.memo(
     }, [usePasswordConfirmation, onUpdate, data]);
 
     useEffect(() => {
-      passwordField.current.focus();
+      passwordField.current.focus({
+        preventScroll: true,
+      });
     }, []);
 
     useEffect(() => {

client/src/components/UserUsernameEditStep/UserUsernameEditStep.jsx

@@ -90,7 +90,9 @@ const UserUsernameEditStep = React.memo(
     }, [username, usePasswordConfirmation, onUpdate, onClose, data]);
 
     useEffect(() => {
-      usernameField.current.focus();
+      usernameField.current.focus({
+        preventScroll: true,
+      });
     }, []);
 
     useEffect(() => {

client/src/lib/custom-ui/components/Input/Input.jsx

@@ -3,9 +3,10 @@ import { Input as SemanticUIInput } from 'semantic-ui-react';
 import InputPassword from './InputPassword';
 import InputMask from './InputMask';
 
-const Input = SemanticUIInput;
+export default class Input extends SemanticUIInput {
+  static Password = InputPassword;
 
-Input.Password = InputPassword;
+  static Mask = InputMask;
-Input.Mask = InputMask;
 
-export default Input;
+  focus = (options) => this.inputRef.current.focus(options);
+}

client/src/lib/custom-ui/components/Input/MaskedInput.jsx

@@ -1,8 +1,8 @@
 import InputMask from 'react-input-mask';
 
 export default class MaskedInput extends InputMask {
-  focus() {
+  focus(options) {
-    this.getInputDOMNode().focus();
+    this.getInputDOMNode().focus(options);
   }
 
   select() {