1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
next.js/lib/side-effect.js

87 lines
2.4 KiB
JavaScript
Raw Normal View History

2016-10-07 01:57:31 +00:00
import React, { Component } from 'react'
2017-06-19 13:03:02 +00:00
import { getDisplayName } from './utils'
2016-10-07 01:57:31 +00:00
export default function withSideEffect (reduceComponentsToState, handleStateChangeOnClient, mapStateOnServer) {
if (typeof reduceComponentsToState !== 'function') {
throw new Error('Expected reduceComponentsToState to be a function.')
}
if (typeof handleStateChangeOnClient !== 'function') {
throw new Error('Expected handleStateChangeOnClient to be a function.')
}
if (typeof mapStateOnServer !== 'undefined' && typeof mapStateOnServer !== 'function') {
throw new Error('Expected mapStateOnServer to either be undefined or a function.')
}
return function wrap (WrappedComponent) {
if (typeof WrappedComponent !== 'function') {
throw new Error('Expected WrappedComponent to be a React component.')
}
const mountedInstances = new Set()
let state
function emitChange (component) {
state = reduceComponentsToState([...mountedInstances])
if (SideEffect.canUseDOM) {
handleStateChangeOnClient.call(component, state)
} else if (mapStateOnServer) {
state = mapStateOnServer(state)
}
}
class SideEffect extends Component {
// Expose canUseDOM so tests can monkeypatch it
static canUseDOM = typeof window !== 'undefined'
2016-10-07 01:57:31 +00:00
static contextTypes = WrappedComponent.contextTypes
// Try to use displayName of wrapped component
static displayName = `SideEffect(${getDisplayName(WrappedComponent)})`
2016-10-07 01:57:31 +00:00
static peek () {
return state
}
static rewind () {
if (SideEffect.canUseDOM) {
throw new Error('You may only call rewind() on the server. Call peek() to read the current state.')
}
const recordedState = state
state = undefined
mountedInstances.clear()
return recordedState
}
constructor (props) {
super(props)
if (!SideEffect.canUseDOM) {
mountedInstances.add(this)
emitChange(this)
}
}
componentDidMount () {
mountedInstances.add(this)
emitChange(this)
2016-10-07 01:57:31 +00:00
}
componentDidUpdate () {
2016-10-07 01:57:31 +00:00
emitChange(this)
}
componentWillUnmount () {
mountedInstances.delete(this)
emitChange(this)
}
2016-10-07 01:57:31 +00:00
render () {
return <WrappedComponent>{ this.props.children }</WrappedComponent>
}
}
return SideEffect
}
}