diff --git a/web/react/components/user_settings/user_settings_security.jsx b/web/react/components/user_settings/user_settings_security.jsx
index d9c5f58a92b6..d1266dd3f2a7 100644
--- a/web/react/components/user_settings/user_settings_security.jsx
+++ b/web/react/components/user_settings/user_settings_security.jsx
@@ -206,7 +206,7 @@ export default class SecurityTab extends React.Component {
                     <div>
                         <a
                             className='btn btn-primary'
-                            href={'/' + teamName + '/claim?email=' + user.email}
+                            href={'/' + teamName + '/claim?email=' + encodeURIComponent(user.email)}
                         >
                             {'Switch to using email and password'}
                         </a>
@@ -221,7 +221,7 @@ export default class SecurityTab extends React.Component {
                     <div>
                         <a
                             className='btn btn-primary'
-                            href={'/' + teamName + '/claim?email=' + user.email + '&new_type=' + Constants.GITLAB_SERVICE}
+                            href={'/' + teamName + '/claim?email=' + encodeURIComponent(user.email) + '&new_type=' + Constants.GITLAB_SERVICE}
                         >
                             {'Switch to using GitLab SSO'}
                         </a>
@@ -236,7 +236,7 @@ export default class SecurityTab extends React.Component {
                     <div>
                         <a
                             className='btn btn-primary'
-                            href={'/' + teamName + '/claim?email=' + user.email + '&new_type=' + Constants.GOOGLE_SERVICE}
+                            href={'/' + teamName + '/claim?email=' + encodeURIComponent(user.email) + '&new_type=' + Constants.GOOGLE_SERVICE}
                         >
                             {'Switch to using Google SSO'}
                         </a>