Add factory for auth components

src/components/auth/activation/Activation.jsx

@@ -1,17 +1,16 @@
-import React from 'react';
+import factory from 'components/auth/factory';
-
-import { Button } from 'components/ui/form';
-import RejectionLink from 'components/auth/RejectionLink';
-import AuthTitle from 'components/auth/AuthTitle';
 
 import messages from './Activation.intl.json';
 import Body from './ActivationBody';
 
-export default function Activation() {
+export default factory({
-    return {
+    title: messages.accountActivationTitle,
-        Title: () => <AuthTitle title={messages.accountActivationTitle} />,
+    body: Body,
-        Body,
+    footer: {
-        Footer: () => <Button color="blue" label={messages.confirmEmail} type="submit" />,
+        color: 'blue',
-        Links: () => <RejectionLink label={messages.didNotReceivedEmail} />
+        label: messages.confirmEmail
-    };
+    },
-}
+    links: {
+        label: messages.didNotReceivedEmail
+    }
+});

src/components/auth/changePassword/ChangePassword.jsx

@@ -1,17 +1,16 @@
-import React from 'react';
+import factory from 'components/auth/factory';
-
-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() {
+export default factory({
-    return {
+    title: messages.changePasswordTitle,
-        Title: () => <AuthTitle title={messages.changePasswordTitle} />,
+    body: Body,
-        Body,
+    footer: {
-        Footer: () => <Button color="darkBlue" label={messages.change} type="submit" />,
+        color: 'darkBlue',
-        Links: () => <RejectionLink label={messages.skipThisStep} />
+        label: messages.change
-    };
+    },
-}
+    links: {
+        label: messages.skipThisStep
+    }
+});

src/components/auth/factory.jsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+import { Button } from 'components/ui/form';
+import RejectionLink from 'components/auth/RejectionLink';
+import AuthTitle from 'components/auth/AuthTitle';
+
+/**
+ * @param {object} options
+ * @param {string|object} options.title - panel title
+ * @param {ReactElement} options.body
+ * @param {object} options.footer - config for footer Button
+ * @param {array|object|null} options.links - link config or an array of link configs
+ *
+ * @return {object} - structure, required for auth panel to work
+ */
+export default function(options) {
+    return () => ({
+        Title: () => <AuthTitle title={options.title} />,
+        Body: options.body,
+        Footer: () => <Button type="submit" {...options.footer} />,
+        Links: () => options.links ? (
+            <span>
+                {[].concat(options.links).map((link, index) => (
+                    [index ? ' | ' : '', <RejectionLink {...link} key={index} />]
+                ))}
+            </span>
+        ) : null
+    });
+}

src/components/auth/forgotPassword/ForgotPassword.jsx

@@ -1,17 +1,17 @@
-import React from 'react';
+import factory from 'components/auth/factory';
-
-import { Button } from 'components/ui/form';
-import RejectionLink from 'components/auth/RejectionLink';
-import AuthTitle from 'components/auth/AuthTitle';
 
 import messages from './ForgotPassword.intl.json';
 import Body from './ForgotPasswordBody';
 
-export default function ForgotPassword() {
+export default factory({
-    return {
+    title: messages.title,
-        Title: () => <AuthTitle title={messages.title} />,
+    body: Body,
-        Body,
+    footer: {
-        Footer: () => <Button color="lightViolet" autoFocus label={messages.sendMail} type="submit" />,
+        color: 'lightViolet',
-        Links: () => <RejectionLink label={messages.alreadyHaveCode} />
+        autoFocus: true,
-    };
+        label: messages.sendMail
-}
+    },
+    links: {
+        label: messages.alreadyHaveCode
+    }
+});

src/components/auth/login/Login.jsx

@@ -1,17 +1,14 @@
-import React from 'react';
+import factory from 'components/auth/factory';
-
-import { Button } from 'components/ui/form';
-import AuthTitle from 'components/auth/AuthTitle';
 
 import Body from './LoginBody';
 import messages from './Login.intl.json';
 
-export default function Login() {
+export default factory({
-    return {
+    title: messages.loginTitle,
-        Title: () => <AuthTitle title={messages.loginTitle} />,
+    body: Body,
-        Body,
+    footer: {
-        Footer: () => <Button color="green" label={messages.next} type="submit" />,
+        color: 'green',
-        Links: () => null
+        label: messages.next
-    };
+    }
-}
+});
 

src/components/auth/password/Password.jsx

@@ -1,17 +1,16 @@
-import React from 'react';
+import factory from 'components/auth/factory';
-
-import { Button } from 'components/ui/form';
-import RejectionLink from 'components/auth/RejectionLink';
-import AuthTitle from 'components/auth/AuthTitle';
 
 import Body from './PasswordBody';
 import messages from './Password.intl.json';
 
-export default function Password() {
+export default factory({
-    return {
+    title: messages.passwordTitle,
-        Title: () => <AuthTitle title={messages.passwordTitle} />,
+    body: Body,
-        Body,
+    footer: {
-        Footer: () => <Button color="green" label={messages.signInButton} type="submit" />,
+        color: 'green',
-        Links: () => <RejectionLink label={messages.forgotPassword} />
+        label: messages.signInButton
-    };
+    },
-}
+    links: {
+        label: messages.forgotPassword
+    }
+});

src/components/auth/permissions/Permissions.jsx

@@ -1,17 +1,17 @@
-import React from 'react';
+import factory from 'components/auth/factory';
-
-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() {
+export default factory({
-    return {
+    title: messages.permissionsTitle,
-        Title: () => <AuthTitle title={messages.permissionsTitle} />,
+    body: Body,
-        Body,
+    footer: {
-        Footer: () => <Button color="orange" autoFocus label={messages.approve} type="submit" />,
+        color: 'orange',
-        Links: () => <RejectionLink label={messages.decline} />
+        autoFocus: true,
-    };
+        label: messages.approve
-}
+    },
+    links: {
+        label: messages.decline
+    }
+});
+

src/components/auth/recoverPassword/RecoverPassword.jsx

@@ -1,18 +1,17 @@
-import React from 'react';
+import factory from 'components/auth/factory';
-
-import { Button } from 'components/ui/form';
-import RejectionLink from 'components/auth/RejectionLink';
-import AuthTitle from 'components/auth/AuthTitle';
 import changePassword from 'components/auth/changePassword/ChangePassword.intl.json';
 
 import messages from './RecoverPassword.intl.json';
 import Body from './RecoverPasswordBody';
 
-export default function RecoverPassword() {
+export default factory({
-    return {
+    title: messages.title,
-        Title: () => <AuthTitle title={messages.title} />,
+    body: Body,
-        Body,
+    footer: {
-        Footer: () => <Button color="lightViolet" label={changePassword.change} type="submit" />,
+        color: 'lightViolet',
-        Links: () => <RejectionLink label={messages.contactSupport} />
+        label: changePassword.change
-    };
+    },
-}
+    links: {
+        label: messages.contactSupport
+    }
+});

src/components/auth/register/Register.jsx

@@ -1,25 +1,24 @@
-import React from 'react';
+import factory from 'components/auth/factory';
-
-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';
 import forgotPasswordMessages from 'components/auth/forgotPassword/ForgotPassword.intl.json';
 
 import messages from './Register.intl.json';
 import Body from './RegisterBody';
 
-export default function Register() {
+export default factory({
-    return {
+    title: messages.registerTitle,
-        Title: () => <AuthTitle title={messages.registerTitle} />,
+    body: Body,
-        Body,
+    footer: {
-        Footer: () => <Button color="blue" label={messages.signUpButton} type="submit" />,
+        color: 'blue',
-        Links: () => (
+        label: messages.signUpButton
-            <span>
+    },
-                <RejectionLink label={activationMessages.didNotReceivedEmail} payload={{requestEmail: true}} />
+    links: [
-                {' | '}
+        {
-                <RejectionLink label={forgotPasswordMessages.alreadyHaveCode} />
+            label: activationMessages.didNotReceivedEmail,
-            </span>
+            payload: {requestEmail: true}
-        )
+        },
-    };
+        {
-}
+            label: forgotPasswordMessages.alreadyHaveCode
+        }
+    ]
+});

src/components/auth/resendActivation/ResendActivation.jsx

@@ -1,18 +1,17 @@
-import React from 'react';
+import factory from 'components/auth/factory';
-
-import { Button } from 'components/ui/form';
-import AuthTitle from 'components/auth/AuthTitle';
-import RejectionLink from 'components/auth/RejectionLink';
 import forgotPasswordMessages from 'components/auth/forgotPassword/ForgotPassword.intl.json';
 
 import messages from './ResendActivation.intl.json';
 import Body from './ResendActivationBody';
 
-export default function ResendActivation() {
+export default factory({
-    return {
+    title: messages.title,
-        Title: () => <AuthTitle title={messages.title} />,
+    body: Body,
-        Body,
+    footer: {
-        Footer: () => <Button color="blue" label={messages.sendNewEmail} type="submit" />,
+        color: 'blue',
-        Links: () => <RejectionLink label={forgotPasswordMessages.alreadyHaveCode} />
+        label: messages.sendNewEmail
-    };
+    },
-}
+    links: {
+        label: forgotPasswordMessages.alreadyHaveCode
+    }
+});