nightspirit

<div ng-controller="uploadCtrl as upload">
  <!-- input file
    input name can be changed to fit the server side
  -->
  <input type="file" name="myFile"
         file-read
         upload-data="upload.data",
         preview="upload.preview",
         validate="upload.validate.file"/>

nightspirit

window.cookie = {
  set: function(cname, cvalue, exday){
    var d = new Date();
    d.setTime(d.getTime() + (exday*24*60*60*1000));
    var expires = "expires="+d.toUTCString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
  },
  get : function(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');

nightspirit

function Defer () {
    var result = {};
    result.promise = new Promise(function(resolve, reject) {
        result.resolve = resolve;
        result.reject = reject;
    });
    return result;
};

nightspirit

function Observable(init_value) {
    var _value = init_value;
    var subscriber = [];

    function obs() {
        if (arguments.length) {
            _value = arguments[0];
            obs.trigger();
            return this;
        } else {

nightspirit

//before
componentWillMount() {
  this._asyncRequest = asyncLoadData()
  .then(externalData => {
     this._asyncRequest = null
     this.setState({externalData})
  })
}

//after

nightspirit

// before
componentWillUpdate(nextProps, nextState) {
  if (
    this.state.someStatefulValue !==
    nextState.someStatefulValue
  ) {
    nextProps.onChange(nextState.someStatefulValue);
  }
}

nightspirit

// before
componentWillReceiveProps(nextProps) {
  if (this.props.currentRow !== nextProps.currentRow) {
    this.setState({
      isScrollingDown: nextProps.currentRow > this.props.currentRow
    })
  }   
}

// after

nightspirit

componentDidUpdate(prevProps, prevState) {
  if (this.props.reqPending !== prevProps.reqPending && !this.props.reqPending) {
     if(!this.props.error){
       this.props.history.push('/next-page')
     }
  }
}

nightspirit

import React from 'react'

const ctx = React.createContext()

export const {Provider, Consumer} = ctx

export const withCounter = Component => props => <Consumer>{value => <Component {...props} counter={value} />}</Consumer>

export default ctx

nightspirit

import React from 'react'
import { withCounter } from './context'

const IncBtn = ({ counter }) => <button type='button' className='btn btn-primary btn-block' onClick={counter.inc}>+</button>
const CounterIncBtn = withCounter(IncBtn)

export default CounterIncBtn