kaievns

import { Form } from 'forms-kit'
import { ValidationError } from 'a-plus-forms'



const OurForm = ({ onSubmit, defaultValues }) => {
  <Form onSubmit, dfeaul>
    ...
}

kaievns

                    /- kicks in the process
         +--------+ 
 HTTP -> | kicker |
         +--------+
              |
              V     /- tracks generations 
         +--------+
    *--->| looper |
    |    +--------+
    |         |

kaievns

let solution = 'a'...'z'; // <- the end solution;

let currentSolution = 'z'...'a';

while (grade(currrentSolution) < '100%') {
  let generation = randomlyMutate(currentSolution, { times: 10 });
  let bestInGeneration = pickBestSolutionIn(generation);
  
  currentSolution = bestInGeneration;
}

kaievns

1. Overall sense of instability. Considering that there are basically two grown up implementations for react out there Relay and Apollo. Seing issues like those in apollo make me feel uneasy. References: apollographql/react-apollo#1286 apollographql/react-apollo#556 https://github.com/apollographql/apollo-test-utils/issues/39

there are multiple variations of each throught the apollo related packages. the most disturbing is lack of response or sense of community ownership. it gives an impression of one guy manning half of the leverages

kaievns

const { execSync } = require('child_process');

const directory = 'src';

const findOut = execSync('find -L src').toString();
const filenames = findOut.trim().split('\n')
  .filter(name => name.endsWith('.js'))
  .map(name => name.replace('.js', '').replace('src/', '').replace(/\/index$/, ''));

console.log('Found', filenames.length, 'files in', directory);

kaievns

import { mount } from 'enzyme';
import { TextInput, PasswordInput } from 'a-plus-forms';
import SignInForm from 'src/features/auth/signin_form';

describe('<SignInForm /', () => {
  it('works beautifully', () => {
    const onSubmit = sinon.spy();
    const wrapper = mount(<SignInForm onSubmit={onSubmit} />);
    
    wrapper.find(TextInput).instance().value = 'nikolay';

kaievns

import { field, TextInput } from 'a-plus-forms';

@field()
class PhoneInput extends React.Component {
  onChange = (text) => {
    const phoneNumber = format(text); // to phone number
    this.props.onChange(phoneNumber);
  }
  
  render() {

kaievns

import { Form, TextInput, PasswordInput } from 'a-plus-forms';

const signIn = ({ username, password }) =>
  axios.post('/users', { username, password });

<Form onSubmit={signIn}>
  <TextInput name="username" label="Username" />
  <PasswordInput name="password" label="Password" />
  <button type="submit">Sign In</button>
</Form>

kaievns

<form action="/signin">
  <input type="text" name="username" />
  <input type="password" name="password" />
  <button type="submit">Sign In</button>
</form>

kaievns

const connect = (mapStateToProps, mapDispatchToProps) => magic ...

const MegaLopolos = (props) => 
  <div>
    Stuff....
  </div>

export defaults connect(mapStateToProps, mapDispatchToProps)(cssModules(styles)(MegaLopolos));