ccorcos

// api.js
export function makePayment(loanId, amount, paymentMethodId) {
  return fetch(`/api/loans/${loanId}/payments`, {
    headers: new Headers({
      'Content-Type': 'application/json',
    }),
    credentials: 'same-origin',
    method: 'POST',
    body: JSON.stringify({
      'amount': amount,

ccorcos

export function makePayment(loanId, amount, paymentMethodId) {
  return async dispatch => {
    dispatch(makePaymentSent())
    const response = await api.makePayment(loanId, amount, paymentMethodId)
    dispatch(closeModal())
    if (response.status !== 200) {
      dispatch(makePaymentFailed(response.statusText))
    } else {
      const result = await response.json()
      dispatch(makePaymentSuccess(result.data))

ccorcos

// reducer.js
export default function reducer(state=initialState, action) {
  switch(action.type) {
    case defs.MAKE_PAYMENT_SUCCESS:
      return state.withMutations(s =>
        s.set('modalOpen', false)
         .set('loading', false)
         .setIn(['loans', action.loan.id], Immutable.fromJS(action.loan))
      )
    case defs.MAKE_PAYMENT_FAILED:

ccorcos

// actions/sync.js
export const makePaymentSent = () => ({
  type: defs.MAKE_PAYMENT_SENT,
})
export const makePaymentFailed = (error) => ({
  type: defs.MAKE_PAYMENT_FAILED,
  error,
})
export const makePaymentSuccess = (loan) => ({
  type: defs.MAKE_PAYMENT_SUCCESS,

ccorcos

export default function reducer(state=initialState, action) {
  switch(action.type) {
    case defs.MAKE_PAYMENT_SUCCESS:
      return state.withMutations(s =>
        s.set('modalOpen', false)
         .set('loading', false)
         .setIn(['loans', action.loan.id], Immutable.fromJS(action.loan))
      )
    case defs.MAKE_PAYMENT_FAILED:
      return state.withMutations(s =>

ccorcos

// mutators.js
export const closeModal = s => s.set('modalOpen', false)
export const stopLoading = s => s.set('loading', false)
export const updateLoan = loan => s => s.setIn(['loans', loan.id], Immutable.fromJS(loan))
export const setPaymentError = error => s => s.set('paymentError', error)
// utils.js
const applyFn = (state, fn) => fn(state)
export const pipe = (fns, state) =>
  state.withMutations(s => fns.reduce(applyFn, s))
// reducer.js

ccorcos

describe('App Reducer', () => {
  it('MAKE_PAYMENT_SUCCESS', () => {
    const state = Immutable.Map()
    const loan = Symbol()
    const mutations = [
      expect.spyOn('mutate', 'updateLoan').andCall(loan => s => s)
      expect.spyOn('mutate', 'closeModal').andCall(s => s)
      expect.spyOn('mutate', 'stopLoading').andCall(s => s)
    ]
    const result = reducer(state, actions.makePaymentSuccess(loan))

ccorcos

~/code ❯❯❯ mkdir react-test
~/code ❯❯❯ cd react-test
~/c/react-test ❯❯❯ npm init -y
Wrote to /Users/chetcorcos/code/react-test/package.json:

{
  "name": "react-test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",

ccorcos

class WithGps extends PureComponent {
  constructor(props) {
    super(props)
    // see if maybe you have it cached
    const gps = GeoService.get()
    // this will be effective on the first render
    this.state = { gps }
    // wait for the gps location
    if (!gps) {

ccorcos

~ ❯❯❯ cd /tmp

/tmp ❯❯❯ git clone git@github.com:ccorcos/doug.git
Cloning into 'doug'...
remote: Counting objects: 631, done.
remote: Compressing objects: 100% (459/459), done.
remote: Total 631 (delta 237), reused 0 (delta 0), pack-reused 164
Receiving objects: 100% (631/631), 207.74 KiB | 0 bytes/s, done.
Resolving deltas: 100% (290/290), done.
Checking connectivity... done.