JoaoCnh

import React from 'react';
import { Formik } from 'formik';
import Yup from 'yup';
import VirtualizedSelect from 'react-virtualized-select';

import 'react-select/dist/react-select.css';
import 'react-virtualized/styles.css';
import 'react-virtualized-select/styles.css';

const imaginaryThings = [

JoaoCnh

Yup.object().shape({
  email: Yup.string().email('Invalid email address').required('Email is required!'),
  username: Yup.string().required('This man needs a username').when('email', (email, schema) => {
    if (email === '[email protected]') { return schema.min(10); }
    return schema;
  }),
});

JoaoCnh

Yup.object().shape({
  email: Yup.string().email('Invalid email address').required('Email is required!'),
  username: Yup.string().required('This man needs a ${path}').when('email', (email, schema) => {
    if (email === '[email protected]') { 
      return schema.label('papidipupi').min(10);
    }
    return schema.label('babidibiba');
  });

JoaoCnh

Yup.object().shape({
  email: Yup.string().email('Invalid email address').required('Email is required!'),
  username: Yup.string().required('This man needs a ${path}').when('email', (email, schema) => {
    if (email === '[email protected]') { 
      return schema.label('papidipupi').min(10);
    }
    return schema.label('babidibiba');
  }).test('is-zigzagging', '${path} is not zigzagging', value => value === 'zigzagging'),
});

JoaoCnh

<input id="file" name="file" type="file" onChange={(event) => {
  setFieldValue("file", event.currentTarget.files[0]);
}} />

JoaoCnh

JSON.stringify({ 
  fileName: values.file.name, 
  type: values.file.type,
  size: `${values.file.size} bytes`
}, null, 2);

JoaoCnh

export default class CarsList extends React.Component {
  state = {
    cars: [],
    isLoading: false,
  };

  _fetch = async () => {
    const res = await fetch("api/url");
    const json = await res.json();
    

JoaoCnh

import React from "react";
import PropTypes from "prop-types";

class List extends React.Component {
  static propTypes = {
    render: PropTypes.func.isRequired,
    url: PropTypes.string.isRequired,
  };

  state = {

JoaoCnh

<List 
  url="https://api.github.com/users/JoaoCnh/repos"
  render={({ list, isLoading }) => (
    <div>
      <h2>My repos</h2>
      {isLoading && <h2>Loading...</h2>}

      <ul>
        {list.length > 0 && list.map(repo => (
          <li key={repo.id}>

JoaoCnh

import React from "react";
import PropTypes from "prop-types";

class AjaxForm extends React.Component {
  static propTypes = {
    type: PropTypes.string.isRequired,
    url: PropTypes.string.isRequired,
    onSuccess: PropTypes.func.isRequired,
  };