Add protection against insecure passwords

Automattic · May 15, 2020 · 4e6a8de · 4e6a8de
1 parent 6aaefd3
commit 4e6a8de
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 0 deletions.
diff --git a/lib/auth/index.tsx b/lib/auth/index.tsx
@@ -11,6 +11,7 @@ import { viewExternalUrl } from '../utils/url-utils';
 
 type OwnProps = {
   authPending: boolean;
+  hasInsecurePassword: boolean;
   hasInvalidCredentials: boolean;
   hasLoginError: boolean;
   login: (username: string, password: string) => any;
@@ -76,6 +77,25 @@ export class Auth extends Component<Props> {
           {!this.state.onLine && (
             <p className="login__auth-message is-error">Offline</p>
           )}
+          {this.props.hasInsecurePassword && (
+            <p
+              className="login__auth-message is-error"
+              data-error-name="invalid-login"
+            >
+              Your password is insecure and must be
+              <a
+                className="login__reset"
+                href="https://app.simplenote.com/reset/"
+                target="_blank"
+                rel="noopener noreferrer"
+                onClick={this.onForgot}
+              >
+                reset
+              </a>
+              . The password requirements are: Password cannot match email,
+              Between 8 and 64 characters, No new lines, and No tabs
+            </p>
+          )}
           {this.props.hasInvalidCredentials && (
             <p
               className="login__auth-message is-error"

diff --git a/lib/boot-without-auth.tsx b/lib/boot-without-auth.tsx
@@ -3,6 +3,7 @@ import { render } from 'react-dom';
 import { Auth as AuthApp } from './auth';
 import { Auth as SimperiumAuth } from 'simperium';
 import analytics from './analytics';
+import { validatePassword } from '../utils/validate-password';
 
 import getConfig from '../get-config';
 
@@ -16,6 +17,7 @@ type State = {
   authStatus:
     | 'unsubmitted'
     | 'submitting'
+    | 'insecure-password'
     | 'invalid-credentials'
     | 'unknown-error';
 };
@@ -42,6 +44,9 @@ class AppWithoutAuth extends Component<Props, State> {
       auth
         .authorize(username, password)
         .then((user: User) => {
+          if (!validatePassword(password, username)) {
+            this.setState({ authStatus: 'insecure-password' });
+          }
           if (!user.access_token) {
             throw new Error('missing access token');
           }
@@ -96,6 +101,7 @@ class AppWithoutAuth extends Component<Props, State> {
       <div className={`app theme-${systemTheme}`}>
         <AuthApp
           authPending={this.state.authStatus === 'submitting'}
+          hasInsecurePassword={this.state.authStatus === 'insecure-password'}
           hasInvalidCredentials={
             this.state.authStatus === 'invalid-credentials'
           }