@live-change/vue3-components 0.2.29 → 0.2.31

package/logic/data.js

@@ -37,6 +37,7 @@ export function validateData(definition, data, validationType = 'validation',
       if(error) return error
     }
   }
+  if(!data) return undefined // No data, no errors, nonEmpty validator was already checked
   if(definition.properties) {
     const propertyErrors = {}
     for(let name in definition.properties) {

package/logic/synchronized.js

@@ -1,5 +1,5 @@
 import { computed, ref, watch } from "vue"
-import { useThrottleFn } from "@vueuse/core"
+import { useThrottleFn, useDebounceFn } from "@vueuse/core"
 
 function copy(value) {
   let res = JSON.parse(JSON.stringify(value || {}))
@@ -23,7 +23,8 @@ function synchronized(options) {
     onSaveError = (e) => { console.error("SAVE ERROR", e) },
     resetOnError = true,
     recursive = false,
-    throttle = 300,
+    throttle = 0,
+    debounce = 300,
     autoSave = true
   } = options
   if(!source) throw new Error('source must be defined')
@@ -61,11 +62,16 @@ function synchronized(options) {
       }
       return true
     }
-    const throttledSave = throttle ? useThrottleFn(save, throttle) : save
+    const throttledSave = debounce ? () => {} : (throttle ? useThrottleFn(save, throttle) : save)
+    const debouncedSave = debounce ? useDebounceFn(save, throttle)
+        : (throttle ? useDebounceFn(save, throttle) : () => {}) // debounce after throttle
     watch(() => synchronizedJSON.value, json => {
       lastLocalUpdate.value = timeSource()
       onChange()
-      if(autoSave) throttledSave()
+      if(autoSave) {
+        throttledSave()
+        debouncedSave()
+      }
     })
     //console.log("WATCH SOURCE VALUE", source.value)
     watch(() => JSON.stringify(source.value), sourceJson => {
@@ -101,7 +107,9 @@ function synchronized(options) {
       }
       return true
     }
-    const throttledSave = throttle ? useThrottleFn(save, throttle) : save
+    const throttledSave = debounce ? () => {} : (throttle ? useThrottleFn(save, throttle) : save)
+    const debouncedSave = debounce ? useDebounceFn(save, throttle)
+        : (throttle ? useDebounceFn(save, throttle) : () => {}) // debounce after throttle
     const synchronizedComputed = computed({
       get: () => {
         const localTime = ((local.value && local.value[timeField]) ?? '')
@@ -111,7 +119,10 @@ function synchronized(options) {
       set: newValue => {
         local.value = { ...newValue, [timeField]: timeSource() }
         onChange()
-        if(autoSave) throttledSave()
+        if(autoSave) {
+          throttledSave()
+          debouncedSave()
+        }
       }
     })
     return { value: synchronizedComputed, save, changed }

package/logic/synchronizedList.js

@@ -45,6 +45,7 @@ function synchronizedList(options) {
     move: moveAction,
     identifiers = {},
     objectIdentifiers = object => ({ id: object.id }),
+    prefix = '',
     timeField = 'lastUpdate',
     timeSource = () => (new Date()).toISOString(),
     onChange = () => {},
@@ -114,14 +115,15 @@ function synchronizedList(options) {
           return createSynchronizedElement(locallyAddedElement)
         }
       }, synchronizedList.value, source.value || [], locallyAdded.value, locallyDeleted.value)
-    if(obsoleteLocallyAdded.length > 0) {
+    console.log("OBSOLETE", obsoleteLocallyAdded, obsoleteLocallyDeleted)
+    if(obsoleteLocallyAdded.size > 0) {
       locallyAdded.value = locallyAdded.value.filter(
-        locallyAddedElement => obsoleteLocallyAdded.has(locallyAddedElement.id)
+        locallyAddedElement => !obsoleteLocallyAdded.has(locallyAddedElement.id)
       )
     }
-    if(obsoleteLocallyDeleted.length > 0) {
+    if(obsoleteLocallyDeleted.size > 0) {
       locallyDeleted.value = locallyDeleted.value.filter(
-        locallyDeletedElement => obsoleteLocallyDeleted.has(locallyDeletedElement.id)
+        locallyDeletedElement => !obsoleteLocallyDeleted.has(locallyDeletedElement.id)
       )
     }
     synchronizedList.value = newSynchronized
@@ -142,8 +144,12 @@ function synchronizedList(options) {
   }
 
   async function insert(element) {
-    locallyAdded.value.push(element)
-    await insertAction({ ...element, [timeField]: timeSource(), ...identifiers })
+    locallyAdded.value.push({
+      ...element,
+      to: element.id,
+      id: prefix + element.id
+    })
+    await insertAction({ ...element, [timeField]: timeSource(), ...identifiers, ...objectIdentifiers(element) })
   }
 
   async function deleteElement(element) {
@@ -157,7 +163,7 @@ function synchronizedList(options) {
   }
 
   const synchronizedValue = computed(() => synchronizedList.value.map(synchronizedElement => synchronizedElement.value))
-  return { value: synchronizedValue, save, changed, insert, delete: deleteElement, move }
+  return { value: synchronizedValue, save, changed, insert, delete: deleteElement, move, locallyAdded }
 }
 
 export default synchronizedList

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@live-change/vue3-components",
-  "version": "0.2.29",
+  "version": "0.2.31",
   "description": "Live Change Framework - vue components",
   "main": "index.js",
   "scripts": {
@@ -21,10 +21,10 @@
   },
   "homepage": "https://github.com/live-change/live-change-framework-vue3",
   "dependencies": {
-    "@live-change/vue3-ssr": "^0.2.29",
+    "@live-change/vue3-ssr": "^0.2.31",
     "debug": "^4.3.4",
     "mitt": "3.0.0",
     "vue": "^3.2.47"
   },
-  "gitHead": "6f961aa0e9530f74081590a60d3d8323e2a3781a"
+  "gitHead": "5a36954b2ff7c5ec81fbbddb4d017d9127488540"
 }