@vuu-ui/vuu-data-react 0.13.6 → 0.13.8
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/cjs/index.js +1556 -40
- package/cjs/index.js.map +1 -1
- package/esm/index.js +1535 -15
- package/esm/index.js.map +1 -1
- package/package.json +14 -14
- package/cjs/data-editing/EditForm.css.js +0 -6
- package/cjs/data-editing/EditForm.css.js.map +0 -1
- package/cjs/data-editing/EditForm.js +0 -90
- package/cjs/data-editing/EditForm.js.map +0 -1
- package/cjs/data-editing/UnsavedChangesReport.css.js +0 -6
- package/cjs/data-editing/UnsavedChangesReport.css.js.map +0 -1
- package/cjs/data-editing/UnsavedChangesReport.js +0 -29
- package/cjs/data-editing/UnsavedChangesReport.js.map +0 -1
- package/cjs/data-editing/edit-rule-validation-checker.js +0 -41
- package/cjs/data-editing/edit-rule-validation-checker.js.map +0 -1
- package/cjs/data-editing/edit-validation-rules.js +0 -52
- package/cjs/data-editing/edit-validation-rules.js.map +0 -1
- package/cjs/data-editing/form-edit-state.js +0 -26
- package/cjs/data-editing/form-edit-state.js.map +0 -1
- package/cjs/data-editing/get-data-item-edit-control.js +0 -56
- package/cjs/data-editing/get-data-item-edit-control.js.map +0 -1
- package/cjs/data-editing/useEditForm.js +0 -249
- package/cjs/data-editing/useEditForm.js.map +0 -1
- package/cjs/datasource-provider/RestDataSourceProvider.js +0 -78
- package/cjs/datasource-provider/RestDataSourceProvider.js.map +0 -1
- package/cjs/datasource-provider/VuuDataSourceProvider.js +0 -34
- package/cjs/datasource-provider/VuuDataSourceProvider.js.map +0 -1
- package/cjs/datasource-provider/useAutoLoginToVuuServer.js +0 -54
- package/cjs/datasource-provider/useAutoLoginToVuuServer.js.map +0 -1
- package/cjs/hooks/useLookupValues.js +0 -100
- package/cjs/hooks/useLookupValues.js.map +0 -1
- package/cjs/hooks/useSessionDataSource.js +0 -72
- package/cjs/hooks/useSessionDataSource.js.map +0 -1
- package/cjs/hooks/useTypeaheadSuggestions.js +0 -41
- package/cjs/hooks/useTypeaheadSuggestions.js.map +0 -1
- package/cjs/hooks/useVisualLinks.js +0 -83
- package/cjs/hooks/useVisualLinks.js.map +0 -1
- package/cjs/hooks/useVuuMenuActions.js +0 -362
- package/cjs/hooks/useVuuMenuActions.js.map +0 -1
- package/cjs/hooks/useVuuTables.js +0 -38
- package/cjs/hooks/useVuuTables.js.map +0 -1
- package/cjs/session-editing-form/SessionEditingForm.css.js +0 -6
- package/cjs/session-editing-form/SessionEditingForm.css.js.map +0 -1
- package/cjs/session-editing-form/SessionEditingForm.js +0 -269
- package/cjs/session-editing-form/SessionEditingForm.js.map +0 -1
- package/esm/data-editing/EditForm.css.js +0 -4
- package/esm/data-editing/EditForm.css.js.map +0 -1
- package/esm/data-editing/EditForm.js +0 -88
- package/esm/data-editing/EditForm.js.map +0 -1
- package/esm/data-editing/UnsavedChangesReport.css.js +0 -4
- package/esm/data-editing/UnsavedChangesReport.css.js.map +0 -1
- package/esm/data-editing/UnsavedChangesReport.js +0 -27
- package/esm/data-editing/UnsavedChangesReport.js.map +0 -1
- package/esm/data-editing/edit-rule-validation-checker.js +0 -37
- package/esm/data-editing/edit-rule-validation-checker.js.map +0 -1
- package/esm/data-editing/edit-validation-rules.js +0 -50
- package/esm/data-editing/edit-validation-rules.js.map +0 -1
- package/esm/data-editing/form-edit-state.js +0 -23
- package/esm/data-editing/form-edit-state.js.map +0 -1
- package/esm/data-editing/get-data-item-edit-control.js +0 -54
- package/esm/data-editing/get-data-item-edit-control.js.map +0 -1
- package/esm/data-editing/useEditForm.js +0 -247
- package/esm/data-editing/useEditForm.js.map +0 -1
- package/esm/datasource-provider/RestDataSourceProvider.js +0 -75
- package/esm/datasource-provider/RestDataSourceProvider.js.map +0 -1
- package/esm/datasource-provider/VuuDataSourceProvider.js +0 -32
- package/esm/datasource-provider/VuuDataSourceProvider.js.map +0 -1
- package/esm/datasource-provider/useAutoLoginToVuuServer.js +0 -52
- package/esm/datasource-provider/useAutoLoginToVuuServer.js.map +0 -1
- package/esm/hooks/useLookupValues.js +0 -98
- package/esm/hooks/useLookupValues.js.map +0 -1
- package/esm/hooks/useSessionDataSource.js +0 -70
- package/esm/hooks/useSessionDataSource.js.map +0 -1
- package/esm/hooks/useTypeaheadSuggestions.js +0 -38
- package/esm/hooks/useTypeaheadSuggestions.js.map +0 -1
- package/esm/hooks/useVisualLinks.js +0 -81
- package/esm/hooks/useVisualLinks.js.map +0 -1
- package/esm/hooks/useVuuMenuActions.js +0 -358
- package/esm/hooks/useVuuMenuActions.js.map +0 -1
- package/esm/hooks/useVuuTables.js +0 -36
- package/esm/hooks/useVuuTables.js.map +0 -1
- package/esm/session-editing-form/SessionEditingForm.css.js +0 -4
- package/esm/session-editing-form/SessionEditingForm.css.js.map +0 -1
- package/esm/session-editing-form/SessionEditingForm.js +0 -267
- package/esm/session-editing-form/SessionEditingForm.js.map +0 -1
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
|
|
5
|
-
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
6
|
-
|
|
7
|
-
const getDataItemEditControl = ({
|
|
8
|
-
InputProps: InputProps2,
|
|
9
|
-
TypeaheadProps,
|
|
10
|
-
commitWhenCleared,
|
|
11
|
-
dataDescriptor,
|
|
12
|
-
errorMessage,
|
|
13
|
-
onCommit,
|
|
14
|
-
table
|
|
15
|
-
}) => {
|
|
16
|
-
const handleCommitNumber = (evt, value) => {
|
|
17
|
-
onCommit(evt, value.toString());
|
|
18
|
-
};
|
|
19
|
-
if (dataDescriptor.editable === false) {
|
|
20
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
21
|
-
vuuUiControls.VuuInput,
|
|
22
|
-
{
|
|
23
|
-
variant: "secondary",
|
|
24
|
-
...InputProps2,
|
|
25
|
-
onCommit,
|
|
26
|
-
readOnly: true
|
|
27
|
-
}
|
|
28
|
-
);
|
|
29
|
-
} else if (vuuUtils.isDateTimeDataValue(dataDescriptor)) {
|
|
30
|
-
return /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.VuuDatePicker, { onCommit: handleCommitNumber });
|
|
31
|
-
} else if (dataDescriptor.serverDataType === "string" && table) {
|
|
32
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
33
|
-
vuuUiControls.VuuTypeaheadInput,
|
|
34
|
-
{
|
|
35
|
-
...InputProps2,
|
|
36
|
-
...TypeaheadProps,
|
|
37
|
-
column: dataDescriptor.name,
|
|
38
|
-
onCommit,
|
|
39
|
-
table
|
|
40
|
-
}
|
|
41
|
-
);
|
|
42
|
-
}
|
|
43
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
44
|
-
vuuUiControls.VuuInput,
|
|
45
|
-
{
|
|
46
|
-
variant: "secondary",
|
|
47
|
-
...InputProps2,
|
|
48
|
-
commitWhenCleared,
|
|
49
|
-
onCommit,
|
|
50
|
-
errorMessage
|
|
51
|
-
}
|
|
52
|
-
);
|
|
53
|
-
};
|
|
54
|
-
|
|
55
|
-
exports.getDataItemEditControl = getDataItemEditControl;
|
|
56
|
-
//# sourceMappingURL=get-data-item-edit-control.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"get-data-item-edit-control.js","sources":["../../src/data-editing/get-data-item-edit-control.tsx"],"sourcesContent":["import type {\n DataValueDescriptor,\n TableSchemaTable,\n} from \"@vuu-ui/vuu-data-types\";\nimport {\n VuuDatePicker,\n VuuInput,\n VuuTypeaheadInput,\n VuuTypeaheadInputProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { CommitHandler, isDateTimeDataValue } from \"@vuu-ui/vuu-utils\";\nimport { InputProps } from \"@salt-ds/core\";\n\nexport interface DataItemEditControlProps {\n InputProps?: Partial<InputProps>;\n TypeaheadProps?: Pick<VuuTypeaheadInputProps, \"highlightFirstSuggestion\">;\n commitWhenCleared?: boolean;\n /**\n * A table column or form field Descriptor.\n */\n dataDescriptor: DataValueDescriptor;\n errorMessage?: string;\n onCommit: CommitHandler<HTMLElement>;\n table?: TableSchemaTable;\n}\n\nexport type ValidationStatus = \"initial\" | true | string;\n\nexport const getDataItemEditControl = ({\n InputProps,\n TypeaheadProps,\n commitWhenCleared,\n dataDescriptor,\n errorMessage,\n onCommit,\n table,\n}: DataItemEditControlProps) => {\n const handleCommitNumber: CommitHandler<HTMLElement, number> = (\n evt,\n value,\n ) => {\n onCommit(evt, value.toString());\n };\n\n if (dataDescriptor.editable === false) {\n return (\n <VuuInput\n variant=\"secondary\"\n {...InputProps}\n onCommit={onCommit}\n readOnly\n />\n );\n } else if (isDateTimeDataValue(dataDescriptor)) {\n return <VuuDatePicker onCommit={handleCommitNumber} />;\n } else if (dataDescriptor.serverDataType === \"string\" && table) {\n return (\n <VuuTypeaheadInput\n {...InputProps}\n {...TypeaheadProps}\n column={dataDescriptor.name}\n onCommit={onCommit}\n table={table}\n />\n );\n }\n return (\n <VuuInput\n variant=\"secondary\"\n {...InputProps}\n commitWhenCleared={commitWhenCleared}\n onCommit={onCommit}\n errorMessage={errorMessage}\n />\n );\n};\n"],"names":["InputProps","jsx","VuuInput","isDateTimeDataValue","VuuDatePicker","VuuTypeaheadInput"],"mappings":";;;;;;AA4BO,MAAM,yBAAyB,CAAC;AAAA,EACrC,UAAAA,EAAAA,WAAAA;AAAA,EACA,cAAA;AAAA,EACA,iBAAA;AAAA,EACA,cAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAgC,KAAA;AAC9B,EAAM,MAAA,kBAAA,GAAyD,CAC7D,GAAA,EACA,KACG,KAAA;AACH,IAAS,QAAA,CAAA,GAAA,EAAK,KAAM,CAAA,QAAA,EAAU,CAAA;AAAA,GAChC;AAEA,EAAI,IAAA,cAAA,CAAe,aAAa,KAAO,EAAA;AACrC,IACE,uBAAAC,cAAA;AAAA,MAACC,sBAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACP,GAAGF,WAAAA;AAAA,QACJ,QAAA;AAAA,QACA,QAAQ,EAAA;AAAA;AAAA,KACV;AAAA,GAEJ,MAAA,IAAWG,4BAAoB,CAAA,cAAc,CAAG,EAAA;AAC9C,IAAO,uBAAAF,cAAA,CAACG,2BAAc,EAAA,EAAA,QAAA,EAAU,kBAAoB,EAAA,CAAA;AAAA,GAC3C,MAAA,IAAA,cAAA,CAAe,cAAmB,KAAA,QAAA,IAAY,KAAO,EAAA;AAC9D,IACE,uBAAAH,cAAA;AAAA,MAACI,+BAAA;AAAA,MAAA;AAAA,QACE,GAAGL,WAAAA;AAAA,QACH,GAAG,cAAA;AAAA,QACJ,QAAQ,cAAe,CAAA,IAAA;AAAA,QACvB,QAAA;AAAA,QACA;AAAA;AAAA,KACF;AAAA;AAGJ,EACE,uBAAAC,cAAA;AAAA,IAACC,sBAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACP,GAAGF,WAAAA;AAAA,MACJ,iBAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;;;;"}
|
|
@@ -1,249 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var vuuPopups = require('@vuu-ui/vuu-popups');
|
|
5
|
-
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
6
|
-
var core = require('@salt-ds/core');
|
|
7
|
-
var react = require('react');
|
|
8
|
-
var UnsavedChangesReport = require('./UnsavedChangesReport.js');
|
|
9
|
-
var editRuleValidationChecker = require('./edit-rule-validation-checker.js');
|
|
10
|
-
var formEditState = require('./form-edit-state.js');
|
|
11
|
-
|
|
12
|
-
const CLEAN_VALIDATION = {
|
|
13
|
-
ok: true,
|
|
14
|
-
messages: {}
|
|
15
|
-
};
|
|
16
|
-
const getValidationChecker = (descriptor, editPhase) => {
|
|
17
|
-
const rules = editRuleValidationChecker.getEditValidationRules(descriptor, editPhase) ?? [];
|
|
18
|
-
return editRuleValidationChecker.buildValidationChecker(rules);
|
|
19
|
-
};
|
|
20
|
-
const nextValidationState = (state, dataDescriptor, value) => {
|
|
21
|
-
const check = getValidationChecker(dataDescriptor, "change");
|
|
22
|
-
const result = check(value, "change");
|
|
23
|
-
const { name } = dataDescriptor;
|
|
24
|
-
const { ok: wasOk, messages: existingMessages } = state;
|
|
25
|
-
if (result.ok) {
|
|
26
|
-
if (!wasOk) {
|
|
27
|
-
const fieldsInError = Object.keys(existingMessages);
|
|
28
|
-
if (fieldsInError.includes(name)) {
|
|
29
|
-
if (fieldsInError.length === 1) {
|
|
30
|
-
return { ok: true, messages: {} };
|
|
31
|
-
} else {
|
|
32
|
-
const messages = { ...existingMessages };
|
|
33
|
-
delete messages[name];
|
|
34
|
-
return { ok: false, messages };
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
} else {
|
|
39
|
-
return {
|
|
40
|
-
ok: false,
|
|
41
|
-
messages: {
|
|
42
|
-
...existingMessages,
|
|
43
|
-
[name]: result.messages.join("\n")
|
|
44
|
-
}
|
|
45
|
-
};
|
|
46
|
-
}
|
|
47
|
-
return state;
|
|
48
|
-
};
|
|
49
|
-
function find(descriptors, fieldname) {
|
|
50
|
-
const d = descriptors.find(({ name }) => name === fieldname);
|
|
51
|
-
if (d) {
|
|
52
|
-
return d;
|
|
53
|
-
}
|
|
54
|
-
throw Error(`DataValueDescriptor not found for field ${fieldname}`);
|
|
55
|
-
}
|
|
56
|
-
const getField = (target) => {
|
|
57
|
-
const fieldElement = vuuUtils.queryClosest(target, "[data-field]");
|
|
58
|
-
if (fieldElement) {
|
|
59
|
-
return fieldElement.dataset.field;
|
|
60
|
-
} else {
|
|
61
|
-
throw Error("no field ");
|
|
62
|
-
}
|
|
63
|
-
};
|
|
64
|
-
const useEditForm = ({
|
|
65
|
-
dataSource,
|
|
66
|
-
formFieldDescriptors,
|
|
67
|
-
onSubmit
|
|
68
|
-
}) => {
|
|
69
|
-
const { showDialog, closeDialog } = vuuPopups.useDialogContext();
|
|
70
|
-
const currentDataSource = react.useRef(void 0);
|
|
71
|
-
const formFieldsContainerRef = react.useRef(null);
|
|
72
|
-
const entityRef = react.useRef(void 0);
|
|
73
|
-
const focusedFieldRef = react.useRef("");
|
|
74
|
-
const originalEntityRef = react.useRef(void 0);
|
|
75
|
-
const formEditStateRef = react.useRef(formEditState.CLEAN_FORM);
|
|
76
|
-
const validationStateRef = react.useRef({
|
|
77
|
-
ok: true,
|
|
78
|
-
messages: {}
|
|
79
|
-
});
|
|
80
|
-
const [entity, _setEntity] = react.useState();
|
|
81
|
-
const [, forceUpdate] = react.useState({});
|
|
82
|
-
const setFormEditState = react.useCallback((newState) => {
|
|
83
|
-
formEditStateRef.current = newState;
|
|
84
|
-
}, []);
|
|
85
|
-
const setEntity = react.useCallback(
|
|
86
|
-
(newEntity) => {
|
|
87
|
-
setFormEditState(
|
|
88
|
-
formEditState.buildFormEditState(originalEntityRef.current, newEntity)
|
|
89
|
-
);
|
|
90
|
-
entityRef.current = newEntity;
|
|
91
|
-
_setEntity(newEntity);
|
|
92
|
-
},
|
|
93
|
-
[setFormEditState]
|
|
94
|
-
);
|
|
95
|
-
const submitChanges = react.useCallback(async () => {
|
|
96
|
-
const rpcResponse = await currentDataSource.current?.rpcCall?.(
|
|
97
|
-
vuuUtils.viewportRpcRequest("VP_BULK_EDIT_SUBMIT_RPC")
|
|
98
|
-
);
|
|
99
|
-
console.log({ rpcResponse });
|
|
100
|
-
}, []);
|
|
101
|
-
const showSaveOrDiscardPrompt = react.useCallback(async () => {
|
|
102
|
-
const { current: currentEntity } = entityRef;
|
|
103
|
-
const { current: originalEntity } = originalEntityRef;
|
|
104
|
-
let resolver = void 0;
|
|
105
|
-
const save = async () => {
|
|
106
|
-
await submitChanges();
|
|
107
|
-
closeDialog();
|
|
108
|
-
resolver?.("saved");
|
|
109
|
-
};
|
|
110
|
-
const discard = () => {
|
|
111
|
-
closeDialog();
|
|
112
|
-
resolver?.("discarded");
|
|
113
|
-
};
|
|
114
|
-
requestAnimationFrame(() => {
|
|
115
|
-
showDialog(
|
|
116
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
117
|
-
UnsavedChangesReport.UnsavedChangesReport,
|
|
118
|
-
{
|
|
119
|
-
entity: originalEntity,
|
|
120
|
-
editedEntity: currentEntity
|
|
121
|
-
}
|
|
122
|
-
),
|
|
123
|
-
"Unsaved Changes",
|
|
124
|
-
[
|
|
125
|
-
/* @__PURE__ */ jsxRuntime.jsx(core.Button, { onClick: discard, children: "Discard Changes" }, "cancel"),
|
|
126
|
-
/* @__PURE__ */ jsxRuntime.jsx(core.Button, { onClick: save, children: "Save Changes" }, "submit")
|
|
127
|
-
],
|
|
128
|
-
true
|
|
129
|
-
// hideCloseButton
|
|
130
|
-
);
|
|
131
|
-
});
|
|
132
|
-
return new Promise((resolve) => {
|
|
133
|
-
resolver = resolve;
|
|
134
|
-
});
|
|
135
|
-
}, [closeDialog, showDialog, submitChanges]);
|
|
136
|
-
react.useMemo(async () => {
|
|
137
|
-
if (dataSource) {
|
|
138
|
-
if (formEditStateRef.current.isClean === false) {
|
|
139
|
-
await showSaveOrDiscardPrompt();
|
|
140
|
-
}
|
|
141
|
-
currentDataSource.current = dataSource;
|
|
142
|
-
originalEntityRef.current = void 0;
|
|
143
|
-
const columnMap = vuuUtils.buildColumnMap(dataSource.columns);
|
|
144
|
-
dataSource?.subscribe({ range: vuuUtils.Range(0, 1) }, (message) => {
|
|
145
|
-
if (vuuUtils.messageHasDataRows(message)) {
|
|
146
|
-
const [row] = message.rows;
|
|
147
|
-
if (row) {
|
|
148
|
-
const entity2 = vuuUtils.dataSourceRowToEntity(row, columnMap);
|
|
149
|
-
if (originalEntityRef.current === void 0) {
|
|
150
|
-
originalEntityRef.current = entity2;
|
|
151
|
-
setEntity(entity2);
|
|
152
|
-
}
|
|
153
|
-
const { editedFields: editedFields2 } = formEditState.buildFormEditState(
|
|
154
|
-
entityRef.current,
|
|
155
|
-
entity2
|
|
156
|
-
);
|
|
157
|
-
if (editedFields2.length === 1) {
|
|
158
|
-
setEntity(entity2);
|
|
159
|
-
}
|
|
160
|
-
}
|
|
161
|
-
}
|
|
162
|
-
});
|
|
163
|
-
}
|
|
164
|
-
}, [dataSource, setEntity, showSaveOrDiscardPrompt]);
|
|
165
|
-
const setValidationState = react.useCallback((state) => {
|
|
166
|
-
validationStateRef.current = state;
|
|
167
|
-
forceUpdate({});
|
|
168
|
-
}, []);
|
|
169
|
-
const handleFieldCommit = react.useCallback(
|
|
170
|
-
(_, value) => {
|
|
171
|
-
const { current: fieldName } = focusedFieldRef;
|
|
172
|
-
const dataDescriptor = find(formFieldDescriptors, fieldName);
|
|
173
|
-
const { current: state } = validationStateRef;
|
|
174
|
-
const newState = nextValidationState(state, dataDescriptor, value);
|
|
175
|
-
if (newState !== state) {
|
|
176
|
-
setValidationState(newState);
|
|
177
|
-
}
|
|
178
|
-
if (newState.ok && dataSource?.tableSchema) {
|
|
179
|
-
const { key } = dataSource.tableSchema;
|
|
180
|
-
const keyValue = entity?.[key];
|
|
181
|
-
dataSource?.applyEdit(keyValue, fieldName, value).then((rpcResponse) => {
|
|
182
|
-
console.log({ rpcResponse });
|
|
183
|
-
});
|
|
184
|
-
}
|
|
185
|
-
},
|
|
186
|
-
[dataSource, entity, formFieldDescriptors, setValidationState]
|
|
187
|
-
);
|
|
188
|
-
const handleFieldChange = react.useCallback(
|
|
189
|
-
(evt) => {
|
|
190
|
-
const { current: fieldName } = focusedFieldRef;
|
|
191
|
-
if (fieldName) {
|
|
192
|
-
const input = vuuUtils.queryClosest(evt.target, "input", true);
|
|
193
|
-
const dataDescriptor = find(formFieldDescriptors, fieldName);
|
|
194
|
-
const value = input.value;
|
|
195
|
-
const { current: state } = validationStateRef;
|
|
196
|
-
const newState = nextValidationState(state, dataDescriptor, value);
|
|
197
|
-
if (newState !== state) {
|
|
198
|
-
setValidationState(newState);
|
|
199
|
-
}
|
|
200
|
-
setEntity({ ...entity, [fieldName]: value });
|
|
201
|
-
}
|
|
202
|
-
},
|
|
203
|
-
[entity, formFieldDescriptors, setEntity, setValidationState]
|
|
204
|
-
);
|
|
205
|
-
const handleFormSubmit = react.useCallback(async () => {
|
|
206
|
-
submitChanges();
|
|
207
|
-
setFormEditState(formEditState.CLEAN_FORM);
|
|
208
|
-
originalEntityRef.current = entity;
|
|
209
|
-
onSubmit?.();
|
|
210
|
-
forceUpdate({});
|
|
211
|
-
}, [entity, onSubmit, setFormEditState, submitChanges]);
|
|
212
|
-
const handleFormCancel = react.useCallback(async () => {
|
|
213
|
-
setFormEditState(formEditState.CLEAN_FORM);
|
|
214
|
-
setValidationState(CLEAN_VALIDATION);
|
|
215
|
-
setEntity(originalEntityRef.current);
|
|
216
|
-
}, [setEntity, setFormEditState, setValidationState]);
|
|
217
|
-
const handleFocus = react.useCallback((evt) => {
|
|
218
|
-
if (formFieldsContainerRef.current?.contains(evt.target)) {
|
|
219
|
-
const fieldName = getField(evt.target);
|
|
220
|
-
if (fieldName) {
|
|
221
|
-
if (fieldName) {
|
|
222
|
-
focusedFieldRef.current = fieldName;
|
|
223
|
-
}
|
|
224
|
-
}
|
|
225
|
-
}
|
|
226
|
-
}, []);
|
|
227
|
-
const {
|
|
228
|
-
current: { ok, messages: errorMessages }
|
|
229
|
-
} = validationStateRef;
|
|
230
|
-
const {
|
|
231
|
-
current: { isClean, editedFields }
|
|
232
|
-
} = formEditStateRef;
|
|
233
|
-
return {
|
|
234
|
-
editedFields,
|
|
235
|
-
editEntity: entity,
|
|
236
|
-
errorMessages,
|
|
237
|
-
formFieldsContainerRef,
|
|
238
|
-
isClean,
|
|
239
|
-
ok,
|
|
240
|
-
onCancel: handleFormCancel,
|
|
241
|
-
onChange: handleFieldChange,
|
|
242
|
-
onCommit: handleFieldCommit,
|
|
243
|
-
onFocus: handleFocus,
|
|
244
|
-
onSubmit: handleFormSubmit
|
|
245
|
-
};
|
|
246
|
-
};
|
|
247
|
-
|
|
248
|
-
exports.useEditForm = useEditForm;
|
|
249
|
-
//# sourceMappingURL=useEditForm.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useEditForm.js","sources":["../../src/data-editing/useEditForm.tsx"],"sourcesContent":["import type { DataSource, DataValueDescriptor } from \"@vuu-ui/vuu-data-types\";\nimport { useDialogContext } from \"@vuu-ui/vuu-popups\";\nimport type { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n CommitHandler,\n Entity,\n Range,\n buildColumnMap,\n dataSourceRowToEntity,\n messageHasDataRows,\n queryClosest,\n viewportRpcRequest,\n} from \"@vuu-ui/vuu-utils\";\nimport { Button } from \"@salt-ds/core\";\nimport {\n FocusEventHandler,\n SyntheticEvent,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { UnsavedChangesReport } from \"./UnsavedChangesReport\";\nimport {\n buildValidationChecker,\n getEditValidationRules,\n} from \"./edit-rule-validation-checker\";\nimport {\n CLEAN_FORM,\n FormEditState,\n buildFormEditState,\n} from \"./form-edit-state\";\n\nexport interface EditFormHookProps {\n dataSource?: DataSource;\n formFieldDescriptors: DataValueDescriptor[];\n onSubmit?: () => void;\n}\n\ntype ValidationState = {\n ok: boolean;\n messages: Record<string, string>;\n};\n\nconst CLEAN_VALIDATION: ValidationState = {\n ok: true,\n messages: {},\n};\n\nconst getValidationChecker = (\n descriptor: DataValueDescriptor,\n editPhase: \"change\" | \"commit\",\n) => {\n const rules = getEditValidationRules(descriptor, editPhase) ?? [];\n return buildValidationChecker(rules);\n};\n\nconst nextValidationState = (\n state: ValidationState,\n dataDescriptor: DataValueDescriptor,\n value: VuuRowDataItemType,\n): ValidationState => {\n const check = getValidationChecker(dataDescriptor, \"change\");\n const result = check(value, \"change\");\n const { name } = dataDescriptor;\n\n const { ok: wasOk, messages: existingMessages } = state;\n\n if (result.ok) {\n if (!wasOk) {\n // if this field was the only one in error, the overall state\n // will now be ok, but not if there is still one or more other\n // field still in error.\n const fieldsInError = Object.keys(existingMessages);\n if (fieldsInError.includes(name)) {\n if (fieldsInError.length === 1) {\n return { ok: true, messages: {} };\n } else {\n const messages = { ...existingMessages };\n delete messages[name];\n return { ok: false, messages };\n }\n }\n }\n } else {\n return {\n ok: false,\n messages: {\n ...existingMessages,\n [name]: result.messages.join(\"\\n\"),\n },\n };\n }\n\n return state;\n};\n\nfunction find(descriptors: DataValueDescriptor[], fieldname: string) {\n const d = descriptors.find(({ name }) => name === fieldname);\n if (d) {\n return d;\n }\n throw Error(`DataValueDescriptor not found for field ${fieldname}`);\n}\n\nconst getField = (target: EventTarget | HTMLElement) => {\n const fieldElement = queryClosest(target, \"[data-field]\");\n if (fieldElement) {\n return fieldElement.dataset.field as string;\n } else {\n throw Error(\"no field \");\n }\n};\n\ntype Resolver = (value: unknown) => void;\n\nexport const useEditForm = ({\n dataSource,\n formFieldDescriptors,\n onSubmit,\n}: EditFormHookProps) => {\n const { showDialog, closeDialog } = useDialogContext();\n\n const currentDataSource = useRef<DataSource>(undefined);\n const formFieldsContainerRef = useRef<HTMLDivElement>(null);\n const entityRef = useRef<Entity>(undefined);\n const focusedFieldRef = useRef(\"\");\n const originalEntityRef = useRef<Entity>(undefined);\n const formEditStateRef = useRef<FormEditState>(CLEAN_FORM);\n const validationStateRef = useRef<ValidationState>({\n ok: true,\n messages: {},\n });\n\n const [entity, _setEntity] = useState<Entity>();\n const [, forceUpdate] = useState({});\n\n const setFormEditState = useCallback((newState: FormEditState) => {\n formEditStateRef.current = newState;\n }, []);\n\n const setEntity = useCallback(\n (newEntity: Entity) => {\n setFormEditState(\n buildFormEditState(originalEntityRef.current, newEntity),\n );\n entityRef.current = newEntity;\n _setEntity(newEntity);\n },\n [setFormEditState],\n );\n\n const submitChanges = useCallback(async () => {\n const rpcResponse = await currentDataSource.current?.rpcCall?.(\n viewportRpcRequest(\"VP_BULK_EDIT_SUBMIT_RPC\"),\n );\n console.log({ rpcResponse });\n }, []);\n\n const showSaveOrDiscardPrompt = useCallback(async () => {\n const { current: currentEntity } = entityRef;\n const { current: originalEntity } = originalEntityRef;\n let resolver: Resolver | undefined = undefined;\n const save = async () => {\n await submitChanges();\n closeDialog();\n resolver?.(\"saved\");\n };\n\n const discard = () => {\n closeDialog();\n resolver?.(\"discarded\");\n };\n\n requestAnimationFrame(() => {\n showDialog(\n <UnsavedChangesReport\n entity={originalEntity as Entity}\n editedEntity={currentEntity as Entity}\n />,\n \"Unsaved Changes\",\n [\n <Button key=\"cancel\" onClick={discard}>\n Discard Changes\n </Button>,\n <Button key=\"submit\" onClick={save}>\n Save Changes\n </Button>,\n ],\n true, // hideCloseButton\n );\n });\n\n return new Promise((resolve) => {\n resolver = resolve;\n });\n }, [closeDialog, showDialog, submitChanges]);\n\n useMemo(async () => {\n if (dataSource) {\n if (formEditStateRef.current.isClean === false) {\n await showSaveOrDiscardPrompt();\n }\n\n currentDataSource.current = dataSource;\n\n originalEntityRef.current = undefined;\n\n const columnMap = buildColumnMap(dataSource.columns);\n\n dataSource?.subscribe({ range: Range(0, 1) }, (message) => {\n if (messageHasDataRows(message)) {\n const [row] = message.rows;\n if (row) {\n const entity = dataSourceRowToEntity(row, columnMap);\n if (originalEntityRef.current === undefined) {\n originalEntityRef.current = entity;\n setEntity(entity);\n }\n\n const { editedFields } = buildFormEditState(\n entityRef.current,\n entity,\n );\n\n // for controls which do not yield incremental changes, e.g dropdown, calendar\n // we apply the server update to our entity.\n if (editedFields.length === 1) {\n setEntity(entity);\n }\n\n // Do not overwrite entity here, just check that values returned by server\n // match whats expected\n }\n }\n });\n }\n }, [dataSource, setEntity, showSaveOrDiscardPrompt]);\n\n const setValidationState = useCallback((state: ValidationState) => {\n validationStateRef.current = state;\n forceUpdate({});\n }, []);\n\n const handleFieldCommit = useCallback<CommitHandler<HTMLElement>>(\n (_, value) => {\n const { current: fieldName } = focusedFieldRef;\n const dataDescriptor = find(formFieldDescriptors, fieldName);\n\n const { current: state } = validationStateRef;\n const newState = nextValidationState(state, dataDescriptor, value);\n if (newState !== state) {\n setValidationState(newState);\n }\n\n if (newState.ok && dataSource?.tableSchema) {\n const { key } = dataSource.tableSchema;\n const keyValue = entity?.[key] as string;\n dataSource\n ?.applyEdit(keyValue, fieldName, value)\n .then((rpcResponse) => {\n console.log({ rpcResponse });\n });\n }\n },\n [dataSource, entity, formFieldDescriptors, setValidationState],\n );\n\n const handleFieldChange = useCallback(\n (evt: SyntheticEvent<HTMLInputElement>) => {\n const { current: fieldName } = focusedFieldRef;\n if (fieldName) {\n const input = queryClosest<HTMLInputElement>(evt.target, \"input\", true);\n const dataDescriptor = find(formFieldDescriptors, fieldName);\n const value = input.value as string;\n const { current: state } = validationStateRef;\n const newState = nextValidationState(state, dataDescriptor, value);\n if (newState !== state) {\n setValidationState(newState);\n }\n\n setEntity({ ...entity, [fieldName]: value });\n }\n },\n [entity, formFieldDescriptors, setEntity, setValidationState],\n );\n\n const handleFormSubmit = useCallback(async () => {\n submitChanges();\n setFormEditState(CLEAN_FORM);\n originalEntityRef.current = entity;\n onSubmit?.();\n forceUpdate({});\n }, [entity, onSubmit, setFormEditState, submitChanges]);\n\n const handleFormCancel = useCallback(async () => {\n // const rpcResponse = await dataSource?.rpcCall?.(\n // viewportRpcRequest(\"VP_BULK_EDIT_CANCEL_RPC\"),\n // );\n setFormEditState(CLEAN_FORM);\n setValidationState(CLEAN_VALIDATION);\n // console.log({ rpcResponse });\n setEntity(originalEntityRef.current as Entity);\n }, [setEntity, setFormEditState, setValidationState]);\n\n const handleFocus = useCallback<FocusEventHandler>((evt) => {\n // Ignore focus on popup Calendars, Lists etc\n if (formFieldsContainerRef.current?.contains(evt.target)) {\n const fieldName = getField(evt.target);\n if (fieldName) {\n if (fieldName) {\n focusedFieldRef.current = fieldName;\n }\n }\n }\n }, []);\n\n const {\n current: { ok, messages: errorMessages },\n } = validationStateRef;\n\n const {\n current: { isClean, editedFields },\n } = formEditStateRef;\n\n return {\n editedFields,\n editEntity: entity,\n errorMessages,\n formFieldsContainerRef,\n isClean,\n ok,\n onCancel: handleFormCancel,\n onChange: handleFieldChange,\n onCommit: handleFieldCommit,\n onFocus: handleFocus,\n onSubmit: handleFormSubmit,\n };\n};\n"],"names":["getEditValidationRules","buildValidationChecker","queryClosest","useDialogContext","useRef","CLEAN_FORM","useState","useCallback","buildFormEditState","viewportRpcRequest","jsx","UnsavedChangesReport","Button","useMemo","buildColumnMap","Range","messageHasDataRows","entity","dataSourceRowToEntity","editedFields"],"mappings":"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"}
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var vuuDataRemote = require('@vuu-ui/vuu-data-remote');
|
|
5
|
-
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
6
|
-
|
|
7
|
-
const serverAPI = (schemas) => ({
|
|
8
|
-
getTableList: async () => {
|
|
9
|
-
if (schemas) {
|
|
10
|
-
return {
|
|
11
|
-
tables: Object.keys(schemas).map((key) => {
|
|
12
|
-
const [module, table] = key.split(":");
|
|
13
|
-
return { module, table };
|
|
14
|
-
})
|
|
15
|
-
};
|
|
16
|
-
} else {
|
|
17
|
-
console.log(`Rest data source does not yet support table list`);
|
|
18
|
-
return { tables: [] };
|
|
19
|
-
}
|
|
20
|
-
},
|
|
21
|
-
getTableSchema: async ({ module, table }) => {
|
|
22
|
-
const schema = schemas?.[`${module}:${table}`];
|
|
23
|
-
if (schema) {
|
|
24
|
-
return schema;
|
|
25
|
-
} else {
|
|
26
|
-
throw Error(
|
|
27
|
-
`Rest data source does not yet support table schema (${table})`
|
|
28
|
-
);
|
|
29
|
-
}
|
|
30
|
-
},
|
|
31
|
-
rpcCall: async (message) => Promise.reject(
|
|
32
|
-
Error(`Rest data source does not yet support RPC (${message.type})`)
|
|
33
|
-
)
|
|
34
|
-
});
|
|
35
|
-
const getServerAPI = (schemas) => async () => serverAPI(schemas);
|
|
36
|
-
const isRestDataSourceExtension = (o) => {
|
|
37
|
-
return vuuUtils.isObject(o) && "createHttpHeaders" in o && typeof o["createHttpHeaders"] === "function";
|
|
38
|
-
};
|
|
39
|
-
const getRestDataSourceClass = ({
|
|
40
|
-
createHttpHeaders
|
|
41
|
-
}) => {
|
|
42
|
-
if (createHttpHeaders) {
|
|
43
|
-
return class ExtendedClass extends vuuDataRemote.RestDataSource {
|
|
44
|
-
constructor(props) {
|
|
45
|
-
super(props);
|
|
46
|
-
}
|
|
47
|
-
get httpHeaders() {
|
|
48
|
-
return createHttpHeaders();
|
|
49
|
-
}
|
|
50
|
-
};
|
|
51
|
-
} else {
|
|
52
|
-
return vuuDataRemote.RestDataSource;
|
|
53
|
-
}
|
|
54
|
-
};
|
|
55
|
-
const RestDataSourceProvider = ({
|
|
56
|
-
children,
|
|
57
|
-
createHttpHeaders,
|
|
58
|
-
tableSchemas,
|
|
59
|
-
url
|
|
60
|
-
}) => {
|
|
61
|
-
vuuDataRemote.RestDataSource.api = url;
|
|
62
|
-
const restDataSourceClass = getRestDataSourceClass({ createHttpHeaders });
|
|
63
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
64
|
-
vuuUtils.DataProvider,
|
|
65
|
-
{
|
|
66
|
-
VuuDataSource: restDataSourceClass,
|
|
67
|
-
dataSourceExtensions: { createHttpHeaders },
|
|
68
|
-
getServerAPI: getServerAPI(tableSchemas),
|
|
69
|
-
isLocalData: false,
|
|
70
|
-
tableSchemas,
|
|
71
|
-
children
|
|
72
|
-
}
|
|
73
|
-
);
|
|
74
|
-
};
|
|
75
|
-
|
|
76
|
-
exports.RestDataSourceProvider = RestDataSourceProvider;
|
|
77
|
-
exports.isRestDataSourceExtension = isRestDataSourceExtension;
|
|
78
|
-
//# sourceMappingURL=RestDataSourceProvider.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RestDataSourceProvider.js","sources":["../../src/datasource-provider/RestDataSourceProvider.tsx"],"sourcesContent":["import { RestDataSource } from \"@vuu-ui/vuu-data-remote\";\nimport {\n DataSourceConstructorProps,\n ServerAPI,\n TableSchema,\n} from \"@vuu-ui/vuu-data-types\";\nimport {\n VuuCreateVisualLink,\n VuuRemoveVisualLink,\n VuuRpcMenuRequest,\n VuuRpcServiceRequest,\n VuuRpcViewportRequest,\n VuuTable,\n} from \"@vuu-ui/vuu-protocol-types\";\nimport { DataProvider, isObject } from \"@vuu-ui/vuu-utils\";\nimport { ReactNode } from \"react\";\n\nconst serverAPI = (\n schemas?: Record<string, TableSchema>,\n): Pick<ServerAPI, \"getTableList\" | \"getTableSchema\" | \"rpcCall\"> => ({\n getTableList: async () => {\n if (schemas) {\n return {\n tables: Object.keys(schemas).map((key) => {\n const [module, table] = key.split(\":\");\n return { module, table };\n }),\n };\n } else {\n console.log(`Rest data source does not yet support table list`);\n return { tables: [] };\n }\n },\n getTableSchema: async ({ module, table }: VuuTable) => {\n const schema = schemas?.[`${module}:${table}`];\n if (schema) {\n return schema;\n } else {\n throw Error(\n `Rest data source does not yet support table schema (${table})`,\n );\n }\n },\n rpcCall: async (\n message:\n | VuuRpcServiceRequest\n | VuuRpcMenuRequest\n | VuuRpcViewportRequest\n | VuuCreateVisualLink\n | VuuRemoveVisualLink,\n ) =>\n Promise.reject(\n Error(`Rest data source does not yet support RPC (${message.type})`),\n ),\n});\n\nconst getServerAPI = (schemas?: Record<string, TableSchema>) => async () =>\n serverAPI(schemas);\n\nexport type RestDataSourceExtension = {\n createHttpHeaders?: () => Headers;\n};\n\nexport const isRestDataSourceExtension = (\n o?: unknown,\n): o is RestDataSourceExtension => {\n return (\n isObject(o) &&\n \"createHttpHeaders\" in o &&\n typeof o[\"createHttpHeaders\"] === \"function\"\n );\n};\n\nconst getRestDataSourceClass = ({\n createHttpHeaders,\n}: RestDataSourceExtension) => {\n if (createHttpHeaders) {\n return class ExtendedClass extends RestDataSource {\n constructor(props: DataSourceConstructorProps) {\n super(props);\n }\n get httpHeaders(): Headers | undefined {\n return createHttpHeaders();\n }\n };\n } else {\n return RestDataSource;\n }\n};\n\nexport const RestDataSourceProvider = ({\n children,\n createHttpHeaders,\n tableSchemas,\n url,\n}: {\n children: ReactNode;\n tableSchemas?: Record<string, TableSchema>;\n url: string;\n} & RestDataSourceExtension) => {\n RestDataSource.api = url;\n\n const restDataSourceClass = getRestDataSourceClass({ createHttpHeaders });\n\n return (\n <DataProvider\n VuuDataSource={restDataSourceClass}\n dataSourceExtensions={{ createHttpHeaders }}\n getServerAPI={getServerAPI(tableSchemas)}\n isLocalData={false}\n tableSchemas={tableSchemas}\n >\n {children}\n </DataProvider>\n );\n};\n"],"names":["isObject","RestDataSource","jsx","DataProvider"],"mappings":";;;;;;AAiBA,MAAM,SAAA,GAAY,CAChB,OACoE,MAAA;AAAA,EACpE,cAAc,YAAY;AACxB,IAAA,IAAI,OAAS,EAAA;AACX,MAAO,OAAA;AAAA,QACL,QAAQ,MAAO,CAAA,IAAA,CAAK,OAAO,CAAE,CAAA,GAAA,CAAI,CAAC,GAAQ,KAAA;AACxC,UAAA,MAAM,CAAC,MAAQ,EAAA,KAAK,CAAI,GAAA,GAAA,CAAI,MAAM,GAAG,CAAA;AACrC,UAAO,OAAA,EAAE,QAAQ,KAAM,EAAA;AAAA,SACxB;AAAA,OACH;AAAA,KACK,MAAA;AACL,MAAA,OAAA,CAAQ,IAAI,CAAkD,gDAAA,CAAA,CAAA;AAC9D,MAAO,OAAA,EAAE,MAAQ,EAAA,EAAG,EAAA;AAAA;AACtB,GACF;AAAA,EACA,cAAgB,EAAA,OAAO,EAAE,MAAA,EAAQ,OAAsB,KAAA;AACrD,IAAA,MAAM,SAAS,OAAU,GAAA,CAAA,EAAG,MAAM,CAAA,CAAA,EAAI,KAAK,CAAE,CAAA,CAAA;AAC7C,IAAA,IAAI,MAAQ,EAAA;AACV,MAAO,OAAA,MAAA;AAAA,KACF,MAAA;AACL,MAAM,MAAA,KAAA;AAAA,QACJ,uDAAuD,KAAK,CAAA,CAAA;AAAA,OAC9D;AAAA;AACF,GACF;AAAA,EACA,OAAA,EAAS,OACP,OAAA,KAOA,OAAQ,CAAA,MAAA;AAAA,IACN,KAAM,CAAA,CAAA,2CAAA,EAA8C,OAAQ,CAAA,IAAI,CAAG,CAAA,CAAA;AAAA;AAEzE,CAAA,CAAA;AAEA,MAAM,YAAe,GAAA,CAAC,OAA0C,KAAA,YAC9D,UAAU,OAAO,CAAA;AAMN,MAAA,yBAAA,GAA4B,CACvC,CACiC,KAAA;AACjC,EACE,OAAAA,iBAAA,CAAS,CAAC,CACV,IAAA,mBAAA,IAAuB,KACvB,OAAO,CAAA,CAAE,mBAAmB,CAAM,KAAA,UAAA;AAEtC;AAEA,MAAM,yBAAyB,CAAC;AAAA,EAC9B;AACF,CAA+B,KAAA;AAC7B,EAAA,IAAI,iBAAmB,EAAA;AACrB,IAAO,OAAA,MAAM,sBAAsBC,4BAAe,CAAA;AAAA,MAChD,YAAY,KAAmC,EAAA;AAC7C,QAAA,KAAA,CAAM,KAAK,CAAA;AAAA;AACb,MACA,IAAI,WAAmC,GAAA;AACrC,QAAA,OAAO,iBAAkB,EAAA;AAAA;AAC3B,KACF;AAAA,GACK,MAAA;AACL,IAAO,OAAAA,4BAAA;AAAA;AAEX,CAAA;AAEO,MAAM,yBAAyB,CAAC;AAAA,EACrC,QAAA;AAAA,EACA,iBAAA;AAAA,EACA,YAAA;AAAA,EACA;AACF,CAIgC,KAAA;AAC9B,EAAAA,4BAAA,CAAe,GAAM,GAAA,GAAA;AAErB,EAAA,MAAM,mBAAsB,GAAA,sBAAA,CAAuB,EAAE,iBAAA,EAAmB,CAAA;AAExE,EACE,uBAAAC,cAAA;AAAA,IAACC,qBAAA;AAAA,IAAA;AAAA,MACC,aAAe,EAAA,mBAAA;AAAA,MACf,oBAAA,EAAsB,EAAE,iBAAkB,EAAA;AAAA,MAC1C,YAAA,EAAc,aAAa,YAAY,CAAA;AAAA,MACvC,WAAa,EAAA,KAAA;AAAA,MACb,YAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;;;;"}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var vuuDataRemote = require('@vuu-ui/vuu-data-remote');
|
|
5
|
-
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
6
|
-
var useAutoLoginToVuuServer = require('./useAutoLoginToVuuServer.js');
|
|
7
|
-
|
|
8
|
-
const getServerAPI = () => vuuDataRemote.ConnectionManager.serverAPI;
|
|
9
|
-
const VuuDataSourceProvider = ({
|
|
10
|
-
authenticate,
|
|
11
|
-
autoConnect = false,
|
|
12
|
-
autoLogin = false,
|
|
13
|
-
children,
|
|
14
|
-
websocketUrl
|
|
15
|
-
}) => {
|
|
16
|
-
useAutoLoginToVuuServer.useAutoLoginToVuuServer({
|
|
17
|
-
authenticate,
|
|
18
|
-
autoConnect,
|
|
19
|
-
autoLogin,
|
|
20
|
-
websocketUrl
|
|
21
|
-
});
|
|
22
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
23
|
-
vuuUtils.DataProvider,
|
|
24
|
-
{
|
|
25
|
-
VuuDataSource: vuuDataRemote.VuuDataSource,
|
|
26
|
-
getServerAPI,
|
|
27
|
-
isLocalData: false,
|
|
28
|
-
children
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
};
|
|
32
|
-
|
|
33
|
-
exports.VuuDataSourceProvider = VuuDataSourceProvider;
|
|
34
|
-
//# sourceMappingURL=VuuDataSourceProvider.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"VuuDataSourceProvider.js","sources":["../../src/datasource-provider/VuuDataSourceProvider.tsx"],"sourcesContent":["import { ConnectionManager, VuuDataSource } from \"@vuu-ui/vuu-data-remote\";\nimport { DataProvider } from \"@vuu-ui/vuu-utils\";\nimport { ReactNode } from \"react\";\nimport { useAutoLoginToVuuServer } from \"./useAutoLoginToVuuServer\";\n\nconst getServerAPI = () => ConnectionManager.serverAPI;\n\nexport const VuuDataSourceProvider = ({\n authenticate,\n autoConnect = false,\n autoLogin = false,\n children,\n websocketUrl,\n}: {\n authenticate?: boolean;\n autoConnect?: boolean;\n autoLogin?: boolean;\n children: ReactNode;\n websocketUrl?: string;\n}) => {\n useAutoLoginToVuuServer({\n authenticate,\n autoConnect,\n autoLogin,\n websocketUrl,\n });\n return (\n <DataProvider\n VuuDataSource={VuuDataSource}\n getServerAPI={getServerAPI}\n isLocalData={false}\n >\n {children}\n </DataProvider>\n );\n};\n"],"names":["ConnectionManager","useAutoLoginToVuuServer","jsx","DataProvider","VuuDataSource"],"mappings":";;;;;;;AAKA,MAAM,YAAA,GAAe,MAAMA,+BAAkB,CAAA,SAAA;AAEtC,MAAM,wBAAwB,CAAC;AAAA,EACpC,YAAA;AAAA,EACA,WAAc,GAAA,KAAA;AAAA,EACd,SAAY,GAAA,KAAA;AAAA,EACZ,QAAA;AAAA,EACA;AACF,CAMM,KAAA;AACJ,EAAwBC,+CAAA,CAAA;AAAA,IACtB,YAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA;AAAA,GACD,CAAA;AACD,EACE,uBAAAC,cAAA;AAAA,IAACC,qBAAA;AAAA,IAAA;AAAA,qBACCC,2BAAA;AAAA,MACA,YAAA;AAAA,MACA,WAAa,EAAA,KAAA;AAAA,MAEZ;AAAA;AAAA,GACH;AAEJ;;;;"}
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var vuuDataRemote = require('@vuu-ui/vuu-data-remote');
|
|
5
|
-
var react = require('react');
|
|
6
|
-
|
|
7
|
-
const useAutoLoginToVuuServer = ({
|
|
8
|
-
authenticate = true,
|
|
9
|
-
autoConnect = true,
|
|
10
|
-
// autoLogin = true,
|
|
11
|
-
secure = true,
|
|
12
|
-
websocketUrl
|
|
13
|
-
} = {}) => {
|
|
14
|
-
const [errorMessage, setErrorMessage] = react.useState("");
|
|
15
|
-
react.useEffect(() => {
|
|
16
|
-
const connect = async () => {
|
|
17
|
-
try {
|
|
18
|
-
let token = "no-token";
|
|
19
|
-
if (authenticate) {
|
|
20
|
-
token = await vuuDataRemote.authenticate(
|
|
21
|
-
"steve",
|
|
22
|
-
"xyz",
|
|
23
|
-
"/api/authn"
|
|
24
|
-
);
|
|
25
|
-
}
|
|
26
|
-
const url = websocketUrl ?? `${secure ? "wss" : "ws"}://localhost/8090/websocket`;
|
|
27
|
-
vuuDataRemote.ConnectionManager.connect({
|
|
28
|
-
url,
|
|
29
|
-
token,
|
|
30
|
-
username: "steve"
|
|
31
|
-
});
|
|
32
|
-
} catch (e) {
|
|
33
|
-
if (e instanceof Error) {
|
|
34
|
-
console.error(e.message);
|
|
35
|
-
setErrorMessage(e.message);
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
};
|
|
39
|
-
if (autoConnect) {
|
|
40
|
-
connect();
|
|
41
|
-
}
|
|
42
|
-
return () => {
|
|
43
|
-
if (autoConnect) {
|
|
44
|
-
vuuDataRemote.ConnectionManager.disconnect();
|
|
45
|
-
}
|
|
46
|
-
};
|
|
47
|
-
}, [authenticate, autoConnect, secure, websocketUrl]);
|
|
48
|
-
if (errorMessage) {
|
|
49
|
-
return /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Unable to authenticate against Vuu Server A Vuu Server instance must be running to show this example." });
|
|
50
|
-
}
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
exports.useAutoLoginToVuuServer = useAutoLoginToVuuServer;
|
|
54
|
-
//# sourceMappingURL=useAutoLoginToVuuServer.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useAutoLoginToVuuServer.js","sources":["../../src/datasource-provider/useAutoLoginToVuuServer.tsx"],"sourcesContent":["import {\n authenticate as vuuAuthenticate,\n ConnectionManager,\n} from \"@vuu-ui/vuu-data-remote\";\nimport { useEffect, useState } from \"react\";\n\nexport const useAutoLoginToVuuServer = ({\n authenticate = true,\n autoConnect = true,\n // autoLogin = true,\n secure = true,\n websocketUrl,\n}: {\n authenticate?: boolean;\n autoConnect?: boolean;\n autoLogin?: boolean;\n secure?: boolean;\n websocketUrl?: string;\n} = {}) => {\n const [errorMessage, setErrorMessage] = useState(\"\");\n useEffect(() => {\n const connect = async () => {\n try {\n let token = \"no-token\";\n if (authenticate) {\n token = (await vuuAuthenticate(\n \"steve\",\n \"xyz\",\n \"/api/authn\",\n )) as string;\n }\n\n const url =\n websocketUrl ?? `${secure ? \"wss\" : \"ws\"}://localhost/8090/websocket`;\n\n ConnectionManager.connect({\n url,\n token,\n username: \"steve\",\n });\n } catch (e: unknown) {\n if (e instanceof Error) {\n console.error(e.message);\n setErrorMessage(e.message);\n }\n }\n };\n if (autoConnect) {\n connect();\n }\n\n return () => {\n if (autoConnect) {\n ConnectionManager.disconnect();\n }\n };\n }, [authenticate, autoConnect, secure, websocketUrl]);\n\n if (errorMessage) {\n return (\n <p>\n Unable to authenticate against Vuu Server A Vuu Server instance must be\n running to show this example.\n </p>\n );\n }\n};\n"],"names":["useState","useEffect","vuuAuthenticate","ConnectionManager","jsx"],"mappings":";;;;;;AAMO,MAAM,0BAA0B,CAAC;AAAA,EACtC,YAAe,GAAA,IAAA;AAAA,EACf,WAAc,GAAA,IAAA;AAAA;AAAA,EAEd,MAAS,GAAA,IAAA;AAAA,EACT;AACF,CAAA,GAMI,EAAO,KAAA;AACT,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIA,eAAS,EAAE,CAAA;AACnD,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,MAAM,UAAU,YAAY;AAC1B,MAAI,IAAA;AACF,QAAA,IAAI,KAAQ,GAAA,UAAA;AACZ,QAAA,IAAI,YAAc,EAAA;AAChB,UAAA,KAAA,GAAS,MAAMC,0BAAA;AAAA,YACb,OAAA;AAAA,YACA,KAAA;AAAA,YACA;AAAA,WACF;AAAA;AAGF,QAAA,MAAM,GACJ,GAAA,YAAA,IAAgB,CAAG,EAAA,MAAA,GAAS,QAAQ,IAAI,CAAA,2BAAA,CAAA;AAE1C,QAAAC,+BAAA,CAAkB,OAAQ,CAAA;AAAA,UACxB,GAAA;AAAA,UACA,KAAA;AAAA,UACA,QAAU,EAAA;AAAA,SACX,CAAA;AAAA,eACM,CAAY,EAAA;AACnB,QAAA,IAAI,aAAa,KAAO,EAAA;AACtB,UAAQ,OAAA,CAAA,KAAA,CAAM,EAAE,OAAO,CAAA;AACvB,UAAA,eAAA,CAAgB,EAAE,OAAO,CAAA;AAAA;AAC3B;AACF,KACF;AACA,IAAA,IAAI,WAAa,EAAA;AACf,MAAQ,OAAA,EAAA;AAAA;AAGV,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,WAAa,EAAA;AACf,QAAAA,+BAAA,CAAkB,UAAW,EAAA;AAAA;AAC/B,KACF;AAAA,KACC,CAAC,YAAA,EAAc,WAAa,EAAA,MAAA,EAAQ,YAAY,CAAC,CAAA;AAEpD,EAAA,IAAI,YAAc,EAAA;AAChB,IACE,uBAAAC,cAAA,CAAC,OAAE,QAGH,EAAA,uGAAA,EAAA,CAAA;AAAA;AAGN;;;;"}
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var vuuDataRemote = require('@vuu-ui/vuu-data-remote');
|
|
4
|
-
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
5
|
-
var react = require('react');
|
|
6
|
-
|
|
7
|
-
const NO_VALUES = [];
|
|
8
|
-
const toListOption = (value) => ({
|
|
9
|
-
label: value,
|
|
10
|
-
value
|
|
11
|
-
});
|
|
12
|
-
const lookupValueMap = /* @__PURE__ */ new Map();
|
|
13
|
-
const loadLookupValues = ({
|
|
14
|
-
labelColumn,
|
|
15
|
-
table,
|
|
16
|
-
valueColumn
|
|
17
|
-
}) => {
|
|
18
|
-
const tableKey = `${table.module}:${table.table}`;
|
|
19
|
-
const lookupValues = lookupValueMap.get(tableKey);
|
|
20
|
-
if (lookupValues) {
|
|
21
|
-
return lookupValues;
|
|
22
|
-
} else {
|
|
23
|
-
const promise = new Promise((resolve) => {
|
|
24
|
-
const columns = [valueColumn, labelColumn];
|
|
25
|
-
const columnMap = vuuUtils.buildColumnMap(columns);
|
|
26
|
-
const dataSource = new vuuDataRemote.VuuDataSource({
|
|
27
|
-
bufferSize: 0,
|
|
28
|
-
table
|
|
29
|
-
});
|
|
30
|
-
dataSource.subscribe(
|
|
31
|
-
{
|
|
32
|
-
columns,
|
|
33
|
-
range: vuuUtils.Range(0, 100)
|
|
34
|
-
},
|
|
35
|
-
(message) => {
|
|
36
|
-
if (message.type === "viewport-update") {
|
|
37
|
-
if (message.rows) {
|
|
38
|
-
const listOptions = message.rows.map((row) => ({
|
|
39
|
-
value: row[columnMap[valueColumn]],
|
|
40
|
-
label: row[columnMap[labelColumn]]
|
|
41
|
-
}));
|
|
42
|
-
resolve(listOptions);
|
|
43
|
-
dataSource.unsubscribe();
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
);
|
|
48
|
-
});
|
|
49
|
-
lookupValueMap.set(tableKey, promise);
|
|
50
|
-
return promise;
|
|
51
|
-
}
|
|
52
|
-
};
|
|
53
|
-
const getLookupDetails = ({ name, type }) => {
|
|
54
|
-
if (vuuUtils.isTypeDescriptor(type) && vuuUtils.isLookupRenderer(type.renderer)) {
|
|
55
|
-
return type.renderer.lookup;
|
|
56
|
-
} else {
|
|
57
|
-
throw Error(
|
|
58
|
-
`useLookupValues column ${name} is not configured to use lookup values`
|
|
59
|
-
);
|
|
60
|
-
}
|
|
61
|
-
};
|
|
62
|
-
const useLookupValues = (column, initialValueProp) => {
|
|
63
|
-
const { type: columnType } = column;
|
|
64
|
-
const { getLookupValues } = vuuUtils.useShellContext();
|
|
65
|
-
const initialState = react.useMemo(() => {
|
|
66
|
-
if (vuuUtils.isTypeDescriptor(columnType) && vuuUtils.isValueListRenderer(columnType?.renderer)) {
|
|
67
|
-
const values2 = columnType.renderer.values.map(toListOption);
|
|
68
|
-
return {
|
|
69
|
-
initialValue: vuuUtils.getSelectedOption(values2, initialValueProp) ?? null,
|
|
70
|
-
values: values2
|
|
71
|
-
};
|
|
72
|
-
} else {
|
|
73
|
-
const lookupDetails = getLookupDetails(column);
|
|
74
|
-
const values2 = getLookupValues?.(lookupDetails.table) ?? NO_VALUES;
|
|
75
|
-
return {
|
|
76
|
-
initialValue: vuuUtils.getSelectedOption(values2, initialValueProp) ?? null,
|
|
77
|
-
values: values2
|
|
78
|
-
};
|
|
79
|
-
}
|
|
80
|
-
}, [column, columnType, getLookupValues, initialValueProp]);
|
|
81
|
-
const [{ initialValue, values }, setLookupState] = react.useState(initialState);
|
|
82
|
-
react.useMemo(() => {
|
|
83
|
-
if (values === NO_VALUES) {
|
|
84
|
-
const lookupDetails = getLookupDetails(column);
|
|
85
|
-
loadLookupValues(lookupDetails).then(
|
|
86
|
-
(values2) => setLookupState({
|
|
87
|
-
initialValue: vuuUtils.getSelectedOption(values2, initialValueProp) ?? null,
|
|
88
|
-
values: values2
|
|
89
|
-
})
|
|
90
|
-
);
|
|
91
|
-
}
|
|
92
|
-
}, [values, column, initialValueProp]);
|
|
93
|
-
return {
|
|
94
|
-
initialValue,
|
|
95
|
-
values
|
|
96
|
-
};
|
|
97
|
-
};
|
|
98
|
-
|
|
99
|
-
exports.useLookupValues = useLookupValues;
|
|
100
|
-
//# sourceMappingURL=useLookupValues.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useLookupValues.js","sources":["../../src/hooks/useLookupValues.ts"],"sourcesContent":["import {\n ColumnDescriptor,\n ListOption,\n LookupTableDetails,\n} from \"@vuu-ui/vuu-table-types\";\nimport { VuuDataSource } from \"@vuu-ui/vuu-data-remote\";\nimport {\n buildColumnMap,\n getSelectedOption,\n isLookupRenderer,\n isTypeDescriptor,\n isValueListRenderer,\n Range,\n useShellContext,\n} from \"@vuu-ui/vuu-utils\";\nimport { useMemo, useState } from \"react\";\n\nconst NO_VALUES: ListOption[] = [];\n\nconst toListOption = (value: string): ListOption => ({\n label: value,\n value,\n});\n\nconst lookupValueMap = new Map<string, Promise<ListOption[]>>();\n\nconst loadLookupValues = ({\n labelColumn,\n table,\n valueColumn,\n}: LookupTableDetails): Promise<ListOption[]> => {\n const tableKey = `${table.module}:${table.table}`;\n const lookupValues = lookupValueMap.get(tableKey);\n if (lookupValues) {\n return lookupValues;\n } else {\n const promise: Promise<ListOption[]> = new Promise((resolve) => {\n const columns = [valueColumn, labelColumn];\n const columnMap = buildColumnMap(columns);\n const dataSource = new VuuDataSource({\n bufferSize: 0,\n table,\n });\n dataSource.subscribe(\n {\n columns,\n range: Range(0, 100),\n },\n (message) => {\n if (message.type === \"viewport-update\") {\n //TODO check we have full dataset\n if (message.rows) {\n const listOptions = message.rows.map<ListOption>((row) => ({\n value: row[columnMap[valueColumn]] as string | number,\n label: row[columnMap[labelColumn]] as string,\n }));\n resolve(listOptions);\n dataSource.unsubscribe();\n }\n }\n },\n );\n });\n lookupValueMap.set(tableKey, promise);\n return promise;\n }\n};\n\ntype LookupState = {\n initialValue: ListOption | null;\n values: ListOption[];\n};\n\nconst getLookupDetails = ({ name, type }: ColumnDescriptor) => {\n if (isTypeDescriptor(type) && isLookupRenderer(type.renderer)) {\n return type.renderer.lookup;\n } else {\n throw Error(\n `useLookupValues column ${name} is not configured to use lookup values`,\n );\n }\n};\n\nexport const useLookupValues = (\n column: ColumnDescriptor,\n initialValueProp: number | string,\n) => {\n const { type: columnType } = column;\n const { getLookupValues } = useShellContext();\n\n const initialState = useMemo<LookupState>(() => {\n if (\n isTypeDescriptor(columnType) &&\n isValueListRenderer(columnType?.renderer)\n ) {\n const values = columnType.renderer.values.map(toListOption);\n return {\n initialValue: getSelectedOption(values, initialValueProp) ?? null,\n values,\n };\n } else {\n const lookupDetails = getLookupDetails(column);\n const values = getLookupValues?.(lookupDetails.table) ?? NO_VALUES;\n\n return {\n initialValue: getSelectedOption(values, initialValueProp) ?? null,\n values,\n };\n }\n }, [column, columnType, getLookupValues, initialValueProp]);\n\n const [{ initialValue, values }, setLookupState] =\n useState<LookupState>(initialState);\n\n useMemo(() => {\n if (values === NO_VALUES) {\n const lookupDetails = getLookupDetails(column);\n loadLookupValues(lookupDetails).then((values) =>\n setLookupState({\n initialValue: getSelectedOption(values, initialValueProp) ?? null,\n values,\n }),\n );\n }\n }, [values, column, initialValueProp]);\n\n return {\n initialValue,\n values,\n };\n};\n"],"names":["buildColumnMap","VuuDataSource","Range","isTypeDescriptor","isLookupRenderer","useShellContext","useMemo","isValueListRenderer","values","getSelectedOption","useState"],"mappings":"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"}
|