mirror of
https://github.com/elyby/accounts-frontend.git
synced 2024-12-27 23:40:28 +05:30
Add factory for auth components
This commit is contained in:
parent
a2e8fbab95
commit
731e0e3c78
@ -1,17 +1,16 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Button } from 'components/ui/form';
|
||||
import RejectionLink from 'components/auth/RejectionLink';
|
||||
import AuthTitle from 'components/auth/AuthTitle';
|
||||
import factory from 'components/auth/factory';
|
||||
|
||||
import messages from './Activation.intl.json';
|
||||
import Body from './ActivationBody';
|
||||
|
||||
export default function Activation() {
|
||||
return {
|
||||
Title: () => <AuthTitle title={messages.accountActivationTitle} />,
|
||||
Body,
|
||||
Footer: () => <Button color="blue" label={messages.confirmEmail} type="submit" />,
|
||||
Links: () => <RejectionLink label={messages.didNotReceivedEmail} />
|
||||
};
|
||||
}
|
||||
export default factory({
|
||||
title: messages.accountActivationTitle,
|
||||
body: Body,
|
||||
footer: {
|
||||
color: 'blue',
|
||||
label: messages.confirmEmail
|
||||
},
|
||||
links: {
|
||||
label: messages.didNotReceivedEmail
|
||||
}
|
||||
});
|
||||
|
@ -1,17 +1,16 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Button } from 'components/ui/form';
|
||||
import RejectionLink from 'components/auth/RejectionLink';
|
||||
import AuthTitle from 'components/auth/AuthTitle';
|
||||
import factory from 'components/auth/factory';
|
||||
|
||||
import Body from './ChangePasswordBody';
|
||||
import messages from './ChangePassword.intl.json';
|
||||
|
||||
export default function ChangePassword() {
|
||||
return {
|
||||
Title: () => <AuthTitle title={messages.changePasswordTitle} />,
|
||||
Body,
|
||||
Footer: () => <Button color="darkBlue" label={messages.change} type="submit" />,
|
||||
Links: () => <RejectionLink label={messages.skipThisStep} />
|
||||
};
|
||||
}
|
||||
export default factory({
|
||||
title: messages.changePasswordTitle,
|
||||
body: Body,
|
||||
footer: {
|
||||
color: 'darkBlue',
|
||||
label: messages.change
|
||||
},
|
||||
links: {
|
||||
label: messages.skipThisStep
|
||||
}
|
||||
});
|
||||
|
29
src/components/auth/factory.jsx
Normal file
29
src/components/auth/factory.jsx
Normal file
@ -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
|
||||
});
|
||||
}
|
@ -1,17 +1,17 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Button } from 'components/ui/form';
|
||||
import RejectionLink from 'components/auth/RejectionLink';
|
||||
import AuthTitle from 'components/auth/AuthTitle';
|
||||
import factory from 'components/auth/factory';
|
||||
|
||||
import messages from './ForgotPassword.intl.json';
|
||||
import Body from './ForgotPasswordBody';
|
||||
|
||||
export default function ForgotPassword() {
|
||||
return {
|
||||
Title: () => <AuthTitle title={messages.title} />,
|
||||
Body,
|
||||
Footer: () => <Button color="lightViolet" autoFocus label={messages.sendMail} type="submit" />,
|
||||
Links: () => <RejectionLink label={messages.alreadyHaveCode} />
|
||||
};
|
||||
}
|
||||
export default factory({
|
||||
title: messages.title,
|
||||
body: Body,
|
||||
footer: {
|
||||
color: 'lightViolet',
|
||||
autoFocus: true,
|
||||
label: messages.sendMail
|
||||
},
|
||||
links: {
|
||||
label: messages.alreadyHaveCode
|
||||
}
|
||||
});
|
||||
|
@ -1,17 +1,14 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Button } from 'components/ui/form';
|
||||
import AuthTitle from 'components/auth/AuthTitle';
|
||||
import factory from 'components/auth/factory';
|
||||
|
||||
import Body from './LoginBody';
|
||||
import messages from './Login.intl.json';
|
||||
|
||||
export default function Login() {
|
||||
return {
|
||||
Title: () => <AuthTitle title={messages.loginTitle} />,
|
||||
Body,
|
||||
Footer: () => <Button color="green" label={messages.next} type="submit" />,
|
||||
Links: () => null
|
||||
};
|
||||
}
|
||||
export default factory({
|
||||
title: messages.loginTitle,
|
||||
body: Body,
|
||||
footer: {
|
||||
color: 'green',
|
||||
label: messages.next
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -1,17 +1,16 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Button } from 'components/ui/form';
|
||||
import RejectionLink from 'components/auth/RejectionLink';
|
||||
import AuthTitle from 'components/auth/AuthTitle';
|
||||
import factory from 'components/auth/factory';
|
||||
|
||||
import Body from './PasswordBody';
|
||||
import messages from './Password.intl.json';
|
||||
|
||||
export default function Password() {
|
||||
return {
|
||||
Title: () => <AuthTitle title={messages.passwordTitle} />,
|
||||
Body,
|
||||
Footer: () => <Button color="green" label={messages.signInButton} type="submit" />,
|
||||
Links: () => <RejectionLink label={messages.forgotPassword} />
|
||||
};
|
||||
}
|
||||
export default factory({
|
||||
title: messages.passwordTitle,
|
||||
body: Body,
|
||||
footer: {
|
||||
color: 'green',
|
||||
label: messages.signInButton
|
||||
},
|
||||
links: {
|
||||
label: messages.forgotPassword
|
||||
}
|
||||
});
|
||||
|
@ -1,17 +1,17 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Button } from 'components/ui/form';
|
||||
import RejectionLink from 'components/auth/RejectionLink';
|
||||
import AuthTitle from 'components/auth/AuthTitle';
|
||||
|
||||
import factory from 'components/auth/factory';
|
||||
import messages from './Permissions.intl.json';
|
||||
import Body from './PermissionsBody';
|
||||
|
||||
export default function Permissions() {
|
||||
return {
|
||||
Title: () => <AuthTitle title={messages.permissionsTitle} />,
|
||||
Body,
|
||||
Footer: () => <Button color="orange" autoFocus label={messages.approve} type="submit" />,
|
||||
Links: () => <RejectionLink label={messages.decline} />
|
||||
};
|
||||
}
|
||||
export default factory({
|
||||
title: messages.permissionsTitle,
|
||||
body: Body,
|
||||
footer: {
|
||||
color: 'orange',
|
||||
autoFocus: true,
|
||||
label: messages.approve
|
||||
},
|
||||
links: {
|
||||
label: messages.decline
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -1,18 +1,17 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Button } from 'components/ui/form';
|
||||
import RejectionLink from 'components/auth/RejectionLink';
|
||||
import AuthTitle from 'components/auth/AuthTitle';
|
||||
import factory from 'components/auth/factory';
|
||||
import changePassword from 'components/auth/changePassword/ChangePassword.intl.json';
|
||||
|
||||
import messages from './RecoverPassword.intl.json';
|
||||
import Body from './RecoverPasswordBody';
|
||||
|
||||
export default function RecoverPassword() {
|
||||
return {
|
||||
Title: () => <AuthTitle title={messages.title} />,
|
||||
Body,
|
||||
Footer: () => <Button color="lightViolet" label={changePassword.change} type="submit" />,
|
||||
Links: () => <RejectionLink label={messages.contactSupport} />
|
||||
};
|
||||
}
|
||||
export default factory({
|
||||
title: messages.title,
|
||||
body: Body,
|
||||
footer: {
|
||||
color: 'lightViolet',
|
||||
label: changePassword.change
|
||||
},
|
||||
links: {
|
||||
label: messages.contactSupport
|
||||
}
|
||||
});
|
||||
|
@ -1,25 +1,24 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Button } from 'components/ui/form';
|
||||
import RejectionLink from 'components/auth/RejectionLink';
|
||||
import AuthTitle from 'components/auth/AuthTitle';
|
||||
import factory from 'components/auth/factory';
|
||||
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() {
|
||||
return {
|
||||
Title: () => <AuthTitle title={messages.registerTitle} />,
|
||||
Body,
|
||||
Footer: () => <Button color="blue" label={messages.signUpButton} type="submit" />,
|
||||
Links: () => (
|
||||
<span>
|
||||
<RejectionLink label={activationMessages.didNotReceivedEmail} payload={{requestEmail: true}} />
|
||||
{' | '}
|
||||
<RejectionLink label={forgotPasswordMessages.alreadyHaveCode} />
|
||||
</span>
|
||||
)
|
||||
};
|
||||
}
|
||||
export default factory({
|
||||
title: messages.registerTitle,
|
||||
body: Body,
|
||||
footer: {
|
||||
color: 'blue',
|
||||
label: messages.signUpButton
|
||||
},
|
||||
links: [
|
||||
{
|
||||
label: activationMessages.didNotReceivedEmail,
|
||||
payload: {requestEmail: true}
|
||||
},
|
||||
{
|
||||
label: forgotPasswordMessages.alreadyHaveCode
|
||||
}
|
||||
]
|
||||
});
|
||||
|
@ -1,18 +1,17 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Button } from 'components/ui/form';
|
||||
import AuthTitle from 'components/auth/AuthTitle';
|
||||
import RejectionLink from 'components/auth/RejectionLink';
|
||||
import factory from 'components/auth/factory';
|
||||
import forgotPasswordMessages from 'components/auth/forgotPassword/ForgotPassword.intl.json';
|
||||
|
||||
import messages from './ResendActivation.intl.json';
|
||||
import Body from './ResendActivationBody';
|
||||
|
||||
export default function ResendActivation() {
|
||||
return {
|
||||
Title: () => <AuthTitle title={messages.title} />,
|
||||
Body,
|
||||
Footer: () => <Button color="blue" label={messages.sendNewEmail} type="submit" />,
|
||||
Links: () => <RejectionLink label={forgotPasswordMessages.alreadyHaveCode} />
|
||||
};
|
||||
}
|
||||
export default factory({
|
||||
title: messages.title,
|
||||
body: Body,
|
||||
footer: {
|
||||
color: 'blue',
|
||||
label: messages.sendNewEmail
|
||||
},
|
||||
links: {
|
||||
label: forgotPasswordMessages.alreadyHaveCode
|
||||
}
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user