New Mounting API

Author: wcjohnson

src/ReduxComponent.coffee

@@ -24,10 +24,11 @@ ReduxComponent.prototype.__willMount = (@store, @path = [], @parentComponent = n
 	invariant(not @__mounted, "redux-component of type #{@displayName} was multiply initialized. This can indicate a cycle in your component graph, which is illegal. Make sure each instance is only used once in your tree. If you wish to use a component in multiple places, construct additional instances.")
 	@__mounted = true
 	@componentWillMount?()
-	@reducer = indirectReducer.bind(@)
+	#@reducer = indirectReducer.bind(@)
 	@updateReducer()
 
 ReduxComponent.prototype.__willUnmount = ->
 	invariant(@__mounted, "redux-component of type #{@displayName} was unmounted when not mounted. This can indicate an issue in a dynamic reducer component such as redux-components-map.")
 	@componentWillUnmount?()
+	@__internalReducer = nullIdentity
 	delete @__mounted

src/createClass.coffee

@@ -7,7 +7,6 @@ dontBindThese = {
 	updateReducer: true
 	__willMount: true
 	__willUnmount: true
-	__mounter: true
 	__init: true
 }
 

src/index.coffee

@@ -1,7 +1,7 @@
 import applyMixin from './applyMixin'
 import createClass from './createClass'
 import DefaultMixin from './DefaultMixin'
-import mountComponent from './mountComponent'
+import { mountRootComponent, willMountComponent, didMountComponent, willUnmountComponent } from './mountComponent'
 import ReduxComponent from './ReduxComponent'
 import ObservableSelectorMixin from './ObservableSelectorMixin'
 import { makeSelectorsObservable } from './makeSelectorObservable'
@@ -13,7 +13,10 @@ export {
 	applyMixin
 	createClass
 	DefaultMixin
-	mountComponent
+	mountRootComponent
+	willMountComponent
+	didMountComponent
+	willUnmountComponent
 	ReduxComponent
 	createComponent
 	SubtreeMixin

src/mountComponent.coffee

@@ -1,8 +1,15 @@
-defaultMounter = (store, componentInstance) ->
+export mountRootComponent = (store, componentInstance) ->
+	componentInstance.__willMount(store, [], null)
 	store.replaceReducer(componentInstance.reducer)
+	componentInstance.componentDidMount?()
 
-export default mountComponent = (store, componentInstance, path = [], mounter = defaultMounter) ->
-	componentInstance.__mounter = mounter
+export willMountComponent = (store, componentInstance, path) ->
+	componentInstance.__manualMount = true
 	componentInstance.__willMount(store, path, null)
-	mounter?(store, componentInstance)
+	componentInstance.reducer
+
+export didMountComponent = (componentInstance) ->
 	componentInstance.componentDidMount?()
+
+export willUnmountComponent = (componentInstance) ->
+	componentInstance.__willUnmount()

test/01-basic.coffee

@@ -1,6 +1,6 @@
 { expect } = require 'chai'
 
-{ createClass, mountComponent, createComponent, SubtreeMixin } = require '..'
+{ createClass, mountRootComponent, createComponent, SubtreeMixin } = require '..'
 { makeAStore } = require './helpers/store'
 
 describe 'basic functions: ', ->
@@ -25,7 +25,7 @@ describe 'basic functions: ', ->
 
 		it 'should mount instance of class on store', ->
 			rootComponentInstance = new Subcomponent()
-			mountComponent(store, rootComponentInstance)
+			mountRootComponent(store, rootComponentInstance)
 
 		it 'should know about the store', ->
 			expect(rootComponentInstance.store).to.equal(store)
@@ -60,7 +60,7 @@ describe 'basic functions: ', ->
 
 		it 'should mount instance of class on store', ->
 			rootComponentInstance = new Subcomponent()
-			mountComponent(store, rootComponentInstance)
+			mountRootComponent(store, rootComponentInstance)
 
 		it 'should set the default state', ->
 			expect(store.getState()).to.deep.equal({})

test/02-subtree.coffee

@@ -1,7 +1,7 @@
 { inspect } = require 'util'
 
 { expect, assert } = require 'chai'
-{ createClass, mountComponent, createComponent, SubtreeMixin } = require '..'
+{ createClass, mountRootComponent, createComponent, SubtreeMixin } = require '..'
 { makeAStore } = require './helpers/store'
 
 describe 'subtree: ', ->
@@ -37,7 +37,7 @@ describe 'subtree: ', ->
 
 		it 'should mount subcomponent using direct syntax', ->
 			rootComponentInstance = createComponent( { foo: Subcomponent } )
-			mountComponent(store, rootComponentInstance)
+			mountRootComponent(store, rootComponentInstance)
 
 	describe 'complex: ', ->
 		it 'should create new store', ->
@@ -65,7 +65,7 @@ describe 'subtree: ', ->
 			rootComponentInstance = new RootComponent()
 
 		it 'should mount root instance on store', ->
-			mountComponent(store, rootComponentInstance)
+			mountRootComponent(store, rootComponentInstance)
 
 		it 'should print the whole component tree for your viewing pleasure', ->
 			console.log(inspect(rootComponentInstance))

test/03-reducer-indirection.coffee

@@ -4,7 +4,7 @@
 { createStore, applyMiddleware } = require 'redux'
 ReduxDebug = require 'redux-debug'
 ReduxFreeze = require 'redux-freeze'
-{ createClass, mountComponent, SubtreeMixin, createComponent } = require '..'
+{ createClass, mountRootComponent, SubtreeMixin, createComponent } = require '..'
 
 describe 'reducer indirection: ', ->
 	makeAStore = (initialState) -> createStore( ((x) -> x) , initialState, applyMiddleware(ReduxDebug(console.log), ReduxFreeze) )
@@ -45,7 +45,7 @@ describe 'reducer indirection: ', ->
 
 		it 'should mount subcomponent', ->
 			rootComponentInstance = createComponent( { foo: Subcomponent } )
-			mountComponent(store, rootComponentInstance)
+			mountRootComponent(store, rootComponentInstance)
 
 		it 'should print the whole component tree for your viewing pleasure', ->
 			console.log(inspect(rootComponentInstance))

test/04-observable-selectors.coffee

@@ -1,7 +1,7 @@
 { inspect } = require 'util'
 
 { expect, assert } = require 'chai'
-{ createClass, mountComponent, createComponent, ObservableSelectorMixin } = require '..'
+{ createClass, mountRootComponent, createComponent, ObservableSelectorMixin } = require '..'
 { makeAStore } = require './helpers/store'
 
 expectTestSequence = (tests) ->
@@ -48,7 +48,7 @@ describe 'observable selectors: ', ->
 
 		it 'should mount subcomponent', ->
 			rootComponentInstance = createComponent( { foo: Subcomponent } )
-			mountComponent(store, rootComponentInstance)
+			mountRootComponent(store, rootComponentInstance)
 
 		it 'should print the whole component tree for your viewing pleasure', ->
 			console.log(inspect(rootComponentInstance))