Fix move swap (#14)

* Made move and swap also alter field state

* Upgrade deps

Author: erikras

package-lock.json

@@ -8,9 +8,11 @@ const crossEnv = npsUtils.crossEnv
 module.exports = {
   scripts: {
     test: {
-      default: crossEnv('NODE_ENV=test jest --coverage'),
-      update: crossEnv('NODE_ENV=test jest --coverage --updateSnapshot'),
-      watch: crossEnv('NODE_ENV=test jest --watch'),
+      default: crossEnv('NODE_ENV=test jest --env=node --coverage'),
+      update: crossEnv(
+        'NODE_ENV=test jest --env=node --coverage --updateSnapshot'
+      ),
+      watch: crossEnv('NODE_ENV=test jest --env=node --watch'),
       codeCov: crossEnv(
         'cat ./coverage/lcov.info | ./node_modules/codecov.io/bin/codecov.io.js'
       ),
@@ -71,7 +73,13 @@ module.exports = {
     validate: {
       description:
         'This runs several scripts to make sure things look good before committing or on clean install',
-      default: concurrent.nps('lint', 'flow', 'typescript', 'build.andTest', 'test')
+      default: concurrent.nps(
+        'lint',
+        'flow',
+        'typescript',
+        'build.andTest',
+        'test'
+      )
     }
   },
   options: {

package-scripts.js

@@ -6,14 +6,15 @@
   "jsnext:main": "dist/final-form-arrays.es.js",
   "module": "dist/final-form-arrays.es.js",
   "typings": "dist/index.d.ts",
-  "files": ["dist"],
+  "files": [
+    "dist"
+  ],
   "scripts": {
     "start": "nps",
     "test": "nps test",
     "precommit": "lint-staged && npm start validate"
   },
-  "author":
-    "Erik Rasmussen <[email protected]> (http://github.com/erikras)",
+  "author": "Erik Rasmussen <[email protected]> (http://github.com/erikras)",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -25,43 +26,50 @@
   "homepage": "https://github.com/final-form/final-form-arrays#readme",
   "devDependencies": {
     "babel-eslint": "^8.2.1",
-    "babel-jest": "^22.1.0",
+    "babel-jest": "^23.4.2",
     "babel-plugin-external-helpers": "^6.22.0",
     "babel-plugin-transform-flow-strip-types": "^6.22.0",
     "babel-preset-env": "^1.6.1",
     "babel-preset-stage-2": "^6.24.1",
-    "bundlesize": "^0.15.3",
+    "bundlesize": "^0.17.0",
     "doctoc": "^1.3.0",
-    "eslint": "^4.16.0",
+    "eslint": "^5.4.0",
     "eslint-config-react-app": "^2.1.0",
-    "eslint-plugin-babel": "^4.1.2",
+    "eslint-plugin-babel": "^5.1.0",
     "eslint-plugin-flowtype": "^2.41.0",
     "eslint-plugin-import": "^2.8.0",
     "eslint-plugin-jsx-a11y": "^6.0.3",
     "eslint-plugin-react": "^7.5.1",
     "final-form": "^4.0.4",
-    "flow-bin": "^0.63.1",
+    "flow-bin": "^0.79.1",
+    "glow": "^1.2.2",
     "husky": "^0.14.3",
-    "jest": "^22.1.4",
-    "lint-staged": "^6.0.1",
+    "jest": "^23.5.0",
+    "lint-staged": "^7.2.2",
     "nps": "^5.7.1",
     "nps-utils": "^1.5.0",
     "prettier": "^1.10.2",
     "prettier-eslint-cli": "^4.7.0",
-    "rollup": "^0.55.0",
+    "rollup": "^0.64.1",
     "rollup-plugin-babel": "^3.0.3",
-    "rollup-plugin-commonjs": "^8.2.6",
+    "rollup-plugin-commonjs": "^9.1.5",
     "rollup-plugin-flow": "^1.1.1",
     "rollup-plugin-node-resolve": "^3.0.2",
     "rollup-plugin-replace": "^2.0.0",
-    "rollup-plugin-uglify": "^3.0.0",
-    "typescript": "^2.6.2"
+    "rollup-plugin-uglify": "^4.0.0",
+    "typescript": "^3.0.1"
   },
   "peerDependencies": {
     "final-form": ">=1.2.0"
   },
   "lint-staged": {
-    "*.{js*,ts*,json,md,css}": ["prettier --write", "git add"]
+    "*.{js*,ts*,json,md,css}": [
+      "prettier --write",
+      "git add"
+    ]
+  },
+  "jest": {
+    "testEnvironment": "node"
   },
   "bundlesize": [
     {

package.json

@@ -2,7 +2,7 @@ import resolve from 'rollup-plugin-node-resolve'
 import babel from 'rollup-plugin-babel'
 import flow from 'rollup-plugin-flow'
 import commonjs from 'rollup-plugin-commonjs'
-import uglify from 'rollup-plugin-uglify'
+import { uglify } from 'rollup-plugin-uglify'
 import replace from 'rollup-plugin-replace'
 
 const minify = process.env.MINIFY

rollup.config.js

@@ -1,18 +1,20 @@
 // @flow
 import type { MutableState, Mutator, Tools } from 'final-form'
 
-type Args = [string, number, any]
-
 const insert: Mutator = (
-  [name, index, value]: Args,
+  [name, index, value]: any[],
   state: MutableState,
   { changeValue }: Tools
 ) => {
-  changeValue(state, name, (array: ?(any[])): any[] => {
-    const copy = [...(array || [])]
-    copy.splice(index, 0, value)
-    return copy
-  })
+  changeValue(
+    state,
+    name,
+    (array: ?(any[])): any[] => {
+      const copy = [...(array || [])]
+      copy.splice(index, 0, value)
+      return copy
+    }
+  )
 }
 
 export default insert

src/insert.js

@@ -1,19 +1,61 @@
 // @flow
 import type { MutableState, Mutator, Tools } from 'final-form'
 
-type Args = [string, number, number]
-
 const move: Mutator = (
-  [name, from, to]: Args,
+  [name, from, to]: any[],
   state: MutableState,
   { changeValue }: Tools
 ) => {
-  changeValue(state, name, (array: ?(any[])): any[] => {
-    const copy = [...(array || [])]
-    const value = copy[from]
-    copy.splice(from, 1)
-    copy.splice(to, 0, value)
-    return copy
+  if (from === to) {
+    return
+  }
+  changeValue(
+    state,
+    name,
+    (array: ?(any[])): any[] => {
+      const copy = [...(array || [])]
+      const value = copy[from]
+      copy.splice(from, 1)
+      copy.splice(to, 0, value)
+      return copy
+    }
+  )
+  const fromPrefix = `${name}[${from}]`
+  Object.keys(state.fields).forEach(key => {
+    if (key.substring(0, fromPrefix.length) === fromPrefix) {
+      const suffix = key.substring(fromPrefix.length)
+      const fromKey = fromPrefix + suffix
+      const backup = state.fields[fromKey]
+      if (from < to) {
+        // moving to a higher index
+        // decrement all indices between from and to
+        for (let i = from; i < to; i++) {
+          const destKey = `${name}[${i}]${suffix}`
+          state.fields[destKey] = {
+            ...state.fields[`${name}[${i + 1}]${suffix}`],
+            name: destKey,
+            lastFieldState: undefined // clearing lastFieldState forces renotification
+          }
+        }
+      } else {
+        // moving to a lower index
+        // increment all indices between to and from
+        for (let i = from; i > to; i--) {
+          const destKey = `${name}[${i}]${suffix}`
+          state.fields[destKey] = {
+            ...state.fields[`${name}[${i - 1}]${suffix}`],
+            name: destKey,
+            lastFieldState: undefined // clearing lastFieldState forces renotification
+          }
+        }
+      }
+      const toKey = `${name}[${to}]${suffix}`
+      state.fields[toKey] = {
+        ...backup,
+        name: toKey,
+        lastFieldState: undefined // clearing lastFieldState forces renotification
+      }
+    }
   })
 }