@arrai-innovations/reactive-helpers 19.0.0 → 20.0.1
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/README.md +44 -53
- package/config/commonCrud.js +9 -9
- package/config/listCrud.js +24 -26
- package/config/objectCrud.js +29 -29
- package/package.json +3 -3
- package/types/config/commonCrud.d.ts +5 -5
- package/types/config/commonCrud.d.ts.map +1 -1
- package/types/config/listCrud.d.ts +25 -33
- package/types/config/listCrud.d.ts.map +1 -1
- package/types/config/objectCrud.d.ts +35 -35
- package/types/config/objectCrud.d.ts.map +1 -1
- package/types/use/cancellableIntent.d.ts +43 -7
- package/types/use/cancellableIntent.d.ts.map +1 -1
- package/types/use/list.d.ts +8 -12
- package/types/use/list.d.ts.map +1 -1
- package/types/use/listCalculated.d.ts +2 -3
- package/types/use/listCalculated.d.ts.map +1 -1
- package/types/use/listInstance.d.ts +18 -31
- package/types/use/listInstance.d.ts.map +1 -1
- package/types/use/listKeys.d.ts.map +1 -1
- package/types/use/listRelated.d.ts +2 -5
- package/types/use/listRelated.d.ts.map +1 -1
- package/types/use/listSort.d.ts +2 -3
- package/types/use/listSort.d.ts.map +1 -1
- package/types/use/listSubscription.d.ts +3 -6
- package/types/use/listSubscription.d.ts.map +1 -1
- package/types/use/object.d.ts +4 -4
- package/types/use/object.d.ts.map +1 -1
- package/types/use/objectCalculated.d.ts +2 -2
- package/types/use/objectInstance.d.ts +19 -19
- package/types/use/objectInstance.d.ts.map +1 -1
- package/types/use/objectRelated.d.ts +2 -2
- package/types/use/objectSubscription.d.ts +7 -7
- package/types/use/objectSubscription.d.ts.map +1 -1
- package/types/utils/refIfReactive.d.ts +1 -1
- package/types/utils/refIfReactive.d.ts.map +1 -1
- package/use/cancellableIntent.js +24 -16
- package/use/list.js +16 -20
- package/use/listCalculated.js +2 -3
- package/use/listInstance.js +23 -30
- package/use/listKeys.js +1 -2
- package/use/listRelated.js +2 -5
- package/use/listSort.js +2 -3
- package/use/listSubscription.js +14 -23
- package/use/object.js +6 -6
- package/use/objectCalculated.js +2 -2
- package/use/objectInstance.js +27 -28
- package/use/objectRelated.js +2 -2
- package/use/objectSubscription.js +18 -18
- package/utils/refIfReactive.js +3 -3
package/README.md
CHANGED
|
@@ -70,11 +70,11 @@ The container for your list of objects, providing loading or error status.
|
|
|
70
70
|
import { setListCrud } from "@arrai-innovations/reactive-helpers";
|
|
71
71
|
|
|
72
72
|
setListCrud({
|
|
73
|
-
list: async function listCrudAdaptor({
|
|
73
|
+
list: async function listCrudAdaptor({ target, params, pageCallback }) {
|
|
74
74
|
// todo: your implemenation here.
|
|
75
|
-
const listOfObjects = await talkToServer(
|
|
75
|
+
const listOfObjects = await talkToServer(target, params);
|
|
76
76
|
pageCallback(listOfObjects);
|
|
77
|
-
const nextListOfObjects = await talkToServerAgain(
|
|
77
|
+
const nextListOfObjects = await talkToServerAgain(target, params);
|
|
78
78
|
pageCallback(nextListOfObjects);
|
|
79
79
|
},
|
|
80
80
|
});
|
|
@@ -86,15 +86,12 @@ import { useListInstance } from "@arrai-innovations/reactive-helpers";
|
|
|
86
86
|
import { reactive } from "vue";
|
|
87
87
|
|
|
88
88
|
const listProps = reactive({
|
|
89
|
-
//
|
|
90
|
-
|
|
89
|
+
// target are implementation specific to your crud handlers.
|
|
90
|
+
target: {
|
|
91
91
|
stream: "contacts",
|
|
92
92
|
},
|
|
93
93
|
pkKey: "id",
|
|
94
|
-
|
|
95
|
-
fields: ["id", "has_name", "lexical_name", "organization", "phone"],
|
|
96
|
-
},
|
|
97
|
-
listArgs,
|
|
94
|
+
params,
|
|
98
95
|
});
|
|
99
96
|
const contacts = useListInstance({
|
|
100
97
|
props: listProps,
|
|
@@ -110,12 +107,12 @@ console.log(contacts.error);
|
|
|
110
107
|
console.log(contacts.objects);
|
|
111
108
|
// { contacts keyed by 'id' }
|
|
112
109
|
// change list or retrieve args directly
|
|
113
|
-
contacts.state.
|
|
110
|
+
contacts.state.params.fields.push("message_count");
|
|
114
111
|
await contacts.list();
|
|
115
112
|
console.log(contacts.objects);
|
|
116
113
|
// { contacts keyed by 'id' with message_count }
|
|
117
114
|
// change list or retrieve args indirectly
|
|
118
|
-
listProps.
|
|
115
|
+
listProps.params.has_organization = false;
|
|
119
116
|
await contacts.list();
|
|
120
117
|
console.log(contacts.objects);
|
|
121
118
|
// { contacts keyed by 'id' with organizationless contacts }
|
|
@@ -130,7 +127,7 @@ Adds functionality to a list instance to receive updates from the server.
|
|
|
130
127
|
import { setListCrud } from "@arrai-innovations/reactive-helpers";
|
|
131
128
|
setListCrud({
|
|
132
129
|
..., // in addition to the list crud adaptor above
|
|
133
|
-
subscribe: function subscribeCrudAdaptor({
|
|
130
|
+
subscribe: function subscribeCrudAdaptor({ target, params, eventCallback }) {
|
|
134
131
|
// todo: your implemenation here.
|
|
135
132
|
const subscription = talkToServer(function (data, action) {
|
|
136
133
|
eventCallback(data, action);
|
|
@@ -150,19 +147,17 @@ import { useListInstance, useListSubscription } from "@arrai-innovations/reactiv
|
|
|
150
147
|
import { reactive } from "vue";
|
|
151
148
|
|
|
152
149
|
const listProps = reactive({
|
|
153
|
-
//
|
|
154
|
-
|
|
150
|
+
// target are implementation specific to your crud handlers.
|
|
151
|
+
target: {
|
|
155
152
|
stream: "contacts",
|
|
156
153
|
includeCreateEvents: true,
|
|
157
154
|
subscribeAction: "subscribe_contacts",
|
|
158
155
|
unsubscribeAction: "unsubscribe_contacts",
|
|
159
156
|
},
|
|
160
157
|
pkKey: "id",
|
|
161
|
-
|
|
162
|
-
fields: ["id", "has_name", "lexical_name", "organization", "phone"],
|
|
163
|
-
},
|
|
164
|
-
listArgs: {
|
|
158
|
+
params: {
|
|
165
159
|
has_organization: true,
|
|
160
|
+
fields: ["id", "has_name", "lexical_name", "organization", "phone"],
|
|
166
161
|
},
|
|
167
162
|
});
|
|
168
163
|
const contacts = useListInstance({
|
|
@@ -179,9 +174,9 @@ contactsSubscription.subscribe();
|
|
|
179
174
|
// stop getting updates.
|
|
180
175
|
contactsSubscription.unsubscribe();
|
|
181
176
|
// re-retreive the list of existing contacts including another field.
|
|
182
|
-
contacts.
|
|
177
|
+
contacts.params.fields.push("message_count");
|
|
183
178
|
// re-retreive the list of all existing contacts.
|
|
184
|
-
delete contacts.
|
|
179
|
+
delete contacts.params.has_organization;
|
|
185
180
|
```
|
|
186
181
|
|
|
187
182
|
```js
|
|
@@ -190,17 +185,15 @@ import { useListSubscription } from "@arrai-innovations/reactive-helpers";
|
|
|
190
185
|
import { reactive } from "vue";
|
|
191
186
|
|
|
192
187
|
const listProps = reactive({
|
|
193
|
-
//
|
|
194
|
-
|
|
188
|
+
// target are implementation specific to your crud handlers.
|
|
189
|
+
target: {
|
|
195
190
|
stream: "contacts",
|
|
196
191
|
includeCreateEvents: true,
|
|
197
192
|
subscribeAction: "subscribe_contacts",
|
|
198
193
|
unsubscribeAction: "unsubscribe_contacts",
|
|
199
194
|
},
|
|
200
|
-
|
|
195
|
+
params: {
|
|
201
196
|
fields: ["id", "has_name", "lexical_name", "organization", "phone"],
|
|
202
|
-
},
|
|
203
|
-
listArgs: {
|
|
204
197
|
has_organization: true,
|
|
205
198
|
},
|
|
206
199
|
});
|
|
@@ -221,7 +214,7 @@ import { reactive, toRef } from "vue";
|
|
|
221
214
|
|
|
222
215
|
const organizationsProps = reactive({
|
|
223
216
|
pkKey: "id",
|
|
224
|
-
|
|
217
|
+
params: {
|
|
225
218
|
fields: ["id", "name"],
|
|
226
219
|
},
|
|
227
220
|
});
|
|
@@ -230,7 +223,7 @@ const organizations = useListInstance({
|
|
|
230
223
|
});
|
|
231
224
|
const contactsProps = reactive({
|
|
232
225
|
pkKey: "id",
|
|
233
|
-
|
|
226
|
+
params: {
|
|
234
227
|
fields: ["id", "lexical_name", "organization"],
|
|
235
228
|
},
|
|
236
229
|
});
|
|
@@ -306,7 +299,7 @@ import { nextTick, reactive } from "vue";
|
|
|
306
299
|
|
|
307
300
|
const contactsProps = reactive({
|
|
308
301
|
pkKey: "id",
|
|
309
|
-
|
|
302
|
+
params: {
|
|
310
303
|
fields: ["id", "has_name", "has_billing", "lexical_name", "organization"],
|
|
311
304
|
},
|
|
312
305
|
});
|
|
@@ -361,7 +354,7 @@ import { reactive, ref } from "vue";
|
|
|
361
354
|
|
|
362
355
|
const contactsProps = reactive({
|
|
363
356
|
pkKey: "id",
|
|
364
|
-
|
|
357
|
+
params: {
|
|
365
358
|
fields: ["id", "has_name", "has_billing", "lexical_name", "organization"],
|
|
366
359
|
},
|
|
367
360
|
});
|
|
@@ -406,7 +399,7 @@ import { reactive } from "vue";
|
|
|
406
399
|
|
|
407
400
|
const contactsProps = reactive({
|
|
408
401
|
pkKey: "id",
|
|
409
|
-
|
|
402
|
+
params: {
|
|
410
403
|
fields: ["id", "has_name", "has_billing", "lexical_name", "organization"],
|
|
411
404
|
},
|
|
412
405
|
});
|
|
@@ -451,7 +444,7 @@ import { reactive } from "vue";
|
|
|
451
444
|
|
|
452
445
|
const contactsProps = reactive({
|
|
453
446
|
pkKey: "id",
|
|
454
|
-
|
|
447
|
+
params: {
|
|
455
448
|
fields: ["id", "has_name", "lexical_name", "organization"],
|
|
456
449
|
},
|
|
457
450
|
});
|
|
@@ -488,19 +481,17 @@ import { useList } from "@arrai-innovations/reactive-helpers";
|
|
|
488
481
|
import { reactive, toRef } from "vue";
|
|
489
482
|
|
|
490
483
|
const managedListProps = reactive({
|
|
491
|
-
//
|
|
492
|
-
|
|
484
|
+
// target are implementation specific to your crud handlers.
|
|
485
|
+
target: {
|
|
493
486
|
stream: "contacts",
|
|
494
487
|
includeCreateEvents: true,
|
|
495
488
|
subscribeAction: "subscribe_contacts",
|
|
496
489
|
unsubscribeAction: "unsubscribe_contacts",
|
|
497
490
|
},
|
|
498
491
|
pkKey: "id",
|
|
499
|
-
|
|
500
|
-
fields: ["id", "has_name", "lexical_name", "organization", "phone"],
|
|
501
|
-
},
|
|
502
|
-
listArgs: {
|
|
492
|
+
params: {
|
|
503
493
|
has_organization: true,
|
|
494
|
+
fields: ["id", "has_name", "lexical_name", "organization", "phone"],
|
|
504
495
|
},
|
|
505
496
|
relatedObjectsRules: {
|
|
506
497
|
organization: {
|
|
@@ -524,7 +515,7 @@ const managedListProps = reactive({
|
|
|
524
515
|
});
|
|
525
516
|
const managedList = useList({
|
|
526
517
|
props: managedListProps,
|
|
527
|
-
|
|
518
|
+
handlers: {
|
|
528
519
|
list: customListFunction,
|
|
529
520
|
subscribe: customSubscribeFunction,
|
|
530
521
|
},
|
|
@@ -553,31 +544,31 @@ console.log(managedList.managed);
|
|
|
553
544
|
import { setObjectCrud } from "@arrai-innovations/reactive-helpers";
|
|
554
545
|
|
|
555
546
|
setObjectCrud({
|
|
556
|
-
create: async function createCrudAdaptor({
|
|
547
|
+
create: async function createCrudAdaptor({ target, params, object }) {
|
|
557
548
|
// todo: your implemenation here.
|
|
558
549
|
const newObject = await talkToServer(object);
|
|
559
550
|
return newObject;
|
|
560
551
|
},
|
|
561
|
-
retrieve: async function retrieveCrudAdaptor({
|
|
552
|
+
retrieve: async function retrieveCrudAdaptor({ target, params, id }) {
|
|
562
553
|
// todo: your implemenation here.
|
|
563
554
|
const retrievedObject = await talkToServer(id);
|
|
564
555
|
return retrievedObject;
|
|
565
556
|
},
|
|
566
|
-
update: async function updateCrudAdaptor({
|
|
557
|
+
update: async function updateCrudAdaptor({ target, params, object }) {
|
|
567
558
|
// todo: your implemenation here.
|
|
568
559
|
const updatedObject = await talkToServer(object);
|
|
569
560
|
return updatedObject;
|
|
570
561
|
},
|
|
571
|
-
delete: async function deleteCrudAdaptor({
|
|
562
|
+
delete: async function deleteCrudAdaptor({ target, id }) {
|
|
572
563
|
// todo: your implemenation here.
|
|
573
564
|
await talkToServer(id);
|
|
574
565
|
},
|
|
575
|
-
patch: async function patchCrudAdaptor({
|
|
566
|
+
patch: async function patchCrudAdaptor({ target, params, id, partialObject }) {
|
|
576
567
|
// todo: your implemenation here.
|
|
577
568
|
const patchedObject = await talkToServer(object);
|
|
578
569
|
return patchedObject; // still return the full object.
|
|
579
570
|
},
|
|
580
|
-
subscribe: function subscribeCrudAdaptor({
|
|
571
|
+
subscribe: function subscribeCrudAdaptor({ target, params, params, eventCallback }) {
|
|
581
572
|
// todo: your implemenation here.
|
|
582
573
|
const subscription = talkToServer(function (data, action) {
|
|
583
574
|
eventCallback(data, action);
|
|
@@ -602,10 +593,10 @@ import {
|
|
|
602
593
|
|
|
603
594
|
const contactObject = useObjectInstance({
|
|
604
595
|
props: {
|
|
605
|
-
|
|
596
|
+
target: {
|
|
606
597
|
stream: "contacts",
|
|
607
598
|
},
|
|
608
|
-
|
|
599
|
+
params: {
|
|
609
600
|
fields: ["id", "has_name", "lexical_name", "organization", "phone"],
|
|
610
601
|
},
|
|
611
602
|
id: contactId,
|
|
@@ -618,10 +609,10 @@ const contactSubscription = useObjectSubscription({
|
|
|
618
609
|
// or
|
|
619
610
|
const contactSubscription = useObjectSubscription({
|
|
620
611
|
props: {
|
|
621
|
-
|
|
612
|
+
target: {
|
|
622
613
|
stream: "contacts",
|
|
623
614
|
},
|
|
624
|
-
|
|
615
|
+
params: {
|
|
625
616
|
fields: ["id", "has_name", "lexical_name", "organization", "phone"],
|
|
626
617
|
},
|
|
627
618
|
id: contactId,
|
|
@@ -630,10 +621,10 @@ const contactSubscription = useObjectSubscription({
|
|
|
630
621
|
console.log(contactSubscription.state.object);
|
|
631
622
|
const organizations = useList({
|
|
632
623
|
props: {
|
|
633
|
-
|
|
624
|
+
target: {
|
|
634
625
|
stream: "organizations",
|
|
635
626
|
},
|
|
636
|
-
|
|
627
|
+
params: {
|
|
637
628
|
fields: ["id", "name"],
|
|
638
629
|
},
|
|
639
630
|
},
|
|
@@ -667,10 +658,10 @@ import { useObject } from "@arrai-innovations/reactive-helpers";
|
|
|
667
658
|
import { reactive } from "vue";
|
|
668
659
|
|
|
669
660
|
const managedObjectProps = reactive({
|
|
670
|
-
|
|
661
|
+
target: {
|
|
671
662
|
stream: "contacts",
|
|
672
663
|
},
|
|
673
|
-
|
|
664
|
+
params: {
|
|
674
665
|
fields: ["id", "has_name", "lexical_name", "organization", "phone"],
|
|
675
666
|
},
|
|
676
667
|
pk: contactId,
|
|
@@ -690,7 +681,7 @@ const managedObjectProps = reactive({
|
|
|
690
681
|
});
|
|
691
682
|
const managedObject = useObject({
|
|
692
683
|
props: managedObjectProps,
|
|
693
|
-
|
|
684
|
+
handlers: {
|
|
694
685
|
retrieve: customRetrieveFunction,
|
|
695
686
|
subscribe: customSubscribeFunction,
|
|
696
687
|
},
|
package/config/commonCrud.js
CHANGED
|
@@ -43,33 +43,33 @@ export const createDefaultCrud = (keys, cancellableKeys = new Set()) => {
|
|
|
43
43
|
};
|
|
44
44
|
|
|
45
45
|
/**
|
|
46
|
-
* Assigns the default CRUD
|
|
46
|
+
* Assigns the default CRUD handlers to the target object.
|
|
47
47
|
*
|
|
48
48
|
* @param {object} target - The reactive object to assign to.
|
|
49
49
|
* @param {object} defaultCrud - The default CRUD definition (usually created by `createDefaultCrud`).
|
|
50
50
|
* @param {object} [options] - The options object.
|
|
51
51
|
* @param {object} [options.props] - The props object.
|
|
52
|
-
* @param {object} [options.
|
|
53
|
-
* @param {Set<string>} [options.validKeys] - The valid keys for the
|
|
52
|
+
* @param {object} [options.handlers] - The functions to assign.
|
|
53
|
+
* @param {Set<string>} [options.validKeys] - The valid keys for the handlers.
|
|
54
54
|
*/
|
|
55
55
|
export function assignCrud(
|
|
56
56
|
target,
|
|
57
57
|
defaultCrud,
|
|
58
|
-
{ props,
|
|
58
|
+
{ props, handlers, validKeys = new Set(Object.keys(defaultCrud).filter((k) => k !== "args")) } = {}
|
|
59
59
|
) {
|
|
60
60
|
Object.assign(target, cloneDeep(defaultCrud));
|
|
61
|
-
if (props?.
|
|
62
|
-
addOrUpdateReactiveObject(target.args, props.
|
|
61
|
+
if (props?.target) {
|
|
62
|
+
addOrUpdateReactiveObject(target.args, props.target);
|
|
63
63
|
}
|
|
64
|
-
if (
|
|
65
|
-
for (const [key, fn] of Object.entries(
|
|
64
|
+
if (handlers) {
|
|
65
|
+
for (const [key, fn] of Object.entries(handlers)) {
|
|
66
66
|
if (!validKeys.has(key)) {
|
|
67
67
|
throw new Error(`Invalid function key "${key}" passed to assignCrud`);
|
|
68
68
|
}
|
|
69
69
|
if (!isFunction(fn)) {
|
|
70
70
|
throw new Error(`Function "${key}" is not actually a function`);
|
|
71
71
|
}
|
|
72
|
-
target[key] = refIfReactive(
|
|
72
|
+
target[key] = refIfReactive(handlers, key, fn);
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
75
|
}
|
package/config/listCrud.js
CHANGED
|
@@ -3,7 +3,7 @@ import cloneDeep from "lodash-es/cloneDeep.js";
|
|
|
3
3
|
import { readonly } from "vue";
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
|
-
* Configuration for the default list crud
|
|
6
|
+
* Configuration for the default list crud handlers.
|
|
7
7
|
*
|
|
8
8
|
* @module config/listCrud.js
|
|
9
9
|
*/
|
|
@@ -24,10 +24,9 @@ import { readonly } from "vue";
|
|
|
24
24
|
|
|
25
25
|
/**
|
|
26
26
|
* @typedef {object} ListArgs
|
|
27
|
-
* @property {object}
|
|
27
|
+
* @property {object} target - The arguments to be passed to the crud handlers.
|
|
28
28
|
* @property {string} pkKey - The key name of the primary key.
|
|
29
|
-
* @property {object}
|
|
30
|
-
* @property {object} listArgs - The arguments to be passed for list crud functions.
|
|
29
|
+
* @property {object} params - The arguments to be passed for list crud handlers.
|
|
31
30
|
* @property {PageCallback} pageCallback - The method to call with new page(s) of data received.
|
|
32
31
|
* @property {Readonly<import('vue').Ref<boolean>>} isCancelled - A ref to a boolean indicating whether the request has
|
|
33
32
|
* been cancelled.
|
|
@@ -35,7 +34,7 @@ import { readonly } from "vue";
|
|
|
35
34
|
|
|
36
35
|
/**
|
|
37
36
|
* @typedef {object} BulkDeleteArgs
|
|
38
|
-
* @property {object}
|
|
37
|
+
* @property {object} target - The arguments to be passed to the crud handlers.
|
|
39
38
|
* @property {string[]} pks - The ids of the objects to be deleted.
|
|
40
39
|
* @property {string} pkKey - The key name of the primary key.
|
|
41
40
|
* @property {Readonly<import('vue').Ref<boolean>>} isCancelled - A ref to a boolean indicating whether the request has
|
|
@@ -51,10 +50,9 @@ import { readonly } from "vue";
|
|
|
51
50
|
|
|
52
51
|
/**
|
|
53
52
|
* @typedef {object} ListSubscribeArgs
|
|
54
|
-
* @property {object}
|
|
53
|
+
* @property {object} target - The arguments to be passed to the crud handlers.
|
|
55
54
|
* @property {string} pkKey - The key name of the primary key.
|
|
56
|
-
* @property {object}
|
|
57
|
-
* @property {object} listArgs - The arguments to be passed for list crud functions.
|
|
55
|
+
* @property {object} params - The arguments to be passed for list crud handlers.
|
|
58
56
|
* @property {SubscriptionEventCallback} subscriptionEventCallback - The method to call when new data is received.
|
|
59
57
|
* @property {Readonly<import('vue').Ref<boolean>>} isCancelled - A ref to a boolean indicating whether the request has
|
|
60
58
|
* been cancelled.
|
|
@@ -62,7 +60,7 @@ import { readonly } from "vue";
|
|
|
62
60
|
|
|
63
61
|
/**
|
|
64
62
|
* @typedef {object} ExecuteActionArgs
|
|
65
|
-
* @property {object}
|
|
63
|
+
* @property {object} target - The arguments to be passed to the crud handlers.
|
|
66
64
|
* @property {string[]} pks - The ids of the objects to be acted upon.
|
|
67
65
|
* @property {string} pkKey - The key name of the primary key.
|
|
68
66
|
* @property {string} action - The action to execute.
|
|
@@ -72,30 +70,30 @@ import { readonly } from "vue";
|
|
|
72
70
|
|
|
73
71
|
/**
|
|
74
72
|
* @callback CrudListFn
|
|
75
|
-
* @param {ListArgs} args - The arguments to be passed to the crud
|
|
73
|
+
* @param {ListArgs} args - The arguments to be passed to the crud handlers.
|
|
76
74
|
* @returns {import('../utils/cancellablePromise.js').MaybeCancellablePromise<void>} - A promise that resolves to a boolean indicating success.
|
|
77
75
|
*/
|
|
78
76
|
|
|
79
77
|
/**
|
|
80
78
|
* @callback CrudBulkDeleteFn
|
|
81
|
-
* @param {BulkDeleteArgs} args - The arguments to be passed to the crud
|
|
79
|
+
* @param {BulkDeleteArgs} args - The arguments to be passed to the crud handlers.
|
|
82
80
|
* @returns {import('../utils/cancellablePromise.js').MaybeCancellablePromise<void>} - A promise that resolves to a boolean indicating success.
|
|
83
81
|
*/
|
|
84
82
|
|
|
85
83
|
/**
|
|
86
84
|
* @callback CrudListSubscribeFn
|
|
87
|
-
* @param {ListSubscribeArgs} args - The arguments to be passed to the crud
|
|
85
|
+
* @param {ListSubscribeArgs} args - The arguments to be passed to the crud handlers.
|
|
88
86
|
* @returns {import('../utils/cancellablePromise.js').CancellablePromise<void>} - A promise that resolves to a boolean indicating success.
|
|
89
87
|
*/
|
|
90
88
|
|
|
91
89
|
/**
|
|
92
90
|
* @callback CrudExecuteActionFn
|
|
93
|
-
* @param {ExecuteActionArgs} args - The arguments to be passed to the crud
|
|
91
|
+
* @param {ExecuteActionArgs} args - The arguments to be passed to the crud handlers.
|
|
94
92
|
* @returns {import('../utils/cancellablePromise.js').MaybeCancellablePromise<object|string|null>} - A promise that resolves the result of the action, returned to the executor.
|
|
95
93
|
*/
|
|
96
94
|
|
|
97
95
|
/**
|
|
98
|
-
* @typedef {object}
|
|
96
|
+
* @typedef {object} ListCrudHandlers
|
|
99
97
|
* @property {CrudListFn} [list] - The list function to get a list of items.
|
|
100
98
|
* @property {CrudBulkDeleteFn} [bulkDelete] - The delete function to bulk delete a list of items.
|
|
101
99
|
* @property {CrudExecuteActionFn} [executeAction] - The function to execute a certain action on a list of items.
|
|
@@ -103,28 +101,28 @@ import { readonly } from "vue";
|
|
|
103
101
|
*/
|
|
104
102
|
|
|
105
103
|
/**
|
|
106
|
-
* @typedef {object}
|
|
107
|
-
* @property {object} args - The default arguments for the crud
|
|
104
|
+
* @typedef {object} ListTarget
|
|
105
|
+
* @property {object} args - The default arguments for the crud handlers.
|
|
108
106
|
*/
|
|
109
107
|
|
|
110
108
|
/**
|
|
111
|
-
* @typedef {object}
|
|
112
|
-
* @property {object} [
|
|
109
|
+
* @typedef {object} ListTargetOption
|
|
110
|
+
* @property {object} [target={}] - The default arguments for the crud handlers.
|
|
113
111
|
*/
|
|
114
112
|
|
|
115
113
|
const _defaultCrud = createDefaultCrud(["list", "bulkDelete", "executeAction", "subscribe"], new Set(["subscribe"]));
|
|
116
114
|
|
|
117
115
|
/**
|
|
118
|
-
* The default list crud
|
|
116
|
+
* The default list crud handlers.
|
|
119
117
|
*
|
|
120
|
-
* @type {Readonly<
|
|
118
|
+
* @type {Readonly<ListCrudHandlers>}
|
|
121
119
|
*/
|
|
122
120
|
export const defaultListCrud = readonly(_defaultCrud);
|
|
123
121
|
|
|
124
122
|
/**
|
|
125
|
-
* Set the list and subscribe
|
|
123
|
+
* Set the list and subscribe handlers for the default crud.
|
|
126
124
|
*
|
|
127
|
-
* @param {
|
|
125
|
+
* @param {ListCrudHandlers & Partial<ListTarget>} options - The options for the default crud.
|
|
128
126
|
* @throws {Error} - If unknown keys are passed.
|
|
129
127
|
* @returns {void}
|
|
130
128
|
*/
|
|
@@ -139,12 +137,12 @@ export const setListCrud = ({ args = {}, ...rest }) => {
|
|
|
139
137
|
};
|
|
140
138
|
|
|
141
139
|
/**
|
|
142
|
-
* Get the previously set list and subscribe
|
|
140
|
+
* Get the previously set list and subscribe handlers for the default crud.
|
|
143
141
|
*
|
|
144
|
-
* @param {import("vue").UnwrapNestedRefs<
|
|
142
|
+
* @param {import("vue").UnwrapNestedRefs<ListCrudHandlers & ListTarget>} target - The reactive crud object, which will be mutated.
|
|
145
143
|
* @param {object} options - The options for the default crud.
|
|
146
|
-
* @param {import("vue").UnwrapNestedRefs<
|
|
147
|
-
* @param {
|
|
144
|
+
* @param {import("vue").UnwrapNestedRefs<ListTargetOption>} [options.props] - The props to set for the crud.
|
|
145
|
+
* @param {ListCrudHandlers} [options.handlers] - The functions to set for the crud.
|
|
148
146
|
* @throws {Error} - If an invalid function is passed, or if the function is not a function.
|
|
149
147
|
*/
|
|
150
148
|
export const getListCrud = (target, options) => {
|
package/config/objectCrud.js
CHANGED
|
@@ -3,57 +3,57 @@ import cloneDeep from "lodash-es/cloneDeep.js";
|
|
|
3
3
|
import { readonly } from "vue";
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
|
-
* Configuration for the default object crud
|
|
6
|
+
* Configuration for the default object crud handlers.
|
|
7
7
|
*
|
|
8
8
|
* @module config/objectCrud.js
|
|
9
9
|
*/
|
|
10
10
|
|
|
11
11
|
/**
|
|
12
|
-
* @typedef {{[key:string]: any}}
|
|
12
|
+
* @typedef {{[key:string]: any}} ObjectTargetArgs
|
|
13
13
|
*/
|
|
14
14
|
|
|
15
15
|
/**
|
|
16
|
-
* Defines the CRUD-related
|
|
16
|
+
* Defines the CRUD-related handlers and additional utilities provided by the object instance.
|
|
17
17
|
*
|
|
18
|
-
* @typedef {object}
|
|
19
|
-
* @property {
|
|
18
|
+
* @typedef {object} ObjectTargetProperties
|
|
19
|
+
* @property {ObjectTargetArgs} args - The arguments to be passed to the crud handlers.
|
|
20
20
|
*/
|
|
21
21
|
|
|
22
22
|
/**
|
|
23
|
-
* @typedef {object}
|
|
24
|
-
* @property {
|
|
23
|
+
* @typedef {object} ObjectTargetOption
|
|
24
|
+
* @property {ObjectTargetArgs} [target={}] - The arguments to be passed to the crud handlers.
|
|
25
25
|
*/
|
|
26
26
|
|
|
27
27
|
/**
|
|
28
28
|
* @typedef {object} CreateArgs
|
|
29
|
-
* @property {{[key:string]: any}}
|
|
29
|
+
* @property {{[key:string]: any}} target - The arguments to be passed to the crud handlers.
|
|
30
30
|
* @property {{[key:string]: any}} object - The data to be acted upon.
|
|
31
|
-
* @property {{[key:string]: any}}
|
|
31
|
+
* @property {{[key:string]: any}} params - The arguments to be passed to the retrieve function.
|
|
32
32
|
* @property {string} pkKey - The key name of the primary key.
|
|
33
33
|
* @property {Readonly<import('vue').Ref<boolean>>} isCancelled - A ref to indicate if the request was cancelled.
|
|
34
34
|
*/
|
|
35
35
|
|
|
36
36
|
/**
|
|
37
37
|
* @typedef {object} RetrieveArgs
|
|
38
|
-
* @property {{[key:string]: any}}
|
|
38
|
+
* @property {{[key:string]: any}} target - The arguments to be passed to the crud handlers.
|
|
39
39
|
* @property {string} pk - The pk of the object to be acted upon.
|
|
40
40
|
* @property {string} pkKey - The key name of the primary key.
|
|
41
|
-
* @property {{[key:string]: any}}
|
|
41
|
+
* @property {{[key:string]: any}} params - The arguments to be passed to the retrieve function.
|
|
42
42
|
* @property {Readonly<import('vue').Ref<boolean>>} isCancelled - A ref to indicate if the request was cancelled.
|
|
43
43
|
*/
|
|
44
44
|
|
|
45
45
|
/**
|
|
46
46
|
* @typedef {object} UpdateArgs
|
|
47
|
-
* @property {{[key:string]: any}}
|
|
47
|
+
* @property {{[key:string]: any}} target - The arguments to be passed to the crud handlers.
|
|
48
48
|
* @property {import('../use/objectInstance.js').ExistingCrudObject} object - The data to be acted upon.
|
|
49
|
-
* @property {{[key:string]: any}}
|
|
49
|
+
* @property {{[key:string]: any}} params - The arguments to be passed to the retrieve function.
|
|
50
50
|
* @property {string} pkKey - The key name of the primary key.
|
|
51
51
|
* @property {Readonly<import('vue').Ref<boolean>>} isCancelled - A ref to indicate if the request was cancelled.
|
|
52
52
|
*/
|
|
53
53
|
|
|
54
54
|
/**
|
|
55
55
|
* @typedef {object} DeleteArgs
|
|
56
|
-
* @property {{[key:string]: any}}
|
|
56
|
+
* @property {{[key:string]: any}} target - The arguments to be passed to the crud handlers.
|
|
57
57
|
* @property {string} pk - The pk of the object to be acted upon.
|
|
58
58
|
* @property {string} pkKey - The key name of the primary key.
|
|
59
59
|
* @property {Readonly<import('vue').Ref<boolean>>} isCancelled - A ref to indicate if the request was cancelled.
|
|
@@ -61,11 +61,11 @@ import { readonly } from "vue";
|
|
|
61
61
|
|
|
62
62
|
/**
|
|
63
63
|
* @typedef {object} PartialArgs
|
|
64
|
-
* @property {{[key:string]: any}}
|
|
64
|
+
* @property {{[key:string]: any}} target - The arguments to be passed to the crud handlers.
|
|
65
65
|
* @property {string} pk - The pk of the object to be acted upon.
|
|
66
66
|
* @property {string} pkKey - The key name of the primary key.
|
|
67
67
|
* @property {{[key:string]: any}} partialObject - The data to be acted upon.
|
|
68
|
-
* @property {{[key:string]: any}}
|
|
68
|
+
* @property {{[key:string]: any}} params - The arguments to be passed to the retrieve function.
|
|
69
69
|
* @property {Readonly<import('vue').Ref<boolean>>} isCancelled - A ref to indicate if the request was cancelled.
|
|
70
70
|
*/
|
|
71
71
|
|
|
@@ -77,10 +77,10 @@ import { readonly } from "vue";
|
|
|
77
77
|
|
|
78
78
|
/**
|
|
79
79
|
* @typedef {object} ObjectSubscribeArgs
|
|
80
|
-
* @property {{[key:string]: any}}
|
|
80
|
+
* @property {{[key:string]: any}} target - The arguments to be passed to the crud handlers.
|
|
81
81
|
* @property {string} pk - The pk of the object to be acted upon.
|
|
82
82
|
* @property {string} pkKey - The key name of the primary key.
|
|
83
|
-
* @property {{[key:string]: any}}
|
|
83
|
+
* @property {{[key:string]: any}} params - The arguments to be passed to the retrieve function.
|
|
84
84
|
* @property {CrudSubscribeCallback} callback - The callback to be called when the object is updated.
|
|
85
85
|
* @property {Readonly<import('vue').Ref<boolean>>} isCancelled - A ref to indicate if the request was cancelled.
|
|
86
86
|
*/
|
|
@@ -126,9 +126,9 @@ import { readonly } from "vue";
|
|
|
126
126
|
*/
|
|
127
127
|
|
|
128
128
|
/**
|
|
129
|
-
* Defines the CRUD-related
|
|
129
|
+
* Defines the CRUD-related handlers and additional utilities provided by the object instance.
|
|
130
130
|
*
|
|
131
|
-
* @typedef {object}
|
|
131
|
+
* @typedef {object} ObjectCrudHandlers
|
|
132
132
|
* @property {CrudCreateFn} [create] - A function to be used instead of the default crud create function.
|
|
133
133
|
* @property {CrudRetrieveFn} [retrieve] - A function to be used instead of the default crud retrieve function.
|
|
134
134
|
* @property {CrudUpdateFn} [update] - A function to be used instead of the default crud update function.
|
|
@@ -140,7 +140,7 @@ import { readonly } from "vue";
|
|
|
140
140
|
/**
|
|
141
141
|
* The CRUD arguments.
|
|
142
142
|
*
|
|
143
|
-
* @typedef {
|
|
143
|
+
* @typedef {ObjectTargetProperties & ObjectCrudHandlers} ObjectTarget
|
|
144
144
|
*
|
|
145
145
|
*/
|
|
146
146
|
|
|
@@ -150,16 +150,16 @@ const _defaultCrud = createDefaultCrud(
|
|
|
150
150
|
);
|
|
151
151
|
|
|
152
152
|
/**
|
|
153
|
-
* The default object crud
|
|
153
|
+
* The default object crud handlers.
|
|
154
154
|
*
|
|
155
|
-
* @type {Readonly<
|
|
155
|
+
* @type {Readonly<ObjectCrudHandlers>}
|
|
156
156
|
*/
|
|
157
157
|
export const defaultObjectCrud = readonly(_defaultCrud);
|
|
158
158
|
|
|
159
159
|
/**
|
|
160
|
-
* Set the object crud
|
|
160
|
+
* Set the object crud handlers.
|
|
161
161
|
*
|
|
162
|
-
* @param {
|
|
162
|
+
* @param {ObjectTarget} options - The options for the object crud handlers.
|
|
163
163
|
* @throws {Error} - if unknown keys are passed.
|
|
164
164
|
*/
|
|
165
165
|
export const setObjectCrud = ({ args = {}, ...rest }) => {
|
|
@@ -173,12 +173,12 @@ export const setObjectCrud = ({ args = {}, ...rest }) => {
|
|
|
173
173
|
};
|
|
174
174
|
|
|
175
175
|
/**
|
|
176
|
-
* Get the previously set object crud
|
|
176
|
+
* Get the previously set object crud handlers.
|
|
177
177
|
*
|
|
178
|
-
* @param {import("vue").UnwrapNestedRefs<
|
|
178
|
+
* @param {import("vue").UnwrapNestedRefs<ObjectTargetProperties>} target - The reactive object you want to add the resulting crud to.
|
|
179
179
|
* @param {object} options - The options for the reactive crud object.
|
|
180
|
-
* @param {import("vue").UnwrapNestedRefs<
|
|
181
|
-
* @param {
|
|
180
|
+
* @param {import("vue").UnwrapNestedRefs<ObjectTargetOption>} [options.props] - The props with any passed target.
|
|
181
|
+
* @param {ObjectCrudHandlers} [options.handlers] - Any functions to override the default crud functions.
|
|
182
182
|
* @throws {Error} - If an invalid function is passed, or if the function is not a function.
|
|
183
183
|
*/
|
|
184
184
|
export const getObjectCrud = (target, options) => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@arrai-innovations/reactive-helpers",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "20.0.1",
|
|
4
4
|
"description": "VueJS 3 utility composition functions to help manipulate objects and lists.",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"type": "module",
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"@types/lodash-es": "^4.17.12",
|
|
53
53
|
"@typescript-eslint/eslint-plugin": "^7.18.0",
|
|
54
54
|
"@typescript-eslint/parser": "^7.18.0",
|
|
55
|
-
"@vitest/coverage-v8": "^3.
|
|
55
|
+
"@vitest/coverage-v8": "^3.1.2",
|
|
56
56
|
"@vue/compiler-sfc": "^3.4.37",
|
|
57
57
|
"@vue/eslint-config-prettier": "^9.0.0",
|
|
58
58
|
"@vue/test-utils": "^2.3.2",
|
|
@@ -71,7 +71,7 @@
|
|
|
71
71
|
"typedoc": "^0.27.1",
|
|
72
72
|
"typedoc-plugin-markdown": "^4.3.0",
|
|
73
73
|
"typescript": "^5.5.4",
|
|
74
|
-
"vitest": "^3.
|
|
74
|
+
"vitest": "^3.1.2"
|
|
75
75
|
},
|
|
76
76
|
"dependencies": {
|
|
77
77
|
"@jcoreio/async-throttle": "^1.6.0",
|