MaximeHeckel

Keybase proof

I hereby claim:

• I am maximeheckel on github.
• I am maximeheckel (https://keybase.io/maximeheckel) on keybase.
• I have a public key whose fingerprint is DEE3 414A B70A 0CBE 6439 93C3 994B 2A42 CCF6 3249

To claim this, I am signing this object:

MaximeHeckel

weave 2015/09/15 10:19:25.527177 ->[146.185.184.37:37684] connection accepted
weave 2015/09/15 10:19:25.528452 ->[146.185.184.37:37684|92:27:c5:47:c9:ce(5cd122c9-maximeheckel.node.tutum.io)]: completed handshake; using protocol version 1
weave 2015/09/15 10:19:25.530319 ->[146.185.184.37:37684|92:27:c5:47:c9:ce(5cd122c9-maximeheckel.node.tutum.io)]: connection added (new peer)
weave 2015/09/15 10:19:25.538672 ->[146.185.184.37:37684|92:27:c5:47:c9:ce(5cd122c9-maximeheckel.node.tutum.io)]: connection shutting down due to error: write tcp4 146.185.184.37:37684: connection reset by peer
weave 2015/09/15 10:19:25.539532 ->[146.185.184.37:37684|92:27:c5:47:c9:ce(5cd122c9-maximeheckel.node.tutum.io)]: connection deleted
weave 2015/09/15 10:19:25.540407 ->[146.185.184.37:37685] connection accepted
weave 2015/09/15 10:19:25.547399 ->[146.185.184.37:37685|92:27:c5:47:c9:ce(5cd122c9-maximeheckel.node.tutum.io)]: completed handshake; using protocol version 1
weave 2015/09/15 10:19:25.547595 ->[146.185.184.37:37685|92:27

MaximeHeckel

import React from 'react';
import { mount } from 'enzyme';
import Article from '../';

// First we declare some mocks
const Content = () => <div>[Mock] Content</div>;
const Subtitle = () => <div>[Mock] Subtitle</div>;
const Comments = () => <div>[Mock] Comments</div>;
const Metadata = () => <div>[Mock] Metadata</div>;
const Title = () => <div>[Mock] Title</div>;

MaximeHeckel

class MyArticleView extends React.Component {
  ...
  render() {
    return (
      <div className={css.mainContainer}>
        <div className={css.wrapper}>
          <div className={css.titleContainer}>
            <div className={css.title}>
              <span>{this.renderTitle()}</span>
            </div>

MaximeHeckel

class MyArticleView extends React.Component {
  ...
  render() {
    return (
      <Article>
        <Article.Title>{this.renderTitle()}</Article.Title>
        <Article.Subtitle>{this.renderSubtitle()}</Article.Subtitle>
        <Article.Metadata>
          {this.renderAuthor()}
          {this.renderDate()}

MaximeHeckel

<Article>
  <Article.Title>
    My Article Title
  </Article.Title>
</Article>

MaximeHeckel

...

const Title = () => null;
Title.displayName = 'Title';

const Subtitle = () => null;
Subtitle.displayName = 'Subtitle';

const Metadata = () => null;
Metadata.displayName = 'Metadata';

MaximeHeckel

import React, { Component } from 'react';

const ArticleContext = React.createContext();
const OtherContext = React.createContext();

const OutOfContextComponent = OtherContext.Provider;
const Article = ArticleContext.Provider;
const View = ArticleContext.Consumer;

const Title = () => {

MaximeHeckel

import React from "react";

// This creates the "Article Context" i.e. an object containing a Provider and a Consumer component
const ArticleContext = React.createContext();

// This is the Title sub-component, which is a consumer of the Article Context
const Title = () => {
  return (
    <ArticleContext.Consumer>
      {({ title, subtitle }) => (

MaximeHeckel

import React, { Component } from "react";
import Article from "./Article";

const text = `
  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
`;

class App extends Component {
  constructor() {
    this.state = {