@statezero/core 0.1.32 → 0.1.34
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/adaptors/react/composables.d.ts +0 -1
- package/dist/adaptors/react/composables.js +2 -54
- package/dist/adaptors/react/index.d.ts +1 -2
- package/dist/adaptors/react/index.js +1 -5
- package/dist/adaptors/vue/reactivity.js +20 -7
- package/package.json +1 -1
- package/dist/adaptors/react/reactivity.d.ts +0 -22
- package/dist/adaptors/react/reactivity.js +0 -145
|
@@ -1,56 +1,4 @@
|
|
|
1
|
-
import { useState, useEffect, useRef } from "react";
|
|
2
|
-
import { syncManager } from "../../syncEngine/sync";
|
|
3
|
-
import { v7 } from "uuid";
|
|
4
|
-
syncManager.followAllQuerysets = false;
|
|
5
|
-
export const querysets = new Map(); // Map of composableId -> queryset
|
|
6
|
-
function updateSyncManager() {
|
|
7
|
-
// Get unique querysets from all active composables
|
|
8
|
-
const uniqueQuerysets = new Set(querysets.values());
|
|
9
|
-
syncManager.followedQuerysets = uniqueQuerysets;
|
|
10
|
-
}
|
|
11
1
|
export function useQueryset(querysetFactory) {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
const lastSemanticKeyRef = useRef(null);
|
|
15
|
-
const [, forceUpdate] = useState(0);
|
|
16
|
-
// Generate the queryset
|
|
17
|
-
const result = querysetFactory();
|
|
18
|
-
const original = result?.original || result;
|
|
19
|
-
const queryset = original?.queryset || original;
|
|
20
|
-
// Update tracking if queryset changed (compare by semantic key for stability)
|
|
21
|
-
const semanticKey = queryset?.semanticKey;
|
|
22
|
-
const lastSemanticKeyRef = useRef(null);
|
|
23
|
-
useEffect(() => {
|
|
24
|
-
if (lastSemanticKeyRef.current !== semanticKey) {
|
|
25
|
-
querysets.set(composableIdRef.current, queryset);
|
|
26
|
-
updateSyncManager();
|
|
27
|
-
lastSemanticKeyRef.current = semanticKey;
|
|
28
|
-
lastQuerysetRef.current = queryset;
|
|
29
|
-
}
|
|
30
|
-
}, [semanticKey, queryset]);
|
|
31
|
-
// Cleanup on unmount
|
|
32
|
-
useEffect(() => {
|
|
33
|
-
const composableId = composableIdRef.current;
|
|
34
|
-
return () => {
|
|
35
|
-
querysets.delete(composableId);
|
|
36
|
-
updateSyncManager();
|
|
37
|
-
};
|
|
38
|
-
}, []);
|
|
39
|
-
// Force re-render when queryset updates
|
|
40
|
-
useEffect(() => {
|
|
41
|
-
if (!result)
|
|
42
|
-
return;
|
|
43
|
-
// This will be triggered by the QuerySetAdaptor when data changes
|
|
44
|
-
const handleUpdate = () => {
|
|
45
|
-
forceUpdate((x) => x + 1);
|
|
46
|
-
};
|
|
47
|
-
// Attach update listener to the wrapped queryset (unconditionally)
|
|
48
|
-
result._reactUpdateHandler = handleUpdate;
|
|
49
|
-
return () => {
|
|
50
|
-
if (result) {
|
|
51
|
-
result._reactUpdateHandler = null;
|
|
52
|
-
}
|
|
53
|
-
};
|
|
54
|
-
}, [result]);
|
|
55
|
-
return result;
|
|
2
|
+
console.warn("React environments are not currently supported");
|
|
3
|
+
return querysetFactory;
|
|
56
4
|
}
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
export { useQueryset
|
|
2
|
-
export { ModelAdaptor, QuerySetAdaptor, MetricAdaptor } from "./reactivity.js";
|
|
1
|
+
export { useQueryset } from "./composables.js";
|
|
@@ -1,5 +1 @@
|
|
|
1
|
-
export { useQueryset
|
|
2
|
-
export { ModelAdaptor, QuerySetAdaptor, MetricAdaptor } from "./reactivity.js";
|
|
3
|
-
// src/react-entry.js
|
|
4
|
-
import { ModelAdaptor, QuerySetAdaptor, MetricAdaptor, useQueryset, querysets, } from "./adaptors/react/index.js";
|
|
5
|
-
export { ModelAdaptor, QuerySetAdaptor, MetricAdaptor, useQueryset, querysets };
|
|
1
|
+
export { useQueryset } from './composables.js';
|
|
@@ -57,7 +57,17 @@ export function QuerySetAdaptor(liveQuerySet, reactivityFn = reactive) {
|
|
|
57
57
|
const cacheKey = queryset.semanticKey;
|
|
58
58
|
// Check the cache first
|
|
59
59
|
if (cacheKey && wrappedQuerysetCache.has(cacheKey)) {
|
|
60
|
-
|
|
60
|
+
const cachedWrapper = wrappedQuerysetCache.get(cacheKey);
|
|
61
|
+
// Refresh the cached wrapper with current data
|
|
62
|
+
const freshData = [...liveQuerySet];
|
|
63
|
+
if (reactivityFn === ref) {
|
|
64
|
+
cachedWrapper.value = freshData;
|
|
65
|
+
}
|
|
66
|
+
else {
|
|
67
|
+
cachedWrapper.splice(0, cachedWrapper.length);
|
|
68
|
+
cachedWrapper.push(...freshData);
|
|
69
|
+
}
|
|
70
|
+
return cachedWrapper;
|
|
61
71
|
}
|
|
62
72
|
const querysetAst = queryset.build();
|
|
63
73
|
// Make the queryset reactive using the specified function
|
|
@@ -79,10 +89,10 @@ export function QuerySetAdaptor(liveQuerySet, reactivityFn = reactive) {
|
|
|
79
89
|
// Subscribe to queryset events indefinitely
|
|
80
90
|
querysetEventEmitter.on(eventName, renderHandler);
|
|
81
91
|
/* Dont delete the innocuous looking queryset.length check. There is some weird interaction
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
92
|
+
with vue, where when we load an empty queryset from the cache, the reactivity completely breaks.
|
|
93
|
+
I wasted over 2 days on this bug, and it won't show up in the e2e tests because it just impacts the
|
|
94
|
+
vue reactivity. If this causes performance issues, and needs to be refactored. Make sure you understand
|
|
95
|
+
the vue reactivity interaction correctly and find a different way to fix the broken reactivity for empty querysets */
|
|
86
96
|
if (cacheKey && liveQuerySet && liveQuerySet.length > 0) {
|
|
87
97
|
wrappedQuerysetCache.set(cacheKey, wrapper);
|
|
88
98
|
}
|
|
@@ -98,7 +108,10 @@ export function MetricAdaptor(metric) {
|
|
|
98
108
|
const cacheKey = `${configKey}::${modelName}::${metric.metricType}::${metric.field}::${hash(querysetAst)}`;
|
|
99
109
|
// Check the cache first
|
|
100
110
|
if (cacheKey && wrappedMetricCache.has(cacheKey)) {
|
|
101
|
-
|
|
111
|
+
const cachedWrapper = wrappedMetricCache.get(cacheKey);
|
|
112
|
+
// Refresh the cached wrapper with current metric value
|
|
113
|
+
cachedWrapper.value = metric.value;
|
|
114
|
+
return cachedWrapper;
|
|
102
115
|
}
|
|
103
116
|
// Create a reactive reference with the initial value
|
|
104
117
|
const wrapper = ref(metric.value);
|
|
@@ -116,7 +129,7 @@ export function MetricAdaptor(metric) {
|
|
|
116
129
|
}
|
|
117
130
|
};
|
|
118
131
|
// Only listen for metric render events
|
|
119
|
-
metricEventEmitter.on(
|
|
132
|
+
metricEventEmitter.on("metric::render", metricRenderHandler);
|
|
120
133
|
// Store in cache
|
|
121
134
|
if (cacheKey) {
|
|
122
135
|
wrappedMetricCache.set(cacheKey, wrapper);
|
package/package.json
CHANGED
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Adapts a model instance for React by wrapping it with event listeners
|
|
3
|
-
* that trigger React re-renders when the model updates.
|
|
4
|
-
*
|
|
5
|
-
* @param {Object} modelInstance - An instance of a model class with static modelName and primaryKeyField
|
|
6
|
-
* @returns {Object} The model instance with React update capabilities
|
|
7
|
-
*/
|
|
8
|
-
export function ModelAdaptor(modelInstance: Object): Object;
|
|
9
|
-
/**
|
|
10
|
-
* Adapts a queryset for React and sets up event handling for queryset updates
|
|
11
|
-
*
|
|
12
|
-
* @param {Object} liveQuerySet - A LiveQueryset instance
|
|
13
|
-
* @returns {Array} The reactive queryset array
|
|
14
|
-
*/
|
|
15
|
-
export function QuerySetAdaptor(liveQuerySet: Object): any[];
|
|
16
|
-
/**
|
|
17
|
-
* Adapts a metric for React and sets up event handling for metric updates
|
|
18
|
-
*
|
|
19
|
-
* @param {Object} metric - A metric instance
|
|
20
|
-
* @returns {Object} The reactive metric wrapper
|
|
21
|
-
*/
|
|
22
|
-
export function MetricAdaptor(metric: Object): Object;
|
|
@@ -1,145 +0,0 @@
|
|
|
1
|
-
import { modelEventEmitter, querysetEventEmitter, metricEventEmitter, } from "../../syncEngine/stores/reactivity.js";
|
|
2
|
-
import { initEventHandler } from "../../syncEngine/stores/operationEventHandlers.js";
|
|
3
|
-
import { isEqual, isNil } from "lodash-es";
|
|
4
|
-
import hash from "object-hash";
|
|
5
|
-
initEventHandler(); // Initialize event handler for model events
|
|
6
|
-
const wrappedQuerysetCache = new Map();
|
|
7
|
-
const wrappedMetricCache = new Map();
|
|
8
|
-
/**
|
|
9
|
-
* Adapts a model instance for React by wrapping it with event listeners
|
|
10
|
-
* that trigger React re-renders when the model updates.
|
|
11
|
-
*
|
|
12
|
-
* @param {Object} modelInstance - An instance of a model class with static modelName and primaryKeyField
|
|
13
|
-
* @returns {Object} The model instance with React update capabilities
|
|
14
|
-
*/
|
|
15
|
-
export function ModelAdaptor(modelInstance) {
|
|
16
|
-
const modelClass = modelInstance.constructor;
|
|
17
|
-
const modelName = modelClass.modelName;
|
|
18
|
-
const configKey = modelClass.configKey;
|
|
19
|
-
const pkField = modelClass.primaryKeyField;
|
|
20
|
-
// Create a wrapper that maintains the original instance
|
|
21
|
-
const wrapper = Object.create(modelInstance);
|
|
22
|
-
wrapper._reactUpdateHandler = null;
|
|
23
|
-
wrapper._reactVersion = 0;
|
|
24
|
-
const eventName = `${configKey}::${modelName}::render`;
|
|
25
|
-
// Handler triggers React update when this instance updates
|
|
26
|
-
const renderHandler = (eventData) => {
|
|
27
|
-
if (eventData.pk === modelInstance[pkField]) {
|
|
28
|
-
wrapper._reactVersion++;
|
|
29
|
-
if (wrapper._reactUpdateHandler) {
|
|
30
|
-
wrapper._reactUpdateHandler();
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
};
|
|
34
|
-
// Subscribe to model events indefinitely
|
|
35
|
-
modelEventEmitter.on(eventName, renderHandler);
|
|
36
|
-
// Store the cleanup function
|
|
37
|
-
wrapper._cleanup = () => {
|
|
38
|
-
modelEventEmitter.off(eventName, renderHandler);
|
|
39
|
-
};
|
|
40
|
-
return wrapper;
|
|
41
|
-
}
|
|
42
|
-
/**
|
|
43
|
-
* Adapts a queryset for React and sets up event handling for queryset updates
|
|
44
|
-
*
|
|
45
|
-
* @param {Object} liveQuerySet - A LiveQueryset instance
|
|
46
|
-
* @returns {Array} The reactive queryset array
|
|
47
|
-
*/
|
|
48
|
-
export function QuerySetAdaptor(liveQuerySet) {
|
|
49
|
-
const queryset = liveQuerySet?.queryset;
|
|
50
|
-
const modelName = queryset?.ModelClass?.modelName;
|
|
51
|
-
const configKey = queryset?.ModelClass?.configKey;
|
|
52
|
-
if (isNil(queryset) || isNil(modelName)) {
|
|
53
|
-
throw new Error(`liveQuerySet ${JSON.stringify(liveQuerySet)} had null qs: ${queryset} or model: ${modelName}`);
|
|
54
|
-
}
|
|
55
|
-
// Use the semantic key if available
|
|
56
|
-
const cacheKey = queryset.semanticKey;
|
|
57
|
-
// Check the cache first
|
|
58
|
-
if (cacheKey && wrappedQuerysetCache.has(cacheKey)) {
|
|
59
|
-
return wrappedQuerysetCache.get(cacheKey);
|
|
60
|
-
}
|
|
61
|
-
const querysetAst = queryset.build();
|
|
62
|
-
// Create wrapper array that extends the live queryset
|
|
63
|
-
const wrapper = [...liveQuerySet];
|
|
64
|
-
wrapper.original = liveQuerySet;
|
|
65
|
-
wrapper._reactUpdateHandler = null;
|
|
66
|
-
wrapper._reactVersion = 0;
|
|
67
|
-
const eventName = `${configKey}::${modelName}::queryset::render`;
|
|
68
|
-
// Handler updates array and triggers React update when this queryset updates
|
|
69
|
-
const renderHandler = (eventData) => {
|
|
70
|
-
if (eventData && eventData.ast && isEqual(querysetAst, eventData.ast)) {
|
|
71
|
-
// Update the wrapper array
|
|
72
|
-
wrapper.length = 0;
|
|
73
|
-
wrapper.push(...liveQuerySet);
|
|
74
|
-
wrapper._reactVersion++;
|
|
75
|
-
// Trigger React update if handler is set
|
|
76
|
-
if (wrapper._reactUpdateHandler) {
|
|
77
|
-
wrapper._reactUpdateHandler();
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
};
|
|
81
|
-
// Subscribe to queryset events indefinitely
|
|
82
|
-
querysetEventEmitter.on(eventName, renderHandler);
|
|
83
|
-
// Store cleanup function
|
|
84
|
-
wrapper._cleanup = () => {
|
|
85
|
-
querysetEventEmitter.off(eventName, renderHandler);
|
|
86
|
-
};
|
|
87
|
-
// Cache if not empty (following Vue's pattern for stability)
|
|
88
|
-
if (cacheKey && liveQuerySet && liveQuerySet.length > 0) {
|
|
89
|
-
wrappedQuerysetCache.set(cacheKey, wrapper);
|
|
90
|
-
}
|
|
91
|
-
return wrapper;
|
|
92
|
-
}
|
|
93
|
-
/**
|
|
94
|
-
* Adapts a metric for React and sets up event handling for metric updates
|
|
95
|
-
*
|
|
96
|
-
* @param {Object} metric - A metric instance
|
|
97
|
-
* @returns {Object} The reactive metric wrapper
|
|
98
|
-
*/
|
|
99
|
-
export function MetricAdaptor(metric) {
|
|
100
|
-
const queryset = metric.queryset;
|
|
101
|
-
const modelName = queryset?.ModelClass?.modelName;
|
|
102
|
-
const configKey = queryset?.ModelClass?.configKey;
|
|
103
|
-
const querysetAst = queryset.build();
|
|
104
|
-
// Create a cache key based on metric properties
|
|
105
|
-
const cacheKey = `${configKey}::${modelName}::${metric.metricType}::${metric.field}::${hash(querysetAst)}`;
|
|
106
|
-
// Check the cache first
|
|
107
|
-
if (cacheKey && wrappedMetricCache.has(cacheKey)) {
|
|
108
|
-
return wrappedMetricCache.get(cacheKey);
|
|
109
|
-
}
|
|
110
|
-
// Create a wrapper object that maintains the metric value
|
|
111
|
-
const wrapper = {
|
|
112
|
-
value: metric.value,
|
|
113
|
-
original: metric,
|
|
114
|
-
_reactUpdateHandler: null,
|
|
115
|
-
_reactVersion: 0,
|
|
116
|
-
};
|
|
117
|
-
// Single handler for metric render events
|
|
118
|
-
const metricRenderHandler = (eventData) => {
|
|
119
|
-
// Only update if this event is for our metric
|
|
120
|
-
if (eventData.metricType === metric.metricType &&
|
|
121
|
-
eventData.ModelClass === metric.queryset.ModelClass &&
|
|
122
|
-
eventData.field === metric.field &&
|
|
123
|
-
eventData.ast === hash(querysetAst) &&
|
|
124
|
-
eventData.valueChanged === true) {
|
|
125
|
-
// Update the wrapper value with the latest metric value
|
|
126
|
-
wrapper.value = metric.value;
|
|
127
|
-
wrapper._reactVersion++;
|
|
128
|
-
// Trigger React update if handler is set
|
|
129
|
-
if (wrapper._reactUpdateHandler) {
|
|
130
|
-
wrapper._reactUpdateHandler();
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
};
|
|
134
|
-
// Only listen for metric render events
|
|
135
|
-
metricEventEmitter.on("metric::render", metricRenderHandler);
|
|
136
|
-
// Store cleanup function
|
|
137
|
-
wrapper._cleanup = () => {
|
|
138
|
-
metricEventEmitter.off("metric::render", metricRenderHandler);
|
|
139
|
-
};
|
|
140
|
-
// Store in cache
|
|
141
|
-
if (cacheKey) {
|
|
142
|
-
wrappedMetricCache.set(cacheKey, wrapper);
|
|
143
|
-
}
|
|
144
|
-
return wrapper;
|
|
145
|
-
}
|