Merge pull request #25 from rjz/feature/compose

Demos compose() utility

Author: rjz

src/api.ts

@@ -18,17 +18,21 @@ const flakify = <T>(f: () => T): Promise<T> =>
     }, 200 + Math.random() * 2000)
   )
 
+type Counter = {
+  value: number,
+}
+
 export type Api = {
-  save(x: { value: number }): Promise<null>,
-  load(): (Promise<{ value: number }>),
+  save(x: Counter): Promise<null>,
+  load(): (Promise<Counter>),
 }
 
 export const api: Api = {
-  save: (counter: { value: number }): Promise<null> => flakify(() => {
+  save: (counter: Counter): Promise<null> => flakify(() => {
       localStorage.setItem('__counterValue', counter.value.toString())
       return null
     }),
-  load: (): Promise<{ value: number }> => flakify(() => {
+  load: (): Promise<Counter> => flakify(() => {
       const storedValue = parseInt(localStorage.getItem('__counterValue'), 10)
       return {
         value: storedValue || 0,

src/index.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react' // tslint:disable-line
+import * as React from 'react'
 import * as ReactDOM from 'react-dom'
 import * as redux from 'redux'
 import { Provider } from 'react-redux'
@@ -8,18 +8,19 @@ import * as state from './reducers'
 
 import { Counter } from './components/counter'
 
-let store: redux.Store<state.All> = redux.createStore(
+const store: redux.Store<state.All> = redux.createStore(
   state.reducers,
   {} as state.All,
   redux.applyMiddleware(thunk),
 )
 
-// Commented out ("let HTML app be HTML app!")
+const Root: React.SFC<{}> = () => (
+  <Provider store={store}>
+    <Counter />
+  </Provider>
+)
+
 window.addEventListener('DOMContentLoaded', () => {
   const rootEl = document.getElementById('redux-app-root')
-  if (rootEl) ReactDOM.render(
-    <Provider store={store}>
-      <Counter />
-    </Provider>
-  , rootEl)
+  ReactDOM.render(<Root />, rootEl)
 })

src/utils.ts

@@ -0,0 +1,8 @@
+import * as React from 'react'
+
+type RC = React.SFC | React.ComponentClass
+
+type HOC = (C: RC) => RC
+
+export const compose = (Component: RC, ...hocs: Array<HOC>) =>
+  hocs.reduce((C, hoc) => hoc(C), Component)