kettanaito

const statusCodes = {
    success: 200,
    error: 400,
};

function all(promises) {
    const transformedPromises = promises.map(promise => promise.then((result) => {

    if (result.payload.statusCode !== statusCodes.success) {
        throw new Error('PROMISE RESOLVED TO FAILURE! SHOULD FAIL THIS CHAIN TO SHREDS');

kettanaito

/**
 * Promise sequence
 * @description Handles the sequence of Promise.
 * @param {Array<Function: Promise>} promises Collection of functions which should return instance of Promise.
 * @return {Promise}
 */
function PromiseSeq(promises) {
  return promises.reduce((promisesPool, promise) =>
    promisesPool.then((result) => {
      /* Explicitly check if function (returning promise), since you can pass {true} to it

kettanaito

/* App.jsx */
import React from 'react';
import EmailChange from './EmailChange';
import ConfirmationModal from './ConfirmationModal';

export default class App extends React.Component {
  render() {
    return (
      <EmailChange />
      <ConfirmationModal />

kettanaito

<!--

  One-element way of doing this kind of headings:

  ---------------- Text here ----------------

  * One HTML tag only
  * Background-independant
  * Properly centered horizontally and vertically
  * Same browsers support as for flexbox

kettanaito

// src/app/RegistrationForm.jsx
import React from 'react';
import { Form } from 'react-advanced-form';
import { Input } from '...';

export default class RegistrationForm extends React.Component {
  render() {
    return (
      <Form>
        <Input

kettanaito

// src/app/validation-rules.js
import isEmail from 'validator/lib/isEmail';

export default {
  type: {
    email: ({ value }) => isEmail(value),
    password: {
      capitalLetter: ({ value }) => /[A-Z]/.test(value),
      oneNumber: ({ value }) => /[0-9]/.test(value),
      minLength: ({ value }) => (value.length > 5)

kettanaito

// app/validation-messages.js
export default {
  generic: {
    missing: 'Please provide the required field',
    invalid: 'The value you have provided is invalid'
  },
  
  type: {
    email: {
      missing: 'Please provide the e-mail',

kettanaito

// app/index.js
import React from 'react';
import ReactDOM from 'react-dom';
import { FormProvider } from 'react-advanced-form';
import rules from './validation-rules';
import messages from './validation-messages';
import Root from './Root';

const renderApp = () => (
  <FormProvider rules={rules} messages={messages}>

kettanaito

{
  "primaryInfo": {
    "userEmail": "...",
    "firstName": "...",
    "lastName": "...",
  },
  "userPassword": "..."
}

kettanaito

// src/app/RegistrationForm.jsx
import React from 'react';
import { Form, Field } from 'react-advanced-form';
import { Input } from '...';

export default class RegistrationForm extends React.Component {
  render() {
    <Form>
      <Field.Group name="primaryInfo">
        <Input