diff --git a/.eslintrc.json b/.eslintrc.json
index ec8860dce..48d51245d 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -5,6 +5,7 @@
     "max-len": "off",
     // This is throwing error on App.tsx even with no code changes on CRA 5.
     "@typescript-eslint/no-empty-function": "off",
-    "cypress/unsafe-to-chain-command": "off"
+    "cypress/unsafe-to-chain-command": "off",
+    "linebreak-style": "off"
   }
 }
diff --git a/src/app/newSettings/Sections/Account/Account/components/AccountDetailsModal.tsx b/src/app/newSettings/Sections/Account/Account/components/AccountDetailsModal.tsx
index e563dfc8a..b4ab2beba 100644
--- a/src/app/newSettings/Sections/Account/Account/components/AccountDetailsModal.tsx
+++ b/src/app/newSettings/Sections/Account/Account/components/AccountDetailsModal.tsx
@@ -47,7 +47,8 @@ const AccountDetailsModal = ({
     return value.length > 0 && value.length < 20;
   };
 
-  const onSave = async () => {
+  const onSave = async (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
     if (!validate(nameValue)) {
       setStatus({ tag: 'error', type: 'NAME_INVALID' });
     } else if (!validate(lastnameValue)) {
@@ -66,55 +67,57 @@ const AccountDetailsModal = ({
 
   return (
     <Modal isOpen={isOpen} onClose={onClose}>
-      <div className="flex flex-col space-y-5">
-        <h1 className="text-2xl font-medium text-gray-80">
-          {translate('views.account.tabs.account.accountDetails.editProfile.title')}
-        </h1>
-        <div className="flex space-x-3">
-          <Input
-            disabled={status.tag === 'loading'}
-            label={translate('views.account.tabs.account.accountDetails.name')}
-            value={nameValue}
-            onChange={setNameValue}
-            accent={nameIsInvalid ? 'error' : undefined}
-            message={nameIsInvalid ? 'This name is invalid' : undefined}
-            name="firstName"
-          />
-          <Input
-            disabled={status.tag === 'loading'}
-            label={translate('views.account.tabs.account.accountDetails.lastname')}
-            value={lastnameValue}
-            onChange={setLastnameValue}
-            accent={lastnameIsInvalid ? 'error' : undefined}
-            message={lastnameIsInvalid ? 'This lastname is invalid' : undefined}
-            name="lastName"
-          />
-        </div>
+      <form onSubmit={onSave}>
+        <div className="flex flex-col space-y-5">
+          <h1 className="text-2xl font-medium text-gray-80">
+            {translate('views.account.tabs.account.accountDetails.editProfile.title')}
+          </h1>
+          <div className="flex space-x-3">
+            <Input
+              disabled={status.tag === 'loading'}
+              label={translate('views.account.tabs.account.accountDetails.name')}
+              value={nameValue}
+              onChange={setNameValue}
+              accent={nameIsInvalid ? 'error' : undefined}
+              message={nameIsInvalid ? 'This name is invalid' : undefined}
+              name="firstName"
+            />
+            <Input
+              disabled={status.tag === 'loading'}
+              label={translate('views.account.tabs.account.accountDetails.lastname')}
+              value={lastnameValue}
+              onChange={setLastnameValue}
+              accent={lastnameIsInvalid ? 'error' : undefined}
+              message={lastnameIsInvalid ? 'This lastname is invalid' : undefined}
+              name="lastName"
+            />
+          </div>
 
-        <div className="flex items-end space-x-3">
-          <Input
-            disabled
-            className="flex-1"
-            label={translate('views.account.tabs.account.accountDetails.card.email')}
-            value={emailValue}
-            name="email"
-          />
-          <div className="flex h-11 items-center">
-            <Button disabled={status.tag === 'loading'} variant="secondary" onClick={openEditEmail}>
-              {translate('actions.change')}
-            </Button>
+          <div className="flex items-end space-x-3">
+            <Input
+              disabled
+              className="flex-1"
+              label={translate('views.account.tabs.account.accountDetails.card.email')}
+              value={emailValue}
+              name="email"
+            />
+            <div className="flex h-11 items-center">
+              <Button disabled={status.tag === 'loading'} variant="secondary" onClick={openEditEmail}>
+                {translate('actions.change')}
+              </Button>
+            </div>
           </div>
-        </div>
 
-        <div className="flex justify-end">
-          <Button disabled={status.tag === 'loading'} variant="secondary" onClick={onClose}>
-            {translate('actions.cancel')}
-          </Button>
-          <Button loading={status.tag === 'loading'} className="ml-2" onClick={onSave}>
-            {status.tag === 'loading' ? translate('actions.saving') : translate('actions.save')}
-          </Button>
+          <div className="flex justify-end">
+            <Button disabled={status.tag === 'loading'} variant="secondary" onClick={onClose}>
+              {translate('actions.cancel')}
+            </Button>
+            <Button type="submit" loading={status.tag === 'loading'} className="ml-2">
+              {status.tag === 'loading' ? translate('actions.saving') : translate('actions.save')}
+            </Button>
+          </div>
         </div>
-      </div>
+      </form>
     </Modal>
   );
 };
diff --git a/src/app/newSettings/Sections/Account/Security/components/ChangePasswordModal.tsx b/src/app/newSettings/Sections/Account/Security/components/ChangePasswordModal.tsx
index fa877bdc6..5158c534c 100644
--- a/src/app/newSettings/Sections/Account/Security/components/ChangePasswordModal.tsx
+++ b/src/app/newSettings/Sections/Account/Security/components/ChangePasswordModal.tsx
@@ -34,7 +34,8 @@ const ChangePasswordModal = ({
 
   const isConfirmationWrong = passwordPayload.password.slice(0, passwordConfirmation.length) !== passwordConfirmation;
 
-  async function handleSubmit() {
+  async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
+    e.preventDefault();
     setIsLoading(true);
     await changePassword(passwordPayload.password, currentPassword, email);
     notificationsService.show({ text: translate('success.passwordChanged'), type: ToastType.Success });
@@ -53,41 +54,43 @@ const ChangePasswordModal = ({
 
   return (
     <Modal isOpen={isOpen} onClose={onClose}>
-      <h1 className="text-2xl font-medium text-gray-80">{translate('modals.changePasswordModal.title')}</h1>
-      <ValidPassword
-        username={email}
-        className="mt-4"
-        label={translate('modals.changePasswordModal.newPassword')}
-        value={passwordPayload.password}
-        onChange={setPasswordPayload}
-        disabled={isLoading}
-        dataTest="new-password"
-      />
-      <Input
-        value={passwordConfirmation}
-        onChange={setPasswordConfirmation}
-        variant="password"
-        className="mt-3"
-        label={translate('modals.changePasswordModal.confirmPassword')}
-        accent={isConfirmationWrong ? 'error' : undefined}
-        message={isConfirmationWrong ? translate('modals.changePasswordModal.errors.doesntMatch') : undefined}
-        disabled={isLoading}
-        dataTest="new-password-confirmation"
-      />
-      <div className="mt-3 flex justify-end">
-        <Button variant="secondary" disabled={isLoading} onClick={onClose}>
-          {translate('actions.cancel')}
-        </Button>
-        <Button
-          loading={isLoading}
-          onClick={handleSubmit}
-          disabled={!passwordPayload.valid || passwordConfirmation !== passwordPayload.password}
-          className="ml-2"
-          dataTest="next-button"
-        >
-          {translate('modals.changePasswordModal.title')}
-        </Button>
-      </div>
+      <form onSubmit={handleSubmit}>
+        <h1 className="text-2xl font-medium text-gray-80">{translate('modals.changePasswordModal.title')}</h1>
+        <ValidPassword
+          username={email}
+          className="mt-4"
+          label={translate('modals.changePasswordModal.newPassword')}
+          value={passwordPayload.password}
+          onChange={setPasswordPayload}
+          disabled={isLoading}
+          dataTest="new-password"
+        />
+        <Input
+          value={passwordConfirmation}
+          onChange={setPasswordConfirmation}
+          variant="password"
+          className="mt-3"
+          label={translate('modals.changePasswordModal.confirmPassword')}
+          accent={isConfirmationWrong ? 'error' : undefined}
+          message={isConfirmationWrong ? translate('modals.changePasswordModal.errors.doesntMatch') : undefined}
+          disabled={isLoading}
+          dataTest="new-password-confirmation"
+        />
+        <div className="mt-3 flex justify-end">
+          <Button variant="secondary" disabled={isLoading} onClick={onClose}>
+            {translate('actions.cancel')}
+          </Button>
+          <Button
+            loading={isLoading}
+            type="submit"
+            disabled={!passwordPayload.valid || passwordConfirmation !== passwordPayload.password}
+            className="ml-2"
+            dataTest="next-button"
+          >
+            {translate('modals.changePasswordModal.title')}
+          </Button>
+        </div>
+      </form>
     </Modal>
   );
 };
diff --git a/src/app/newSettings/Sections/Account/Security/components/TwoFactorAuthenticationDisableModal.tsx b/src/app/newSettings/Sections/Account/Security/components/TwoFactorAuthenticationDisableModal.tsx
index 7e3a7ce52..7b2a621e0 100644
--- a/src/app/newSettings/Sections/Account/Security/components/TwoFactorAuthenticationDisableModal.tsx
+++ b/src/app/newSettings/Sections/Account/Security/components/TwoFactorAuthenticationDisableModal.tsx
@@ -29,7 +29,8 @@ const TwoFactorAuthenticationDisableModal = ({
   const [status, setStatus] = useState<'ready' | 'error' | 'loading'>('ready');
   const [authCode, setAuthCode] = useState('');
 
-  async function handleDisable() {
+  async function handleDisable(e: React.FormEvent<HTMLFormElement>) {
+    e.preventDefault();
     setStatus('loading');
     try {
       const { encryptedSalt } = await userHas2FAStored();
@@ -48,28 +49,32 @@ const TwoFactorAuthenticationDisableModal = ({
 
   return (
     <Modal isOpen={isOpen} onClose={onClose}>
-      <h1 className="text-2xl font-medium text-gray-80">{translate('views.account.tabs.security.2FA.titleDisable')}</h1>
-      <Input
-        className="mt-4"
-        label={translate('views.account.tabs.security.2FA.modal.2FALabelCode') as string}
-        disabled={status === 'loading'}
-        accent={status === 'error' ? 'error' : undefined}
-        message={
-          status === 'error'
-            ? (translate('views.account.tabs.security.2FA.modal.errors.incorrect') as string)
-            : undefined
-        }
-        value={authCode}
-        onChange={setAuthCode}
-      />
-      <div className="mt-4 flex justify-end">
-        <Button onClick={onClose} variant="secondary" disabled={status === 'loading'}>
-          {translate('actions.cancel')}
-        </Button>
-        <Button className="ml-2" loading={status === 'loading'} onClick={handleDisable} disabled={authCode.length < 6}>
-          {translate('actions.disable')}
-        </Button>
-      </div>
+      <form onSubmit={handleDisable}>
+        <h1 className="text-2xl font-medium text-gray-80">
+          {translate('views.account.tabs.security.2FA.titleDisable')}
+        </h1>
+        <Input
+          className="mt-4"
+          label={translate('views.account.tabs.security.2FA.modal.2FALabelCode') as string}
+          disabled={status === 'loading'}
+          accent={status === 'error' ? 'error' : undefined}
+          message={
+            status === 'error'
+              ? (translate('views.account.tabs.security.2FA.modal.errors.incorrect') as string)
+              : undefined
+          }
+          value={authCode}
+          onChange={setAuthCode}
+        />
+        <div className="mt-4 flex justify-end">
+          <Button onClick={onClose} variant="secondary" disabled={status === 'loading'}>
+            {translate('actions.cancel')}
+          </Button>
+          <Button className="ml-2" type="submit" loading={status === 'loading'} disabled={authCode.length < 6}>
+            {translate('actions.disable')}
+          </Button>
+        </div>
+      </form>
     </Modal>
   );
 };
diff --git a/src/app/newSettings/Sections/Account/Security/components/TwoFactorAuthenticationEnableModal.tsx b/src/app/newSettings/Sections/Account/Security/components/TwoFactorAuthenticationEnableModal.tsx
index da711a013..dee8cb240 100644
--- a/src/app/newSettings/Sections/Account/Security/components/TwoFactorAuthenticationEnableModal.tsx
+++ b/src/app/newSettings/Sections/Account/Security/components/TwoFactorAuthenticationEnableModal.tsx
@@ -99,7 +99,8 @@ const TwoFactorAuthenticationEnableModal = ({
   const [activateState, setActivateState] = useState<'ready' | 'error' | 'loading'>('ready');
   const [activateValue, setActivateValue] = useState('');
 
-  async function handleActivate() {
+  async function handleActivate(e: React.FormEvent<HTMLFormElement>) {
+    e.preventDefault();
     if (qr) {
       try {
         setActivateState('loading');
@@ -134,37 +135,41 @@ const TwoFactorAuthenticationEnableModal = ({
 
   return (
     <Modal isOpen={isOpen} onClose={onClose}>
-      <h1 className="text-2xl font-medium text-gray-80">{translate('views.account.tabs.security.2FA.modal.title')}</h1>
-      <h2 className="mt-5 flex items-center">
-        <p className="mt-0.5 text-gray-50">
-          {translate('views.account.tabs.security.2FA.modal.stepsLabel', {
-            current: step + 1,
-            total: steps.length,
-          })}
-        </p>
-        <p className="ml-2 text-xl font-medium text-gray-80">{steps[step]}</p>
-      </h2>
-      {parts[step]}
-      <div className="flex justify-end">
-        <Button
-          variant="secondary"
-          onClick={step === 0 ? onClose : () => setStep(step - 1)}
-          disabled={activateState === 'loading'}
-        >
-          {step === 0 ? translate('actions.cancel') : translate('actions.back')}
-        </Button>
-        <div className="ml-2">
-          {step !== steps.length - 1 ? (
-            <Button onClick={() => setStep(step + 1)} disabled={qr === null && step === 1}>
-              {translate('actions.next')}
-            </Button>
-          ) : (
-            <Button onClick={handleActivate} disabled={activateValue.length < 6} loading={activateState === 'loading'}>
-              {translate('views.account.tabs.security.2FA.modal.button')}
-            </Button>
-          )}
+      <form onSubmit={handleActivate}>
+        <h1 className="text-2xl font-medium text-gray-80">
+          {translate('views.account.tabs.security.2FA.modal.title')}
+        </h1>
+        <h2 className="mt-5 flex items-center">
+          <p className="mt-0.5 text-gray-50">
+            {translate('views.account.tabs.security.2FA.modal.stepsLabel', {
+              current: step + 1,
+              total: steps.length,
+            })}
+          </p>
+          <p className="ml-2 text-xl font-medium text-gray-80">{steps[step]}</p>
+        </h2>
+        {parts[step]}
+        <div className="flex justify-end">
+          <Button
+            variant="secondary"
+            onClick={step === 0 ? onClose : () => setStep(step - 1)}
+            disabled={activateState === 'loading'}
+          >
+            {step === 0 ? translate('actions.cancel') : translate('actions.back')}
+          </Button>
+          <div className="ml-2">
+            {step !== steps.length - 1 ? (
+              <Button onClick={() => setStep(step + 1)} disabled={qr === null && step === 1}>
+                {translate('actions.next')}
+              </Button>
+            ) : (
+              <Button type="submit" disabled={activateValue.length < 6} loading={activateState === 'loading'}>
+                {translate('views.account.tabs.security.2FA.modal.button')}
+              </Button>
+            )}
+          </div>
         </div>
-      </div>
+      </form>
     </Modal>
   );
 };
diff --git a/src/app/share/components/SharePasswordInputDialog/SharePasswordInputDialog.tsx b/src/app/share/components/SharePasswordInputDialog/SharePasswordInputDialog.tsx
index 7d5c31de8..4afe23fa1 100644
--- a/src/app/share/components/SharePasswordInputDialog/SharePasswordInputDialog.tsx
+++ b/src/app/share/components/SharePasswordInputDialog/SharePasswordInputDialog.tsx
@@ -1,7 +1,6 @@
 import Button from 'app/shared/components/Button/Button';
 import Modal from 'app/shared/components/Modal';
 import { useState } from 'react';
-import { Spinner } from '@phosphor-icons/react';
 import Input from 'app/shared/components/Input';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
 import validationService from 'app/core/services/validation.service';
@@ -25,7 +24,8 @@ export const SharePasswordInputDialog = ({
   const [isLoading, setIsLoading] = useState<boolean>(false);
   const [password, setPassword] = useState('');
 
-  const handleConfirm = async () => {
+  const handleConfirm = async (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
     setIsLoading(true);
     await onSavePassword(password);
     setIsLoading(false);
@@ -33,29 +33,31 @@ export const SharePasswordInputDialog = ({
 
   return (
     <Modal maxWidth="max-w-sm" className="space-y-5 p-5" isOpen={isOpen} onClose={onClose}>
-      <p className="text-2xl font-medium">
-        {!isAlreadyProtected
-          ? translate('modals.shareModal.protectSharingModal.protect')
-          : translate('modals.shareModal.protectSharingModal.editPasswordTitle')}
-      </p>
-      <Input
-        onChange={(value) => {
-          if (value.length <= MAX_PASSWORD_LENGTH && validationService.validatePasswordInput(value)) {
-            setPassword(value);
-          }
-        }}
-        value={password}
-        variant="password"
-        autoComplete="off"
-      />
-      <div className="flex items-center justify-end space-x-2">
-        <Button variant="secondary" onClick={onClose}>
-          {translate('modals.shareModal.protectSharingModal.buttons.cancel')}
-        </Button>
-        <Button variant="primary" onClick={handleConfirm} loading={isLoading} disabled={!password}>
-          {translate('modals.shareModal.protectSharingModal.buttons.save')}
-        </Button>
-      </div>
+      <form onSubmit={handleConfirm}>
+        <p className="text-2xl font-medium">
+          {!isAlreadyProtected
+            ? translate('modals.shareModal.protectSharingModal.protect')
+            : translate('modals.shareModal.protectSharingModal.editPasswordTitle')}
+        </p>
+        <Input
+          onChange={(value) => {
+            if (value.length <= MAX_PASSWORD_LENGTH && validationService.validatePasswordInput(value)) {
+              setPassword(value);
+            }
+          }}
+          value={password}
+          variant="password"
+          autoComplete="off"
+        />
+        <div className="flex items-center justify-end space-x-2">
+          <Button variant="secondary" onClick={onClose}>
+            {translate('modals.shareModal.protectSharingModal.buttons.cancel')}
+          </Button>
+          <Button variant="primary" onClick={handleConfirm} loading={isLoading} disabled={!password}>
+            {translate('modals.shareModal.protectSharingModal.buttons.save')}
+          </Button>
+        </div>
+      </form>
     </Modal>
   );
 };