fixing bug in inMemory manifests (autodatadirect#68)

example/app/component/ManifestWrapper/index.js

@@ -5,17 +5,19 @@ import definition from './manifest.def'
 import { withState, withHandlers, compose } from 'recompose'
 // import { compileInMemoryResult } from '../../services/manifest'
 
-const onRowClick = (row) => console.log('You clicked the following row: ', row)
+const onRowClick = row => console.log('You clicked the following row: ', row)
 
 const MountUnMountButton = ({toggleVisible}) =>
   <button onClick={toggleVisible}>Click to mount/unmount</button>
 
+// const filterFn = (data, filter) => data.filter(datum => datum.age > 30)
+
 const filter = {search: 'test', id: 123}
 const ManifestWrapper = ({toggleVisible, visible}) => {
   if (!visible) return <MountUnMountButton toggleVisible={toggleVisible} />
   return (
     <div>
-      {/* <Manifest name='testManifest' definition={definition} data={compileInMemoryResult(filter).data} onRowClick={onRowClick} filter={filter} /> */}
+      {/* <Manifest name='testManifestMem' definition={definition} data={compileInMemoryResult(filter).data} onRowClick={onRowClick} filter={filter} filterFn={filterFn} /> */}
       <Manifest name='testManifest' definition={definition} onRowClick={onRowClick} filter={filter} />
       <MountUnMountButton toggleVisible={toggleVisible} />
     </div>

package.json

@@ -28,7 +28,9 @@
     "recompose": "^0.26.0"
   },
   "standard": {
-    "env": [ "mocha" ]
+    "env": [
+      "mocha"
+    ]
   },
   "devDependencies": {
     "@storybook/addon-knobs": "^3.3.15",

src/actions.js

@@ -41,12 +41,13 @@ export const focusRow = (manifestName, id) => {
   }
 }
 
-export const setInMemoryData = (manifestName, data) => {
+export const setInMemoryData = (manifestName, data, filter) => {
   if (!manifestName) throw err('manifest name must be set')
   return {
     type: types.SET_IN_MEMORY_DATA,
     manifestName,
-    data
+    data,
+    filter
   }
 }
 

src/components/Manifest/index.js

@@ -33,31 +33,54 @@ const propsVerification = props => {
   if (!props.name) throw new Error('Manifest name must be provided!')
 }
 
-const countNeeded = filter => filter && !filter.page
+const isFirstPage = filter => filter && filter.page === 0
+
+const isInMemory = ({ inMemoryData }) => inMemoryData && inMemoryData.length
+
+const initializeInMemoryManifest = ({ filterFn, name, inMemoryData, filter, inMemoryDataHasChanged, setInMemoryData }, prevProps) => {
+  if (!prevProps || filterFn !== prevProps.filterFn) {
+    filterFunctions.register(name, filterFn)
+  }
+  if (!prevProps || inMemoryDataHasChanged) {
+    setInMemoryData(name, inMemoryData, filter)
+  }
+}
+
+const initializeManifest = ({ name, filter, autoLoad, refreshCount, refreshData }, prevProps) => {
+  if (prevProps || autoLoad === false) return
+  if (isFirstPage(filter)) {
+    refreshCount(name, filter)
+  }
+  refreshData(name, filter)
+}
+
+const handleFilterChange = ({ name, filter, refreshData }, prevProps) => {
+  if (!prevProps || isEqual(filter, prevProps.filter)) return
+  refreshData(name, filter)
+}
+
+const handlePropChanges = (props, prevProps) => {
+  propsVerification(props)
+
+  if (isInMemory(props)) {
+    initializeInMemoryManifest(props, prevProps)
+  } else {
+    initializeManifest(props, prevProps)
+  }
+  handleFilterChange(props, prevProps)
+}
+
 const lifecycleMethods = {
   componentWillMount () {
-    propsVerification(this.props)
-    if (this.props.inMemoryData && this.props.inMemoryData.length) {
-      this.props.setInMemoryData(this.props.name, this.props.inMemoryData)
-      filterFunctions.register(this.props.name, this.props.filterFn)
-    } else if (this.props.autoLoad !== false) {
-      if (countNeeded(this.props.filter)) {
-        this.props.refreshCount(this.props.name, this.props.filter)
-      }
-      this.props.refreshData(this.props.name, this.props.filter)
-    }
+    handlePropChanges(this.props)
   },
   componentWillUnmount () {
-    filterFunctions.deregister(this.props.name, this.props.filterFn)
-    this.props.destroy(this.props.name)
+    const { name, filterFn, destroy } = this.props
+    filterFunctions.deregister(name, filterFn)
+    destroy(name)
   },
-  componentDidUpdate (prevProps, prevState, prevContext) {
-    if (this.props.inMemoryData && this.prop.inMemoryData.length && this.props.inMemoryDataHasChanged) {
-      this.props.setInMemoryData(this.props.name, this.props.inMemoryData)
-      filterFunctions.register(this.props.name, this.props.filterFn)
-    }
-    if (isEqual(this.props.filter, prevProps.filter)) return
-    this.props.refreshData(this.props.name, this.props.filter)
+  componentDidUpdate (prevProps) {
+    handlePropChanges(this.props, prevProps)
   }
 }