From 4733b79d75ba39aa69156c13de964bfcaef4aa3a Mon Sep 17 00:00:00 2001
From: SleepWalker <mybox@udf.su>
Date: Sat, 14 May 2016 15:38:00 +0300
Subject: [PATCH] #26: incapsulate auth flow rejection logic into a separate
 component

---
 src/components/auth/BaseAuthBody.jsx          |  1 -
 src/components/auth/RejectionLink.jsx         | 25 +++++++++++++++++++
 src/components/auth/activation/Activation.jsx |  9 ++-----
 .../auth/changePassword/ChangePassword.jsx    | 23 +++--------------
 .../auth/forgotPassword/ForgotPassword.jsx    |  9 ++-----
 src/components/auth/password/Password.jsx     | 10 ++------
 .../auth/permissions/Permissions.jsx          | 23 +++--------------
 src/components/auth/register/Register.jsx     |  9 ++-----
 src/routes.js                                 | 19 +++++++-------
 src/services/authFlow/LoginState.js           |  5 ----
 tests/services/authFlow/LoginState.test.js    |  8 ------
 11 files changed, 50 insertions(+), 91 deletions(-)
 create mode 100644 src/components/auth/RejectionLink.jsx

diff --git a/src/components/auth/BaseAuthBody.jsx b/src/components/auth/BaseAuthBody.jsx
index 8184376..0548188 100644
--- a/src/components/auth/BaseAuthBody.jsx
+++ b/src/components/auth/BaseAuthBody.jsx
@@ -11,7 +11,6 @@ export default class BaseAuthBody extends Component {
     static contextTypes = {
         clearErrors: PropTypes.func.isRequired,
         resolve: PropTypes.func.isRequired,
-        reject: PropTypes.func.isRequired,
         auth: PropTypes.shape({
             error: PropTypes.string,
             scopes: PropTypes.array
diff --git a/src/components/auth/RejectionLink.jsx b/src/components/auth/RejectionLink.jsx
new file mode 100644
index 0000000..6af51f8
--- /dev/null
+++ b/src/components/auth/RejectionLink.jsx
@@ -0,0 +1,25 @@
+import React, { PropTypes } from 'react';
+
+import { FormattedMessage as Message } from 'react-intl';
+
+export default function RejectionLink(props, context) {
+    return (
+        <a href="#" onClick={(event) => {
+            event.preventDefault();
+
+            context.reject();
+        }}>
+            <Message {...props.label} />
+        </a>
+    );
+}
+
+RejectionLink.displayName = 'RejectionLink';
+RejectionLink.propTypes = {
+    label: PropTypes.shape({
+        id: PropTypes.string
+    }).isRequired
+};
+RejectionLink.contextTypes = {
+    reject: PropTypes.func.isRequired
+};
diff --git a/src/components/auth/activation/Activation.jsx b/src/components/auth/activation/Activation.jsx
index 13f359b..3ef3158 100644
--- a/src/components/auth/activation/Activation.jsx
+++ b/src/components/auth/activation/Activation.jsx
@@ -1,8 +1,7 @@
 import React from 'react';
 
-import { FormattedMessage as Message } from 'react-intl';
-
 import { Button } from 'components/ui/form';
+import RejectionLink from 'components/auth/RejectionLink';
 import AuthTitle from 'components/auth/AuthTitle';
 
 import messages from './Activation.intl.json';
@@ -13,10 +12,6 @@ export default function Activation() {
         Title: () => <AuthTitle title={messages.accountActivationTitle} />,
         Body,
         Footer: () => <Button color="blue" label={messages.confirmEmail} />,
-        Links: () => (
-            <a href="#">
-                <Message {...messages.didNotReceivedEmail} />
-            </a>
-        )
+        Links: () => <RejectionLink label={messages.didNotReceivedEmail} />
     };
 }
diff --git a/src/components/auth/changePassword/ChangePassword.jsx b/src/components/auth/changePassword/ChangePassword.jsx
index e2c5cb1..752fcb5 100644
--- a/src/components/auth/changePassword/ChangePassword.jsx
+++ b/src/components/auth/changePassword/ChangePassword.jsx
@@ -1,32 +1,17 @@
-import React, { PropTypes } from 'react';
-
-import { FormattedMessage as Message } from 'react-intl';
+import React from 'react';
 
 import { Button } from 'components/ui/form';
+import RejectionLink from 'components/auth/RejectionLink';
 import AuthTitle from 'components/auth/AuthTitle';
 
 import Body from './ChangePasswordBody';
 import messages from './ChangePassword.intl.json';
 
 export default function ChangePassword() {
-    const componentsMap = {
+    return {
         Title: () => <AuthTitle title={messages.changePasswordTitle} />,
         Body,
         Footer: () => <Button color="darkBlue" label={messages.change} />,
-        Links: (props, context) => (
-            <a href="#" onClick={(event) => {
-                event.preventDefault();
-
-                context.reject();
-            }}>
-                <Message {...messages.skipThisStep} />
-            </a>
-        )
+        Links: () => <RejectionLink label={messages.skipThisStep} />
     };
-
-    componentsMap.Links.contextTypes = {
-        reject: PropTypes.func.isRequired
-    };
-
-    return componentsMap;
 }
diff --git a/src/components/auth/forgotPassword/ForgotPassword.jsx b/src/components/auth/forgotPassword/ForgotPassword.jsx
index 1cc08cf..0d3c215 100644
--- a/src/components/auth/forgotPassword/ForgotPassword.jsx
+++ b/src/components/auth/forgotPassword/ForgotPassword.jsx
@@ -1,8 +1,7 @@
 import React from 'react';
 
-import { FormattedMessage as Message } from 'react-intl';
-
 import { Button } from 'components/ui/form';
+import RejectionLink from 'components/auth/RejectionLink';
 import AuthTitle from 'components/auth/AuthTitle';
 
 import messages from './ForgotPassword.intl.json';
@@ -13,10 +12,6 @@ export default function ForgotPassword() {
         Title: () => <AuthTitle title={messages.forgotPasswordTitle} />,
         Body,
         Footer: () => <Button color="lightViolet" label={messages.sendMail} />,
-        Links: () => (
-            <a href="/send-message">
-                <Message {...messages.contactSupport} />
-            </a>
-        )
+        Links: () => <RejectionLink label={messages.contactSupport} />
     };
 }
diff --git a/src/components/auth/password/Password.jsx b/src/components/auth/password/Password.jsx
index 8cc46c8..4f60c7b 100644
--- a/src/components/auth/password/Password.jsx
+++ b/src/components/auth/password/Password.jsx
@@ -1,9 +1,7 @@
 import React from 'react';
 
-import { FormattedMessage as Message } from 'react-intl';
-import { Link } from 'react-router';
-
 import { Button } from 'components/ui/form';
+import RejectionLink from 'components/auth/RejectionLink';
 import AuthTitle from 'components/auth/AuthTitle';
 
 import Body from './PasswordBody';
@@ -14,10 +12,6 @@ export default function Password() {
         Title: () => <AuthTitle title={messages.passwordTitle} />,
         Body,
         Footer: () => <Button color="green" label={messages.signInButton} />,
-        Links: () => (
-            <Link to="/forgot-password">
-                <Message {...messages.forgotPassword} />
-            </Link>
-        )
+        Links: () => <RejectionLink label={messages.forgotPassword} />
     };
 }
diff --git a/src/components/auth/permissions/Permissions.jsx b/src/components/auth/permissions/Permissions.jsx
index 2b049ec..d35cf37 100644
--- a/src/components/auth/permissions/Permissions.jsx
+++ b/src/components/auth/permissions/Permissions.jsx
@@ -1,32 +1,17 @@
-import React, { PropTypes } from 'react';
-
-import { FormattedMessage as Message } from 'react-intl';
+import React from 'react';
 
 import { Button } from 'components/ui/form';
+import RejectionLink from 'components/auth/RejectionLink';
 import AuthTitle from 'components/auth/AuthTitle';
 
 import messages from './Permissions.intl.json';
 import Body from './PermissionsBody';
 
 export default function Permissions() {
-    const componentsMap = {
+    return {
         Title: () => <AuthTitle title={messages.permissionsTitle} />,
         Body,
         Footer: () => <Button color="orange" autoFocus label={messages.approve} />,
-        Links: (props, context) => (
-            <a href="#" onClick={(event) => {
-                event.preventDefault();
-
-                context.reject();
-            }}>
-                <Message {...messages.decline} />
-            </a>
-        )
+        Links: () => <RejectionLink label={messages.decline} />
     };
-
-    componentsMap.Links.contextTypes = {
-        reject: PropTypes.func.isRequired
-    };
-
-    return componentsMap;
 }
diff --git a/src/components/auth/register/Register.jsx b/src/components/auth/register/Register.jsx
index 227ec08..2e6c8e9 100644
--- a/src/components/auth/register/Register.jsx
+++ b/src/components/auth/register/Register.jsx
@@ -1,8 +1,7 @@
 import React from 'react';
 
-import { FormattedMessage as Message } from 'react-intl';
-
 import { Button } from 'components/ui/form';
+import RejectionLink from 'components/auth/RejectionLink';
 import AuthTitle from 'components/auth/AuthTitle';
 import activationMessages from 'components/auth/activation/Activation.intl.json';
 
@@ -14,10 +13,6 @@ export default function Register() {
         Title: () => <AuthTitle title={messages.registerTitle} />,
         Body,
         Footer: () => <Button color="blue" label={messages.signUpButton} />,
-        Links: () => (
-            <a href="#">
-                <Message {...activationMessages.didNotReceivedEmail} />
-            </a>
-        )
+        Links: () => <RejectionLink label={activationMessages.didNotReceivedEmail} />
     };
 }
diff --git a/src/routes.js b/src/routes.js
index a6ab351..cf3b33a 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -20,7 +20,6 @@ import ChangePassword from 'components/auth/changePassword/ChangePassword';
 import ForgotPassword from 'components/auth/forgotPassword/ForgotPassword';
 import Finish from 'components/auth/finish/Finish';
 
-
 import authFlow from 'services/authFlow';
 
 export default function routesFactory(store) {
@@ -46,15 +45,15 @@ export default function routesFactory(store) {
 
             <Route path="oauth" component={OAuthInit} {...startAuthFlow} />
 
-            <Route path="auth" component={AuthPage} {...startAuthFlow}>
-                <Route path="/login" components={new Login()} />
-                <Route path="/password" components={new Password()} />
-                <Route path="/register" components={new Register()} />
-                <Route path="/activation" components={new Activation()} />
-                <Route path="/oauth/permissions" components={new Permissions()} />
-                <Route path="/oauth/finish" component={Finish} />
-                <Route path="/change-password" components={new ChangePassword()} />
-                <Route path="/forgot-password" components={new ForgotPassword()} />
+            <Route path="auth" component={AuthPage}>
+                <Route path="/login" components={new Login()} {...startAuthFlow} />
+                <Route path="/password" components={new Password()} {...startAuthFlow} />
+                <Route path="/register" components={new Register()} {...startAuthFlow} />
+                <Route path="/activation" components={new Activation()} {...startAuthFlow} />
+                <Route path="/oauth/permissions" components={new Permissions()} {...startAuthFlow} />
+                <Route path="/oauth/finish" component={Finish} {...startAuthFlow} />
+                <Route path="/change-password" components={new ChangePassword()} {...startAuthFlow} />
+                <Route path="/forgot-password" components={new ForgotPassword()} {...startAuthFlow} />
             </Route>
 
             <Route path="profile" component={ProfilePage} {...userOnly}>
diff --git a/src/services/authFlow/LoginState.js b/src/services/authFlow/LoginState.js
index 293aea7..5ee0fb0 100644
--- a/src/services/authFlow/LoginState.js
+++ b/src/services/authFlow/LoginState.js
@@ -1,6 +1,5 @@
 import AbstractState from './AbstractState';
 import PasswordState from './PasswordState';
-import ForgotPasswordState from './ForgotPasswordState';
 
 export default class LoginState extends AbstractState {
     enter(context) {
@@ -17,8 +16,4 @@ export default class LoginState extends AbstractState {
         context.run('login', payload)
             .then(() => context.setState(new PasswordState()));
     }
-
-    reject(context) {
-        context.setState(new ForgotPasswordState());
-    }
 }
diff --git a/tests/services/authFlow/LoginState.test.js b/tests/services/authFlow/LoginState.test.js
index 4c62e3e..60ad0b3 100644
--- a/tests/services/authFlow/LoginState.test.js
+++ b/tests/services/authFlow/LoginState.test.js
@@ -86,12 +86,4 @@ describe('LoginState', () => {
             return promise.catch(mock.verify.bind(mock));
         });
     });
-
-    describe('#reject', () => {
-        it('should transition to forgot password state', () => {
-            expectState(mock, ForgotPasswordState);
-
-            state.reject(context);
-        });
-    });
 });