Merge branch 'release/v0.24.1'

lib/basic/lazy-data.spec.ts

@@ -61,21 +61,7 @@ describe('useLazyData', () => {
       margin: 2,
     })
     setSize(20)
-    const r = setVisible(3, 2)
-    expect(r).toMatchInlineSnapshot(`
-      {
-        "allChunksToLoad": [
-          0,
-          1,
-          2,
-          3,
-        ],
-        "fromChunk": 0,
-        "fromIndex": 1,
-        "toChunk": 3,
-        "toIndex": 7,
-      }
-    `)
+    setVisible(3, 2)
 
     await sleep(100)
 
@@ -104,19 +90,7 @@ describe('useLazyData', () => {
       ]
     `)
 
-    const r2 = setVisible(4, 2)
-    expect(r2).toMatchInlineSnapshot(`
-      {
-        "allChunksToLoad": [
-          4,
-        ],
-        "fromChunk": 1,
-        "fromIndex": 2,
-        "toChunk": 4,
-        "toIndex": 8,
-      }
-    `)
-
+    setVisible(4, 2)
     await sleep(100)
 
     expect(data).toMatchInlineSnapshot(`

lib/basic/lazy-data.ts

@@ -25,47 +25,59 @@ export function useLazyData<T>(opt: Config<T>) {
   let iteration = 0
   let dataSize = 0
   const data = opt.data ?? reactive<(T | null)[]>([])
-  const chunks: Record<number, ChunkStatus | undefined> = {}
+  let chunks: Record<number, ChunkStatus | undefined> = {}
 
-  function reload() {
+  let currentOffset = 0
+  let currentLength = 0
+
+  function setup() {
     iteration++
     arrayEmptyInPlace(data)
     const newData = createArray(dataSize) as (T | null)[]
     data.push(...newData as any)
+    chunks = {}
   }
 
   function setSize(size: number) {
     dataSize = size
-    reload()
+    setup()
   }
 
   if (size > 0)
     setSize(size)
 
   function setVisible(fromPos: number, length: number) {
+    currentOffset = fromPos
+    currentLength = length
+
     const toPos = fromPos + length
-    // log.assert(fromPos <= toPos, 'fromPos must be less than or equal to toPos')
     const fromIndex = Math.max(0, fromPos - margin)
     const toIndex = Math.min(dataSize, toPos + margin)
     const fromChunk = Math.floor(fromIndex / chunkSize)
     const toChunk = Math.floor(toIndex / chunkSize)
 
-    const allChunksToLoad: number[] = []
-
-    let chunksToLoad: number[] = []
+    let nextChunksToLoad: number[] = []
 
     function flush() {
-      if (chunksToLoad.length === 0)
+      // Make a copy of the chunks to load
+      if (nextChunksToLoad.length === 0)
         return
-      const loading = [...chunksToLoad]
-      allChunksToLoad.push(...loading)
-      chunksToLoad = []
+      const loading = [...nextChunksToLoad]
+      nextChunksToLoad = []
 
       const fromIndex = loading[0] * chunkSize
       const itemCount = (loading[loading.length - 1] - loading[0] + 1) * chunkSize
 
+      const currentIteration = iteration
+
       onFetch(fromIndex, itemCount).then((values) => {
         log('Loaded', fromIndex, itemCount, values)
+
+        // Still the same context?
+        if (iteration !== currentIteration)
+          return
+
+        // Apply the values
         loading.forEach(i => chunks[i] = ChunkStatus.Loaded)
         for (let i = 0; i < itemCount; i++) {
           data[fromIndex + i] = values[i] as any
@@ -79,22 +91,19 @@ export function useLazyData<T>(opt: Config<T>) {
       const chunk = chunks[i]
       if (chunk == null) {
         chunks[i] = ChunkStatus.Loading
-        chunksToLoad.push(i)
+        nextChunksToLoad.push(i)
       }
       else {
         flush()
       }
     }
 
     flush()
+  }
 
-    return {
-      fromIndex,
-      toIndex,
-      fromChunk,
-      toChunk,
-      allChunksToLoad,
-    }
+  function reload() {
+    setup()
+    setVisible(currentOffset, currentLength)
   }
 
   return {

package.json

@@ -1,7 +1,7 @@
 {
   "name": "oui-kit",
   "type": "module",
-  "version": "0.24.0",
+  "version": "0.24.1",
   "author": {
     "email": "dirk.holtwick@gmail.com",
     "name": "Dirk Holtwick",