Remember state of SortModal properties

src/components/modals/SortModal.svelte

@@ -1,19 +1,23 @@
 <svelte:options immutable={true} />
 
 <script>
-  import { getContext } from 'svelte'
+  import { getContext, setContext, onDestroy } from 'svelte'
   import Select from 'svelte-select'
   import Header from './Header.svelte'
   import { getNestedPaths } from '../../utils/arrayUtils.js'
   import { isObject } from '../../utils/typeUtils.js'
   import { stringifyPath } from '../../utils/pathUtils.js'
   import { sortArray, sortObjectKeys } from '../../logic/sort.js'
+  import { sortModalState } from './sortModalState.js'
+import { compileJSONPointer } from '../../utils/jsonPointer';
 
+  export let id
   export let json
   export let rootPath
   export let onSort
 
   const {close} = getContext('simple-modal')
+  const stateId = `${id}:${compileJSONPointer(rootPath)}`
 
   $: json
   $: jsonIsArray = Array.isArray(json)
@@ -28,10 +32,10 @@
     value: -1,
     label: 'descending'
   }
-  const directions = [ asc, desc ]
+  const directions = [asc, desc]
 
-  let selectedProperty = undefined
-  let selectedDirection = asc
+  let selectedProperty = sortModalState[stateId]?.selectedProperty || undefined
+  let selectedDirection = sortModalState[stateId]?.selectedDirection || asc
 
   $: {
     // if there is only one option, select it and do not render the select box
@@ -48,7 +52,12 @@
   }
 
   function handleSort () {
-    // TODO: create a sortBy which returns a JSONPatch document containing move operations
+    // remember the selected values for the next time we open the SortModal
+    // just in memory, not persisted
+    sortModalState[stateId] = {
+      selectedProperty,
+      selectedDirection
+    }
 
     if (jsonIsArray) {
       if (!selectedProperty) {

src/components/modals/sortModalState.js

@@ -0,0 +1 @@
+export const sortModalState = {}

src/components/treemode/TreeMode.svelte

@@ -31,7 +31,7 @@
   import { keyComboFromEvent } from '../../utils/keyBindings.js'
   import { search, searchNext, searchPrevious } from '../../logic/search.js'
   import { immutableJSONPatch } from '../../utils/immutableJSONPatch'
-  import { first, last, initial, cloneDeep } from 'lodash-es'
+  import { first, last, initial, cloneDeep, uniqueId } from 'lodash-es'
   import jump from '../../assets/jump.js/src/jump.js'
   import { expandPath, syncState, patchProps } from '../../logic/documentState.js'
   import Menu from './Menu.svelte'
@@ -42,6 +42,7 @@
   import TransformModal from '../modals/TransformModal.svelte'
 
   const { open } = getContext('simple-modal')
+  const sortModalId = uniqueId()
 
   let divContents
   let domHiddenInput
@@ -270,6 +271,7 @@
       : []
 
     open(SortModal, {
+      id: sortModalId,
       json: getIn(doc, rootPath),
       rootPath,
       onSort: async (operations) => {

src/logic/sort.js

@@ -25,12 +25,7 @@ export function sortObjectKeys (object, rootPath = [], direction = 1) {
     return direction * caseInsensitiveNaturalCompare(keyA, keyB)
   })
 
-  // const sortedObject = {}
-  // keys.forEach(key => {
-  //   sortedObject[key] = object[key]
-  // })
-
-  // TODO: only move the properties that are needed to move
+  // TODO: can we make this more efficient? check if the first couple of keys are already in order and if so ignore them
   const operations = []
   for (let i = 0; i < sortedKeys.length; i++) {
     const key = sortedKeys[i]

src/utils/uniqueId.js

@@ -0,0 +1,7 @@
+
+let id = 0
+
+export function uniqueId () {
+  id++
+  return id
+}