@oneblink/apps-react 4.2.0 → 4.3.0-beta.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.
Files changed (46) hide show
  1. package/dist/OneBlinkFormBase.js +121 -134
  2. package/dist/OneBlinkFormBase.js.map +1 -1
  3. package/dist/components/CustomAccordion.d.ts +1 -1
  4. package/dist/components/Lists.d.ts +2 -2
  5. package/dist/components/renderer/AutocompleteDropdown.js +3 -1
  6. package/dist/components/renderer/AutocompleteDropdown.js.map +1 -1
  7. package/dist/components/renderer/OneBlinkFormElements.d.ts +3 -2
  8. package/dist/components/renderer/OneBlinkFormElements.js +13 -13
  9. package/dist/components/renderer/OneBlinkFormElements.js.map +1 -1
  10. package/dist/components/renderer/PageFormElements.js +29 -1
  11. package/dist/components/renderer/PageFormElements.js.map +1 -1
  12. package/dist/form-elements/FormElementAutocomplete.d.ts +2 -1
  13. package/dist/form-elements/FormElementAutocomplete.js +2 -1
  14. package/dist/form-elements/FormElementAutocomplete.js.map +1 -1
  15. package/dist/form-elements/FormElementCheckBoxes.d.ts +3 -2
  16. package/dist/form-elements/FormElementCheckBoxes.js +2 -1
  17. package/dist/form-elements/FormElementCheckBoxes.js.map +1 -1
  18. package/dist/form-elements/FormElementCompliance.d.ts +3 -2
  19. package/dist/form-elements/FormElementCompliance.js +2 -1
  20. package/dist/form-elements/FormElementCompliance.js.map +1 -1
  21. package/dist/form-elements/FormElementForm.d.ts +3 -2
  22. package/dist/form-elements/FormElementForm.js +17 -2
  23. package/dist/form-elements/FormElementForm.js.map +1 -1
  24. package/dist/form-elements/FormElementRadio.d.ts +3 -2
  25. package/dist/form-elements/FormElementRadio.js +2 -1
  26. package/dist/form-elements/FormElementRadio.js.map +1 -1
  27. package/dist/form-elements/FormElementRepeatableSet.d.ts +3 -2
  28. package/dist/form-elements/FormElementRepeatableSet.js +18 -4
  29. package/dist/form-elements/FormElementRepeatableSet.js.map +1 -1
  30. package/dist/form-elements/FormElementSection.d.ts +1 -1
  31. package/dist/form-elements/FormElementSection.js +16 -2
  32. package/dist/form-elements/FormElementSection.js.map +1 -1
  33. package/dist/form-elements/FormElementSelect.d.ts +3 -2
  34. package/dist/form-elements/FormElementSelect.js +2 -1
  35. package/dist/form-elements/FormElementSelect.js.map +1 -1
  36. package/dist/hooks/useDynamicOptionsLoaderState.d.ts +16 -7
  37. package/dist/hooks/useDynamicOptionsLoaderState.js +195 -45
  38. package/dist/hooks/useDynamicOptionsLoaderState.js.map +1 -1
  39. package/dist/hooks/useFormElementOptions.d.ts +3 -2
  40. package/dist/hooks/useFormElementOptions.js +3 -1
  41. package/dist/hooks/useFormElementOptions.js.map +1 -1
  42. package/dist/services/form-validation.js +1 -1
  43. package/dist/services/form-validation.js.map +1 -1
  44. package/dist/types/form.d.ts +1 -0
  45. package/dist/types/form.js.map +1 -1
  46. package/package.json +2 -2
@@ -1 +1 @@
1
- {"version":3,"file":"FormElementSelect.js","sourceRoot":"","sources":["../../src/form-elements/FormElementSelect.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport ToggleAllCheckbox from '../components/renderer/ToggleAllCheckbox'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n} from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.SelectElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<string | string[]>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n conditionallyShownOptionsElement:\n | FormElementConditionallyShownElement\n | undefined\n} & IsDirtyProps\n\nfunction FormElementSelect({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n conditionallyShownOptionsElement,\n isDirty,\n setIsDirty,\n}: Props) {\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n })\n\n const selectedValuesAsArray = React.useMemo(() => {\n if (Array.isArray(value)) return value\n if (typeof value === 'string') return [value]\n return []\n }, [value])\n\n return (\n <div className=\"cypress-select-element\">\n <FormElementLabelContainer\n className=\"ob-select\"\n id={id}\n element={element}\n required={element.required}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n {element.multi && element.canToggleAll && (\n <ToggleAllCheckbox\n id={id}\n element={element}\n options={filteredOptions}\n selected={selectedValuesAsArray}\n disabled={element.readOnly}\n onChange={onChange as FormElementValueChangeHandler<string[]>}\n />\n )}\n {!element.multi ? (\n <div className=\"field has-addons\">\n <div className=\"control is-expanded\">\n <div className=\"select is-fullwidth\">\n <select\n id={id}\n name={element.name}\n className=\"cypress-select-single-control ob-input ob-select__single\"\n value={typeof value === 'string' ? value : ''}\n onChange={(e) =>\n onChange(element, e.target.value || undefined)\n }\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n >\n <option value=\"\">Please choose</option>\n {filteredOptions.map(({ label, value }) => (\n <option key={value} value={value}>\n {label}\n </option>\n ))}\n </select>\n </div>\n </div>\n </div>\n ) : (\n <div className=\"select is-multiple control\">\n <select\n multiple\n id={id}\n name={element.name}\n className=\"cypress-select-multiple-control ob-input ob-select__multi\"\n value={Array.isArray(value) ? value : []}\n onChange={(e) => {\n const vals = []\n for (let i = 0; i < e.target.selectedOptions.length; i++) {\n vals.push(e.target.selectedOptions[i].value)\n }\n onChange(element, vals.length ? vals : undefined)\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n >\n {filteredOptions.map(({ label, value }) => (\n <option key={value} value={value}>\n {label}\n </option>\n ))}\n </select>\n\n <LookupButton\n hasMarginTop\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n )}\n\n {(isDirty || displayValidationMessage) && !!validationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementOptions>\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementSelect)\n"]}
1
+ {"version":3,"file":"FormElementSelect.js","sourceRoot":"","sources":["../../src/form-elements/FormElementSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,kBAAkB,MAAM,2CAA2C,CAAA;AAC1E,OAAO,qBAAqB,MAAM,gCAAgC,CAAA;AAClE,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,iBAAiB,MAAM,0CAA0C,CAAA;AAqBxE,SAAS,iBAAiB,CAAC,EACzB,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,gCAAgC,EAChC,oBAAoB,EACpB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,eAAe,GAAG,qBAAqB,CAAC;QAC5C,OAAO;QACP,KAAK;QACL,QAAQ;QACR,gCAAgC;QAChC,oBAAoB;KACrB,CAAC,CAAA;IAEF,MAAM,qBAAqB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC/C,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;YAAE,OAAO,KAAK,CAAA;QACtC,IAAI,OAAO,KAAK,KAAK,QAAQ;YAAE,OAAO,CAAC,KAAK,CAAC,CAAA;QAC7C,OAAO,EAAE,CAAA;IACX,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,6BAAK,SAAS,EAAC,wBAAwB;QACrC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,WAAW,EACrB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,oBAAC,kBAAkB,IACjB,OAAO,EAAE,OAAO,CAAC,OAAO,EACxB,gCAAgC,EAAE,gCAAgC;gBAEjE,OAAO,CAAC,KAAK,IAAI,OAAO,CAAC,YAAY,IAAI,CACxC,oBAAC,iBAAiB,IAChB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAE,qBAAqB,EAC/B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,QAAmD,GAC7D,CACH;gBACA,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAChB,6BAAK,SAAS,EAAC,kBAAkB;oBAC/B,6BAAK,SAAS,EAAC,qBAAqB;wBAClC,6BAAK,SAAS,EAAC,qBAAqB;4BAClC,gCACE,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,0DAA0D,EACpE,KAAK,EAAE,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAC7C,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CACd,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,SAAS,CAAC,EAEhD,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,UAAU;gCAElB,gCAAQ,KAAK,EAAC,EAAE,oBAAuB;gCACtC,eAAe,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CACzC,gCAAQ,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,IAC7B,KAAK,CACC,CACV,CAAC,CACK,CACL,CACF,CACF,CACP,CAAC,CAAC,CAAC,CACF,6BAAK,SAAS,EAAC,4BAA4B;oBACzC,gCACE,QAAQ,QACR,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,2DAA2D,EACrE,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EACxC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;4BACd,MAAM,IAAI,GAAG,EAAE,CAAA;4BACf,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,eAAe,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gCACxD,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAA;6BAC7C;4BACD,QAAQ,CAAC,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;wBACnD,CAAC,EACD,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,UAAU,IAEjB,eAAe,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CACzC,gCAAQ,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,IAC7B,KAAK,CACC,CACV,CAAC,CACK;oBAET,oBAAC,YAAY,IACX,YAAY,QACZ,KAAK,EAAE,KAAK,EACZ,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,OAAO,CAAC,YAAY,GACxC,CACE,CACP;gBAEA,CAAC,OAAO,IAAI,wBAAwB,CAAC,IAAI,CAAC,CAAC,iBAAiB,IAAI,CAC/D,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;oBAC5C,6BAAK,SAAS,EAAC,2DAA2D,IACvE,iBAAiB,CACd,CACF,CACP,CACkB,CACK,CACxB,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport ToggleAllCheckbox from '../components/renderer/ToggleAllCheckbox'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.SelectElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<string | string[]>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n conditionallyShownOptionsElement:\n | FormElementConditionallyShownElement\n | undefined\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nfunction FormElementSelect({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: Props) {\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n })\n\n const selectedValuesAsArray = React.useMemo(() => {\n if (Array.isArray(value)) return value\n if (typeof value === 'string') return [value]\n return []\n }, [value])\n\n return (\n <div className=\"cypress-select-element\">\n <FormElementLabelContainer\n className=\"ob-select\"\n id={id}\n element={element}\n required={element.required}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n {element.multi && element.canToggleAll && (\n <ToggleAllCheckbox\n id={id}\n element={element}\n options={filteredOptions}\n selected={selectedValuesAsArray}\n disabled={element.readOnly}\n onChange={onChange as FormElementValueChangeHandler<string[]>}\n />\n )}\n {!element.multi ? (\n <div className=\"field has-addons\">\n <div className=\"control is-expanded\">\n <div className=\"select is-fullwidth\">\n <select\n id={id}\n name={element.name}\n className=\"cypress-select-single-control ob-input ob-select__single\"\n value={typeof value === 'string' ? value : ''}\n onChange={(e) =>\n onChange(element, e.target.value || undefined)\n }\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n >\n <option value=\"\">Please choose</option>\n {filteredOptions.map(({ label, value }) => (\n <option key={value} value={value}>\n {label}\n </option>\n ))}\n </select>\n </div>\n </div>\n </div>\n ) : (\n <div className=\"select is-multiple control\">\n <select\n multiple\n id={id}\n name={element.name}\n className=\"cypress-select-multiple-control ob-input ob-select__multi\"\n value={Array.isArray(value) ? value : []}\n onChange={(e) => {\n const vals = []\n for (let i = 0; i < e.target.selectedOptions.length; i++) {\n vals.push(e.target.selectedOptions[i].value)\n }\n onChange(element, vals.length ? vals : undefined)\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n >\n {filteredOptions.map(({ label, value }) => (\n <option key={value} value={value}>\n {label}\n </option>\n ))}\n </select>\n\n <LookupButton\n hasMarginTop\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n )}\n\n {(isDirty || displayValidationMessage) && !!validationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementOptions>\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementSelect)\n"]}
@@ -1,7 +1,16 @@
1
- import { OneBlinkAppsError } from '@oneblink/apps';
2
- import { FormTypes } from '@oneblink/types';
3
- import { SetFormSubmission } from '../types/form';
4
- export default function useDynamicOptionsLoaderState(form: FormTypes.Form, setFormSubmission: SetFormSubmission): {
5
- elementId: string;
6
- error: OneBlinkAppsError;
7
- } | null;
1
+ import * as React from 'react';
2
+ import { formService } from '@oneblink/apps';
3
+ import { FormTypes, FreshdeskTypes } from '@oneblink/types';
4
+ import { LoadDataState } from './useLoadDataState';
5
+ import { UpdateFormElementsHandler } from '../typedoc';
6
+ type OptionsSetResult = {
7
+ formElementOptionsSet: FormTypes.FormElementOptionSet;
8
+ result?: formService.FormElementOptionsSetResult;
9
+ };
10
+ export declare const FormElementOptionsContext: React.Context<OptionsSetResult[]>;
11
+ export declare const FreshdeskFieldsStateContext: React.Context<LoadDataState<FreshdeskTypes.FreshdeskField[]> | undefined>;
12
+ export declare function FormElementOptionsContextProvider({ children, }: {
13
+ children: React.ReactNode;
14
+ }): JSX.Element;
15
+ export declare function useLoadDynamicOptionsEffect(formElement: FormTypes.FormElementWithOptions, onUpdateFormElements: UpdateFormElementsHandler): void;
16
+ export {};
@@ -1,60 +1,210 @@
1
1
  import * as React from 'react';
2
- import _cloneDeep from 'lodash.clonedeep';
3
- import { formElementsService } from '@oneblink/sdk-core';
4
- import { formService } from '@oneblink/apps';
5
- export default function useDynamicOptionsLoaderState(form, setFormSubmission) {
6
- const [state, setState] = React.useState(null);
2
+ import { formElementsService, typeCastService } from '@oneblink/sdk-core';
3
+ import { formService, localisationService, OneBlinkAppsError, } from '@oneblink/apps';
4
+ import useLoadDataState from './useLoadDataState';
5
+ import OneBlinkAppsErrorOriginalMessage from '../components/renderer/OneBlinkAppsErrorOriginalMessage';
6
+ import useFormDefinition from './useFormDefinition';
7
+ export const FormElementOptionsContext = React.createContext([]);
8
+ export const FreshdeskFieldsStateContext = React.createContext(undefined);
9
+ export function FormElementOptionsContextProvider({ children, }) {
10
+ const form = useFormDefinition();
11
+ const hasFreshdeskFields = React.useMemo(() => {
12
+ return !!formElementsService.findFormElement(form.elements, (formElement) => {
13
+ const formElementWithOptions = typeCastService.formElements.toOptionsElement(formElement);
14
+ return ((formElementWithOptions === null || formElementWithOptions === void 0 ? void 0 : formElementWithOptions.optionsType) === 'FRESHDESK_FIELD' &&
15
+ !!formElementWithOptions.freshdeskFieldName);
16
+ });
17
+ }, [form.elements]);
18
+ const loadFreshdeskFields = React.useCallback(async (abortSignal) => {
19
+ if (hasFreshdeskFields) {
20
+ return await formService.getFreshdeskFields(form.id, abortSignal);
21
+ }
22
+ return [];
23
+ }, [form.id, hasFreshdeskFields]);
24
+ const [freshdeskFieldsState] = useLoadDataState(loadFreshdeskFields);
25
+ const loadFormElementOptionsSets = React.useCallback(async (abortSignal) => {
26
+ const formElementOptionsSets = await formService.getFormElementOptionsSets(form.organisationId, abortSignal);
27
+ return formElementOptionsSets.map((formElementOptionsSet) => ({
28
+ formElementOptionsSet,
29
+ }));
30
+ }, [form.organisationId]);
31
+ const [optionsSetResultsState, , setOptionsSetResults] = useLoadDataState(loadFormElementOptionsSets);
32
+ const optionsSetResults = React.useMemo(() => {
33
+ if (optionsSetResultsState.status === 'SUCCESS') {
34
+ return optionsSetResultsState.result;
35
+ }
36
+ return [];
37
+ }, [optionsSetResultsState]);
38
+ const error = React.useMemo(() => {
39
+ var _a;
40
+ if (freshdeskFieldsState.status === 'ERROR') {
41
+ return freshdeskFieldsState.error instanceof OneBlinkAppsError
42
+ ? freshdeskFieldsState.error
43
+ : new OneBlinkAppsError('An unknown error has occurred', {
44
+ originalError: freshdeskFieldsState.error,
45
+ });
46
+ }
47
+ if (optionsSetResultsState.status === 'ERROR') {
48
+ return optionsSetResultsState.error instanceof OneBlinkAppsError
49
+ ? optionsSetResultsState.error
50
+ : new OneBlinkAppsError('An unknown error has occurred', {
51
+ originalError: optionsSetResultsState.error,
52
+ });
53
+ }
54
+ for (const optionsSetResult of optionsSetResults) {
55
+ if (((_a = optionsSetResult.result) === null || _a === void 0 ? void 0 : _a.type) === 'ERROR') {
56
+ return optionsSetResult.result.error;
57
+ }
58
+ }
59
+ }, [freshdeskFieldsState, optionsSetResults, optionsSetResultsState]);
60
+ if (error) {
61
+ return (React.createElement(React.Fragment, null,
62
+ React.createElement("div", { className: "has-text-centered" },
63
+ React.createElement("i", { className: "material-icons has-text-warning icon-x-large" }, "error"),
64
+ React.createElement("h3", { className: "title is-3" }, error.title),
65
+ React.createElement("p", null, error.message),
66
+ React.createElement("p", { className: "has-text-grey" }, localisationService.formatDatetimeLong(new Date()))),
67
+ React.createElement(OneBlinkAppsErrorOriginalMessage, { error: error.originalError })));
68
+ }
69
+ return (React.createElement(React.Fragment, null,
70
+ optionsSetResults.map((optionsSetResult) => (React.createElement(React.Fragment, { key: optionsSetResult.formElementOptionsSet.id },
71
+ React.createElement(LoadOptionsSet, { optionsSetResult: optionsSetResult, form: form, setOptionsSetResults: setOptionsSetResults })))),
72
+ React.createElement(FormElementOptionsContext.Provider, { value: optionsSetResults },
73
+ React.createElement(FreshdeskFieldsStateContext.Provider, { value: freshdeskFieldsState }, children))));
74
+ }
75
+ const LoadOptionsSet = React.memo(function LoadOptionsSet({ form, optionsSetResult, setOptionsSetResults, }) {
76
+ const hasOptionsSet = React.useMemo(() => {
77
+ return !!formElementsService.findFormElement(form.elements, (formElement) => {
78
+ const formElementWithOptions = typeCastService.formElements.toOptionsElement(formElement);
79
+ return ((formElementWithOptions === null || formElementWithOptions === void 0 ? void 0 : formElementWithOptions.optionsType) === 'DYNAMIC' &&
80
+ formElementWithOptions.dynamicOptionSetId ===
81
+ optionsSetResult.formElementOptionsSet.id);
82
+ });
83
+ }, [form.elements, optionsSetResult.formElementOptionsSet.id]);
84
+ const setOptionsSetResult = React.useCallback((result) => {
85
+ setOptionsSetResults((currentOptionsSetResults) => {
86
+ return currentOptionsSetResults.map((currentOptionsSetResult) => {
87
+ if (currentOptionsSetResult.formElementOptionsSet.id ===
88
+ optionsSetResult.formElementOptionsSet.id) {
89
+ return {
90
+ ...optionsSetResult,
91
+ result,
92
+ };
93
+ }
94
+ else {
95
+ return currentOptionsSetResult;
96
+ }
97
+ });
98
+ });
99
+ }, [optionsSetResult, setOptionsSetResults]);
7
100
  React.useEffect(() => {
8
- if (state) {
101
+ if (!hasOptionsSet || optionsSetResult.result) {
9
102
  return;
10
103
  }
11
104
  const abortController = new AbortController();
12
105
  (async () => {
13
- const optionsByElementId = await formService.getFormElementDynamicOptions(form);
14
- if (abortController.signal.aborted || !optionsByElementId.length) {
15
- return;
16
- }
17
- const nonOkResponse = optionsByElementId.find((optionsForElementId) => optionsForElementId.type === 'ERROR');
18
- if (nonOkResponse && nonOkResponse.type === 'ERROR') {
19
- setState({
20
- elementId: nonOkResponse.elementId,
21
- error: nonOkResponse.error,
22
- });
23
- return;
106
+ try {
107
+ const result = await formService.getFormElementOptionsSetOptions(optionsSetResult.formElementOptionsSet, form.formsAppEnvironmentId, abortController.signal);
108
+ if (!abortController.signal.aborted) {
109
+ setOptionsSetResult(result);
110
+ }
24
111
  }
25
- setFormSubmission((currentFormSubmission) => {
26
- const clonedForm = _cloneDeep(currentFormSubmission.definition);
27
- for (const optionsForElementId of optionsByElementId) {
28
- formElementsService.forEachFormElementWithOptions(clonedForm.elements, (formElement) => {
29
- if (formElement.id === optionsForElementId.elementId) {
30
- switch (optionsForElementId.type) {
31
- case 'OPTIONS': {
32
- formElement.options = optionsForElementId.options;
33
- break;
34
- }
35
- case 'SEARCH': {
36
- if (formElement.type === 'autocomplete') {
37
- formElement.optionsType = 'SEARCH';
38
- formElement.searchUrl = optionsForElementId.url;
39
- formElement.searchQuerystringParameter =
40
- optionsForElementId.searchQuerystringParameter;
41
- }
42
- break;
43
- }
44
- }
45
- }
112
+ catch (error) {
113
+ if (!abortController.signal.aborted) {
114
+ setOptionsSetResult({
115
+ type: 'ERROR',
116
+ error: new OneBlinkAppsError(error instanceof Error
117
+ ? error.message
118
+ : 'An unknown error has occurred', {
119
+ originalError: error instanceof Error ? error : undefined,
120
+ }),
46
121
  });
47
122
  }
48
- return {
49
- ...currentFormSubmission,
50
- definition: clonedForm,
51
- };
52
- });
123
+ }
53
124
  })();
54
125
  return () => {
55
126
  abortController.abort();
56
127
  };
57
- }, [form, setFormSubmission, state]);
58
- return state;
128
+ }, [
129
+ form.formsAppEnvironmentId,
130
+ hasOptionsSet,
131
+ optionsSetResult.formElementOptionsSet,
132
+ optionsSetResult.result,
133
+ setOptionsSetResult,
134
+ ]);
135
+ return React.createElement(React.Fragment, null);
136
+ });
137
+ export function useLoadDynamicOptionsEffect(formElement, onUpdateFormElements) {
138
+ const form = useFormDefinition();
139
+ const optionsSetResults = React.useContext(FormElementOptionsContext);
140
+ const freshdeskFieldsState = React.useContext(FreshdeskFieldsStateContext);
141
+ const freshdeskFieldOptionsResult = React.useMemo(() => {
142
+ if ((freshdeskFieldsState === null || freshdeskFieldsState === void 0 ? void 0 : freshdeskFieldsState.status) === 'SUCCESS' &&
143
+ // We can stop here if the options are not coming from freshdesk
144
+ formElement.optionsType === 'FRESHDESK_FIELD' &&
145
+ // If the element already has options, we don't need to set them again
146
+ !Array.isArray(formElement.options)) {
147
+ return formService.parseFreshdeskFieldOptions(freshdeskFieldsState.result, formElement);
148
+ }
149
+ }, [formElement, freshdeskFieldsState]);
150
+ const optionsSetResult = React.useMemo(() => {
151
+ if (
152
+ // We can stop here if the options are not dynamic
153
+ formElement.optionsType !== 'DYNAMIC' ||
154
+ // If the element already has options, we don't need to set them again
155
+ Array.isArray(formElement.options)) {
156
+ return;
157
+ }
158
+ return optionsSetResults.find((optionsSetResult) => optionsSetResult.formElementOptionsSet.id ===
159
+ formElement.dynamicOptionSetId && optionsSetResult.result);
160
+ }, [
161
+ formElement.dynamicOptionSetId,
162
+ formElement.options,
163
+ formElement.optionsType,
164
+ optionsSetResults,
165
+ ]);
166
+ React.useEffect(() => {
167
+ if (!optionsSetResult && !freshdeskFieldOptionsResult) {
168
+ return;
169
+ }
170
+ onUpdateFormElements((formElements) => {
171
+ return formElements.map((existingFormElement) => {
172
+ var _a;
173
+ if (existingFormElement.id === formElement.id) {
174
+ switch ((_a = optionsSetResult === null || optionsSetResult === void 0 ? void 0 : optionsSetResult.result) === null || _a === void 0 ? void 0 : _a.type) {
175
+ case 'SEARCH': {
176
+ if (formElement.type === 'autocomplete') {
177
+ return {
178
+ ...existingFormElement,
179
+ optionsType: 'SEARCH',
180
+ searchUrl: optionsSetResult.result.url,
181
+ searchQuerystringParameter: optionsSetResult.result.searchQuerystringParameter,
182
+ };
183
+ }
184
+ break;
185
+ }
186
+ case 'OPTIONS': {
187
+ return formService.parseFormElementOptions(form, formElement, optionsSetResult.result.options);
188
+ }
189
+ }
190
+ if (freshdeskFieldOptionsResult) {
191
+ return {
192
+ ...existingFormElement,
193
+ options: freshdeskFieldOptionsResult.type === 'OPTIONS'
194
+ ? freshdeskFieldOptionsResult.options
195
+ : [],
196
+ };
197
+ }
198
+ }
199
+ return existingFormElement;
200
+ });
201
+ });
202
+ }, [
203
+ form,
204
+ formElement,
205
+ freshdeskFieldOptionsResult,
206
+ onUpdateFormElements,
207
+ optionsSetResult,
208
+ ]);
59
209
  }
60
210
  //# sourceMappingURL=useDynamicOptionsLoaderState.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useDynamicOptionsLoaderState.js","sourceRoot":"","sources":["../../src/hooks/useDynamicOptionsLoaderState.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,UAAU,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAA;AACxD,OAAO,EAAE,WAAW,EAAqB,MAAM,gBAAgB,CAAA;AAI/D,MAAM,CAAC,OAAO,UAAU,4BAA4B,CAClD,IAAoB,EACpB,iBAAoC;IAEpC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAG9B,IAAI,CAAC,CAAA;IACf,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,KAAK,EAAE;YACT,OAAM;SACP;QAED,MAAM,eAAe,GAAG,IAAI,eAAe,EAAE,CAE5C;QAAA,CAAC,KAAK,IAAI,EAAE;YACX,MAAM,kBAAkB,GAAG,MAAM,WAAW,CAAC,4BAA4B,CACvE,IAAI,CACL,CAAA;YAED,IAAI,eAAe,CAAC,MAAM,CAAC,OAAO,IAAI,CAAC,kBAAkB,CAAC,MAAM,EAAE;gBAChE,OAAM;aACP;YAED,MAAM,aAAa,GAAG,kBAAkB,CAAC,IAAI,CAC3C,CAAC,mBAAmB,EAAE,EAAE,CAAC,mBAAmB,CAAC,IAAI,KAAK,OAAO,CAC9D,CAAA;YACD,IAAI,aAAa,IAAI,aAAa,CAAC,IAAI,KAAK,OAAO,EAAE;gBACnD,QAAQ,CAAC;oBACP,SAAS,EAAE,aAAa,CAAC,SAAS;oBAClC,KAAK,EAAE,aAAa,CAAC,KAAK;iBAC3B,CAAC,CAAA;gBACF,OAAM;aACP;YAED,iBAAiB,CAAC,CAAC,qBAAqB,EAAE,EAAE;gBAC1C,MAAM,UAAU,GAAmB,UAAU,CAC3C,qBAAqB,CAAC,UAAU,CACjC,CAAA;gBACD,KAAK,MAAM,mBAAmB,IAAI,kBAAkB,EAAE;oBACpD,mBAAmB,CAAC,6BAA6B,CAC/C,UAAU,CAAC,QAAQ,EACnB,CAAC,WAAW,EAAE,EAAE;wBACd,IAAI,WAAW,CAAC,EAAE,KAAK,mBAAmB,CAAC,SAAS,EAAE;4BACpD,QAAQ,mBAAmB,CAAC,IAAI,EAAE;gCAChC,KAAK,SAAS,CAAC,CAAC;oCACd,WAAW,CAAC,OAAO,GAAG,mBAAmB,CAAC,OAAO,CAAA;oCACjD,MAAK;iCACN;gCACD,KAAK,QAAQ,CAAC,CAAC;oCACb,IAAI,WAAW,CAAC,IAAI,KAAK,cAAc,EAAE;wCACvC,WAAW,CAAC,WAAW,GAAG,QAAQ,CAAA;wCAClC,WAAW,CAAC,SAAS,GAAG,mBAAmB,CAAC,GAAG,CAAA;wCAC/C,WAAW,CAAC,0BAA0B;4CACpC,mBAAmB,CAAC,0BAA0B,CAAA;qCACjD;oCACD,MAAK;iCACN;6BACF;yBACF;oBACH,CAAC,CACF,CAAA;iBACF;gBACD,OAAO;oBACL,GAAG,qBAAqB;oBACxB,UAAU,EAAE,UAAU;iBACvB,CAAA;YACH,CAAC,CAAC,CAAA;QACJ,CAAC,CAAC,EAAE,CAAA;QAEJ,OAAO,GAAG,EAAE;YACV,eAAe,CAAC,KAAK,EAAE,CAAA;QACzB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,iBAAiB,EAAE,KAAK,CAAC,CAAC,CAAA;IAEpC,OAAO,KAAK,CAAA;AACd,CAAC","sourcesContent":["import * as React from 'react'\nimport _cloneDeep from 'lodash.clonedeep'\nimport { formElementsService } from '@oneblink/sdk-core'\nimport { formService, OneBlinkAppsError } from '@oneblink/apps'\nimport { FormTypes } from '@oneblink/types'\nimport { SetFormSubmission } from '../types/form'\n\nexport default function useDynamicOptionsLoaderState(\n form: FormTypes.Form,\n setFormSubmission: SetFormSubmission,\n) {\n const [state, setState] = React.useState<{\n elementId: string\n error: OneBlinkAppsError\n } | null>(null)\n React.useEffect(() => {\n if (state) {\n return\n }\n\n const abortController = new AbortController()\n\n ;(async () => {\n const optionsByElementId = await formService.getFormElementDynamicOptions(\n form,\n )\n\n if (abortController.signal.aborted || !optionsByElementId.length) {\n return\n }\n\n const nonOkResponse = optionsByElementId.find(\n (optionsForElementId) => optionsForElementId.type === 'ERROR',\n )\n if (nonOkResponse && nonOkResponse.type === 'ERROR') {\n setState({\n elementId: nonOkResponse.elementId,\n error: nonOkResponse.error,\n })\n return\n }\n\n setFormSubmission((currentFormSubmission) => {\n const clonedForm: FormTypes.Form = _cloneDeep(\n currentFormSubmission.definition,\n )\n for (const optionsForElementId of optionsByElementId) {\n formElementsService.forEachFormElementWithOptions(\n clonedForm.elements,\n (formElement) => {\n if (formElement.id === optionsForElementId.elementId) {\n switch (optionsForElementId.type) {\n case 'OPTIONS': {\n formElement.options = optionsForElementId.options\n break\n }\n case 'SEARCH': {\n if (formElement.type === 'autocomplete') {\n formElement.optionsType = 'SEARCH'\n formElement.searchUrl = optionsForElementId.url\n formElement.searchQuerystringParameter =\n optionsForElementId.searchQuerystringParameter\n }\n break\n }\n }\n }\n },\n )\n }\n return {\n ...currentFormSubmission,\n definition: clonedForm,\n }\n })\n })()\n\n return () => {\n abortController.abort()\n }\n }, [form, setFormSubmission, state])\n\n return state\n}\n"]}
1
+ {"version":3,"file":"useDynamicOptionsLoaderState.js","sourceRoot":"","sources":["../../src/hooks/useDynamicOptionsLoaderState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACzE,OAAO,EACL,WAAW,EACX,mBAAmB,EACnB,iBAAiB,GAClB,MAAM,gBAAgB,CAAA;AAEvB,OAAO,gBAAmC,MAAM,oBAAoB,CAAA;AACpE,OAAO,gCAAgC,MAAM,yDAAyD,CAAA;AACtG,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAQnD,MAAM,CAAC,MAAM,yBAAyB,GAAG,KAAK,CAAC,aAAa,CAE1D,EAAE,CAAC,CAAA;AACL,MAAM,CAAC,MAAM,2BAA2B,GAAG,KAAK,CAAC,aAAa,CAE5D,SAAS,CAAC,CAAA;AAEZ,MAAM,UAAU,iCAAiC,CAAC,EAChD,QAAQ,GAGT;IACC,MAAM,IAAI,GAAG,iBAAiB,EAAE,CAAA;IAEhC,MAAM,kBAAkB,GAAG,KAAK,CAAC,OAAO,CAAU,GAAG,EAAE;QACrD,OAAO,CAAC,CAAC,mBAAmB,CAAC,eAAe,CAC1C,IAAI,CAAC,QAAQ,EACb,CAAC,WAAW,EAAE,EAAE;YACd,MAAM,sBAAsB,GAC1B,eAAe,CAAC,YAAY,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAA;YAC5D,OAAO,CACL,CAAA,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,WAAW,MAAK,iBAAiB;gBACzD,CAAC,CAAC,sBAAsB,CAAC,kBAAkB,CAC5C,CAAA;QACH,CAAC,CACF,CAAA;IACH,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEnB,MAAM,mBAAmB,GAAG,KAAK,CAAC,WAAW,CAC3C,KAAK,EAAE,WAAW,EAA4C,EAAE;QAC9D,IAAI,kBAAkB,EAAE;YACtB,OAAO,MAAM,WAAW,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,EAAE,WAAW,CAAC,CAAA;SAClE;QACD,OAAO,EAAE,CAAA;IACX,CAAC,EACD,CAAC,IAAI,CAAC,EAAE,EAAE,kBAAkB,CAAC,CAC9B,CAAA;IAED,MAAM,CAAC,oBAAoB,CAAC,GAAG,gBAAgB,CAAC,mBAAmB,CAAC,CAAA;IAEpE,MAAM,0BAA0B,GAAG,KAAK,CAAC,WAAW,CAClD,KAAK,EAAE,WAAW,EAAE,EAAE;QACpB,MAAM,sBAAsB,GAC1B,MAAM,WAAW,CAAC,yBAAyB,CACzC,IAAI,CAAC,cAAc,EACnB,WAAW,CACZ,CAAA;QACH,OAAO,sBAAsB,CAAC,GAAG,CAC/B,CAAC,qBAAqB,EAAE,EAAE,CAAC,CAAC;YAC1B,qBAAqB;SACtB,CAAC,CACH,CAAA;IACH,CAAC,EACD,CAAC,IAAI,CAAC,cAAc,CAAC,CACtB,CAAA;IAED,MAAM,CAAC,sBAAsB,EAAE,AAAD,EAAG,oBAAoB,CAAC,GAAG,gBAAgB,CACvE,0BAA0B,CAC3B,CAAA;IAED,MAAM,iBAAiB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC3C,IAAI,sBAAsB,CAAC,MAAM,KAAK,SAAS,EAAE;YAC/C,OAAO,sBAAsB,CAAC,MAAM,CAAA;SACrC;QACD,OAAO,EAAE,CAAA;IACX,CAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC,CAAA;IAE5B,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAgC,GAAG,EAAE;;QAC9D,IAAI,oBAAoB,CAAC,MAAM,KAAK,OAAO,EAAE;YAC3C,OAAO,oBAAoB,CAAC,KAAK,YAAY,iBAAiB;gBAC5D,CAAC,CAAC,oBAAoB,CAAC,KAAK;gBAC5B,CAAC,CAAC,IAAI,iBAAiB,CAAC,+BAA+B,EAAE;oBACrD,aAAa,EAAE,oBAAoB,CAAC,KAAK;iBAC1C,CAAC,CAAA;SACP;QACD,IAAI,sBAAsB,CAAC,MAAM,KAAK,OAAO,EAAE;YAC7C,OAAO,sBAAsB,CAAC,KAAK,YAAY,iBAAiB;gBAC9D,CAAC,CAAC,sBAAsB,CAAC,KAAK;gBAC9B,CAAC,CAAC,IAAI,iBAAiB,CAAC,+BAA+B,EAAE;oBACrD,aAAa,EAAE,sBAAsB,CAAC,KAAK;iBAC5C,CAAC,CAAA;SACP;QACD,KAAK,MAAM,gBAAgB,IAAI,iBAAiB,EAAE;YAChD,IAAI,CAAA,MAAA,gBAAgB,CAAC,MAAM,0CAAE,IAAI,MAAK,OAAO,EAAE;gBAC7C,OAAO,gBAAgB,CAAC,MAAM,CAAC,KAAK,CAAA;aACrC;SACF;IACH,CAAC,EAAE,CAAC,oBAAoB,EAAE,iBAAiB,EAAE,sBAAsB,CAAC,CAAC,CAAA;IAErE,IAAI,KAAK,EAAE;QACT,OAAO,CACL;YACE,6BAAK,SAAS,EAAC,mBAAmB;gBAChC,2BAAG,SAAS,EAAC,8CAA8C,YAAU;gBACrE,4BAAI,SAAS,EAAC,YAAY,IAAE,KAAK,CAAC,KAAK,CAAM;gBAC7C,+BAAI,KAAK,CAAC,OAAO,CAAK;gBACtB,2BAAG,SAAS,EAAC,eAAe,IACzB,mBAAmB,CAAC,kBAAkB,CAAC,IAAI,IAAI,EAAE,CAAC,CACjD,CACA;YAEN,oBAAC,gCAAgC,IAAC,KAAK,EAAE,KAAK,CAAC,aAAa,GAAI,CAC/D,CACJ,CAAA;KACF;IAED,OAAO,CACL;QACG,iBAAiB,CAAC,GAAG,CAAC,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAC3C,oBAAC,KAAK,CAAC,QAAQ,IAAC,GAAG,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,EAAE;YAC5D,oBAAC,cAAc,IACb,gBAAgB,EAAE,gBAAgB,EAClC,IAAI,EAAE,IAAI,EACV,oBAAoB,EAAE,oBAAoB,GAC1C,CACa,CAClB,CAAC;QACF,oBAAC,yBAAyB,CAAC,QAAQ,IAAC,KAAK,EAAE,iBAAiB;YAC1D,oBAAC,2BAA2B,CAAC,QAAQ,IAAC,KAAK,EAAE,oBAAoB,IAC9D,QAAQ,CAC4B,CACJ,CACpC,CACJ,CAAA;AACH,CAAC;AAED,MAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,cAAc,CAAC,EACxD,IAAI,EACJ,gBAAgB,EAChB,oBAAoB,GAKrB;IACC,MAAM,aAAa,GAAG,KAAK,CAAC,OAAO,CAAU,GAAG,EAAE;QAChD,OAAO,CAAC,CAAC,mBAAmB,CAAC,eAAe,CAC1C,IAAI,CAAC,QAAQ,EACb,CAAC,WAAW,EAAE,EAAE;YACd,MAAM,sBAAsB,GAC1B,eAAe,CAAC,YAAY,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAA;YAC5D,OAAO,CACL,CAAA,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,WAAW,MAAK,SAAS;gBACjD,sBAAsB,CAAC,kBAAkB;oBACvC,gBAAgB,CAAC,qBAAqB,CAAC,EAAE,CAC5C,CAAA;QACH,CAAC,CACF,CAAA;IACH,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,EAAE,CAAC,CAAC,CAAA;IAE9D,MAAM,mBAAmB,GAAG,KAAK,CAAC,WAAW,CAC3C,CAAC,MAAkC,EAAE,EAAE;QACrC,oBAAoB,CAAC,CAAC,wBAAwB,EAAE,EAAE;YAChD,OAAO,wBAAwB,CAAC,GAAG,CAAC,CAAC,uBAAuB,EAAE,EAAE;gBAC9D,IACE,uBAAuB,CAAC,qBAAqB,CAAC,EAAE;oBAChD,gBAAgB,CAAC,qBAAqB,CAAC,EAAE,EACzC;oBACA,OAAO;wBACL,GAAG,gBAAgB;wBACnB,MAAM;qBACP,CAAA;iBACF;qBAAM;oBACL,OAAO,uBAAuB,CAAA;iBAC/B;YACH,CAAC,CAAC,CAAA;QACJ,CAAC,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,gBAAgB,EAAE,oBAAoB,CAAC,CACzC,CAAA;IAED,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,aAAa,IAAI,gBAAgB,CAAC,MAAM,EAAE;YAC7C,OAAM;SACP;QAED,MAAM,eAAe,GAAG,IAAI,eAAe,EAAE,CAE5C;QAAA,CAAC,KAAK,IAAI,EAAE;YACX,IAAI;gBACF,MAAM,MAAM,GAAG,MAAM,WAAW,CAAC,+BAA+B,CAC9D,gBAAgB,CAAC,qBAAqB,EACtC,IAAI,CAAC,qBAAqB,EAC1B,eAAe,CAAC,MAAM,CACvB,CAAA;gBACD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,OAAO,EAAE;oBACnC,mBAAmB,CAAC,MAAM,CAAC,CAAA;iBAC5B;aACF;YAAC,OAAO,KAAK,EAAE;gBACd,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,OAAO,EAAE;oBACnC,mBAAmB,CAAC;wBAClB,IAAI,EAAE,OAAO;wBACb,KAAK,EAAE,IAAI,iBAAiB,CAC1B,KAAK,YAAY,KAAK;4BACpB,CAAC,CAAC,KAAK,CAAC,OAAO;4BACf,CAAC,CAAC,+BAA+B,EACnC;4BACE,aAAa,EAAE,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;yBAC1D,CACF;qBACF,CAAC,CAAA;iBACH;aACF;QACH,CAAC,CAAC,EAAE,CAAA;QAEJ,OAAO,GAAG,EAAE;YACV,eAAe,CAAC,KAAK,EAAE,CAAA;QACzB,CAAC,CAAA;IACH,CAAC,EAAE;QACD,IAAI,CAAC,qBAAqB;QAC1B,aAAa;QACb,gBAAgB,CAAC,qBAAqB;QACtC,gBAAgB,CAAC,MAAM;QACvB,mBAAmB;KACpB,CAAC,CAAA;IAEF,OAAO,yCAAK,CAAA;AACd,CAAC,CAAC,CAAA;AAEF,MAAM,UAAU,2BAA2B,CACzC,WAA6C,EAC7C,oBAA+C;IAE/C,MAAM,IAAI,GAAG,iBAAiB,EAAE,CAAA;IAChC,MAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAAC,yBAAyB,CAAC,CAAA;IACrE,MAAM,oBAAoB,GAAG,KAAK,CAAC,UAAU,CAAC,2BAA2B,CAAC,CAAA;IAE1E,MAAM,2BAA2B,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACrD,IACE,CAAA,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,MAAM,MAAK,SAAS;YAC1C,gEAAgE;YAChE,WAAW,CAAC,WAAW,KAAK,iBAAiB;YAC7C,sEAAsE;YACtE,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,EACnC;YACA,OAAO,WAAW,CAAC,0BAA0B,CAC3C,oBAAoB,CAAC,MAAM,EAC3B,WAAW,CACZ,CAAA;SACF;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,oBAAoB,CAAC,CAAC,CAAA;IAEvC,MAAM,gBAAgB,GAAG,KAAK,CAAC,OAAO,CAA+B,GAAG,EAAE;QACxE;QACE,kDAAkD;QAClD,WAAW,CAAC,WAAW,KAAK,SAAS;YACrC,sEAAsE;YACtE,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,EAClC;YACA,OAAM;SACP;QACD,OAAO,iBAAiB,CAAC,IAAI,CAC3B,CAAC,gBAAgB,EAAE,EAAE,CACnB,gBAAgB,CAAC,qBAAqB,CAAC,EAAE;YACvC,WAAW,CAAC,kBAAkB,IAAI,gBAAgB,CAAC,MAAM,CAC9D,CAAA;IACH,CAAC,EAAE;QACD,WAAW,CAAC,kBAAkB;QAC9B,WAAW,CAAC,OAAO;QACnB,WAAW,CAAC,WAAW;QACvB,iBAAiB;KAClB,CAAC,CAAA;IAEF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,gBAAgB,IAAI,CAAC,2BAA2B,EAAE;YACrD,OAAM;SACP;QAED,oBAAoB,CAAC,CAAC,YAAY,EAAE,EAAE;YACpC,OAAO,YAAY,CAAC,GAAG,CAAC,CAAC,mBAAmB,EAAE,EAAE;;gBAC9C,IAAI,mBAAmB,CAAC,EAAE,KAAK,WAAW,CAAC,EAAE,EAAE;oBAC7C,QAAQ,MAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,MAAM,0CAAE,IAAI,EAAE;wBACtC,KAAK,QAAQ,CAAC,CAAC;4BACb,IAAI,WAAW,CAAC,IAAI,KAAK,cAAc,EAAE;gCACvC,OAAO;oCACL,GAAG,mBAAmB;oCACtB,WAAW,EAAE,QAAQ;oCACrB,SAAS,EAAE,gBAAgB,CAAC,MAAM,CAAC,GAAG;oCACtC,0BAA0B,EACxB,gBAAgB,CAAC,MAAM,CAAC,0BAA0B;iCACrD,CAAA;6BACF;4BACD,MAAK;yBACN;wBACD,KAAK,SAAS,CAAC,CAAC;4BACd,OAAO,WAAW,CAAC,uBAAuB,CACxC,IAAI,EACJ,WAAW,EACX,gBAAgB,CAAC,MAAM,CAAC,OAAO,CAChC,CAAA;yBACF;qBACF;oBAED,IAAI,2BAA2B,EAAE;wBAC/B,OAAO;4BACL,GAAG,mBAAmB;4BACtB,OAAO,EACL,2BAA2B,CAAC,IAAI,KAAK,SAAS;gCAC5C,CAAC,CAAC,2BAA2B,CAAC,OAAO;gCACrC,CAAC,CAAC,EAAE;yBACT,CAAA;qBACF;iBACF;gBAED,OAAO,mBAAmB,CAAA;YAC5B,CAAC,CAAC,CAAA;QACJ,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE;QACD,IAAI;QACJ,WAAW;QACX,2BAA2B;QAC3B,oBAAoB;QACpB,gBAAgB;KACjB,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import * as React from 'react'\nimport { formElementsService, typeCastService } from '@oneblink/sdk-core'\nimport {\n formService,\n localisationService,\n OneBlinkAppsError,\n} from '@oneblink/apps'\nimport { FormTypes, FreshdeskTypes } from '@oneblink/types'\nimport useLoadDataState, { LoadDataState } from './useLoadDataState'\nimport OneBlinkAppsErrorOriginalMessage from '../components/renderer/OneBlinkAppsErrorOriginalMessage'\nimport useFormDefinition from './useFormDefinition'\nimport { UpdateFormElementsHandler } from '../typedoc'\n\ntype OptionsSetResult = {\n formElementOptionsSet: FormTypes.FormElementOptionSet\n result?: formService.FormElementOptionsSetResult\n}\n\nexport const FormElementOptionsContext = React.createContext<\n OptionsSetResult[]\n>([])\nexport const FreshdeskFieldsStateContext = React.createContext<\n LoadDataState<FreshdeskTypes.FreshdeskField[]> | undefined\n>(undefined)\n\nexport function FormElementOptionsContextProvider({\n children,\n}: {\n children: React.ReactNode\n}) {\n const form = useFormDefinition()\n\n const hasFreshdeskFields = React.useMemo<boolean>(() => {\n return !!formElementsService.findFormElement(\n form.elements,\n (formElement) => {\n const formElementWithOptions =\n typeCastService.formElements.toOptionsElement(formElement)\n return (\n formElementWithOptions?.optionsType === 'FRESHDESK_FIELD' &&\n !!formElementWithOptions.freshdeskFieldName\n )\n },\n )\n }, [form.elements])\n\n const loadFreshdeskFields = React.useCallback(\n async (abortSignal): Promise<FreshdeskTypes.FreshdeskField[]> => {\n if (hasFreshdeskFields) {\n return await formService.getFreshdeskFields(form.id, abortSignal)\n }\n return []\n },\n [form.id, hasFreshdeskFields],\n )\n\n const [freshdeskFieldsState] = useLoadDataState(loadFreshdeskFields)\n\n const loadFormElementOptionsSets = React.useCallback(\n async (abortSignal) => {\n const formElementOptionsSets =\n await formService.getFormElementOptionsSets(\n form.organisationId,\n abortSignal,\n )\n return formElementOptionsSets.map<OptionsSetResult>(\n (formElementOptionsSet) => ({\n formElementOptionsSet,\n }),\n )\n },\n [form.organisationId],\n )\n\n const [optionsSetResultsState, , setOptionsSetResults] = useLoadDataState(\n loadFormElementOptionsSets,\n )\n\n const optionsSetResults = React.useMemo(() => {\n if (optionsSetResultsState.status === 'SUCCESS') {\n return optionsSetResultsState.result\n }\n return []\n }, [optionsSetResultsState])\n\n const error = React.useMemo<OneBlinkAppsError | undefined>(() => {\n if (freshdeskFieldsState.status === 'ERROR') {\n return freshdeskFieldsState.error instanceof OneBlinkAppsError\n ? freshdeskFieldsState.error\n : new OneBlinkAppsError('An unknown error has occurred', {\n originalError: freshdeskFieldsState.error,\n })\n }\n if (optionsSetResultsState.status === 'ERROR') {\n return optionsSetResultsState.error instanceof OneBlinkAppsError\n ? optionsSetResultsState.error\n : new OneBlinkAppsError('An unknown error has occurred', {\n originalError: optionsSetResultsState.error,\n })\n }\n for (const optionsSetResult of optionsSetResults) {\n if (optionsSetResult.result?.type === 'ERROR') {\n return optionsSetResult.result.error\n }\n }\n }, [freshdeskFieldsState, optionsSetResults, optionsSetResultsState])\n\n if (error) {\n return (\n <>\n <div className=\"has-text-centered\">\n <i className=\"material-icons has-text-warning icon-x-large\">error</i>\n <h3 className=\"title is-3\">{error.title}</h3>\n <p>{error.message}</p>\n <p className=\"has-text-grey\">\n {localisationService.formatDatetimeLong(new Date())}\n </p>\n </div>\n\n <OneBlinkAppsErrorOriginalMessage error={error.originalError} />\n </>\n )\n }\n\n return (\n <>\n {optionsSetResults.map((optionsSetResult) => (\n <React.Fragment key={optionsSetResult.formElementOptionsSet.id}>\n <LoadOptionsSet\n optionsSetResult={optionsSetResult}\n form={form}\n setOptionsSetResults={setOptionsSetResults}\n />\n </React.Fragment>\n ))}\n <FormElementOptionsContext.Provider value={optionsSetResults}>\n <FreshdeskFieldsStateContext.Provider value={freshdeskFieldsState}>\n {children}\n </FreshdeskFieldsStateContext.Provider>\n </FormElementOptionsContext.Provider>\n </>\n )\n}\n\nconst LoadOptionsSet = React.memo(function LoadOptionsSet({\n form,\n optionsSetResult,\n setOptionsSetResults,\n}: {\n form: FormTypes.Form\n optionsSetResult: OptionsSetResult\n setOptionsSetResults: React.Dispatch<React.SetStateAction<OptionsSetResult[]>>\n}) {\n const hasOptionsSet = React.useMemo<boolean>(() => {\n return !!formElementsService.findFormElement(\n form.elements,\n (formElement) => {\n const formElementWithOptions =\n typeCastService.formElements.toOptionsElement(formElement)\n return (\n formElementWithOptions?.optionsType === 'DYNAMIC' &&\n formElementWithOptions.dynamicOptionSetId ===\n optionsSetResult.formElementOptionsSet.id\n )\n },\n )\n }, [form.elements, optionsSetResult.formElementOptionsSet.id])\n\n const setOptionsSetResult = React.useCallback(\n (result: OptionsSetResult['result']) => {\n setOptionsSetResults((currentOptionsSetResults) => {\n return currentOptionsSetResults.map((currentOptionsSetResult) => {\n if (\n currentOptionsSetResult.formElementOptionsSet.id ===\n optionsSetResult.formElementOptionsSet.id\n ) {\n return {\n ...optionsSetResult,\n result,\n }\n } else {\n return currentOptionsSetResult\n }\n })\n })\n },\n [optionsSetResult, setOptionsSetResults],\n )\n\n React.useEffect(() => {\n if (!hasOptionsSet || optionsSetResult.result) {\n return\n }\n\n const abortController = new AbortController()\n\n ;(async () => {\n try {\n const result = await formService.getFormElementOptionsSetOptions(\n optionsSetResult.formElementOptionsSet,\n form.formsAppEnvironmentId,\n abortController.signal,\n )\n if (!abortController.signal.aborted) {\n setOptionsSetResult(result)\n }\n } catch (error) {\n if (!abortController.signal.aborted) {\n setOptionsSetResult({\n type: 'ERROR',\n error: new OneBlinkAppsError(\n error instanceof Error\n ? error.message\n : 'An unknown error has occurred',\n {\n originalError: error instanceof Error ? error : undefined,\n },\n ),\n })\n }\n }\n })()\n\n return () => {\n abortController.abort()\n }\n }, [\n form.formsAppEnvironmentId,\n hasOptionsSet,\n optionsSetResult.formElementOptionsSet,\n optionsSetResult.result,\n setOptionsSetResult,\n ])\n\n return <></>\n})\n\nexport function useLoadDynamicOptionsEffect(\n formElement: FormTypes.FormElementWithOptions,\n onUpdateFormElements: UpdateFormElementsHandler,\n) {\n const form = useFormDefinition()\n const optionsSetResults = React.useContext(FormElementOptionsContext)\n const freshdeskFieldsState = React.useContext(FreshdeskFieldsStateContext)\n\n const freshdeskFieldOptionsResult = React.useMemo(() => {\n if (\n freshdeskFieldsState?.status === 'SUCCESS' &&\n // We can stop here if the options are not coming from freshdesk\n formElement.optionsType === 'FRESHDESK_FIELD' &&\n // If the element already has options, we don't need to set them again\n !Array.isArray(formElement.options)\n ) {\n return formService.parseFreshdeskFieldOptions(\n freshdeskFieldsState.result,\n formElement,\n )\n }\n }, [formElement, freshdeskFieldsState])\n\n const optionsSetResult = React.useMemo<OptionsSetResult | undefined>(() => {\n if (\n // We can stop here if the options are not dynamic\n formElement.optionsType !== 'DYNAMIC' ||\n // If the element already has options, we don't need to set them again\n Array.isArray(formElement.options)\n ) {\n return\n }\n return optionsSetResults.find(\n (optionsSetResult) =>\n optionsSetResult.formElementOptionsSet.id ===\n formElement.dynamicOptionSetId && optionsSetResult.result,\n )\n }, [\n formElement.dynamicOptionSetId,\n formElement.options,\n formElement.optionsType,\n optionsSetResults,\n ])\n\n React.useEffect(() => {\n if (!optionsSetResult && !freshdeskFieldOptionsResult) {\n return\n }\n\n onUpdateFormElements((formElements) => {\n return formElements.map((existingFormElement) => {\n if (existingFormElement.id === formElement.id) {\n switch (optionsSetResult?.result?.type) {\n case 'SEARCH': {\n if (formElement.type === 'autocomplete') {\n return {\n ...existingFormElement,\n optionsType: 'SEARCH',\n searchUrl: optionsSetResult.result.url,\n searchQuerystringParameter:\n optionsSetResult.result.searchQuerystringParameter,\n }\n }\n break\n }\n case 'OPTIONS': {\n return formService.parseFormElementOptions(\n form,\n formElement,\n optionsSetResult.result.options,\n )\n }\n }\n\n if (freshdeskFieldOptionsResult) {\n return {\n ...existingFormElement,\n options:\n freshdeskFieldOptionsResult.type === 'OPTIONS'\n ? freshdeskFieldOptionsResult.options\n : [],\n }\n }\n }\n\n return existingFormElement\n })\n })\n }, [\n form,\n formElement,\n freshdeskFieldOptionsResult,\n onUpdateFormElements,\n optionsSetResult,\n ])\n}\n"]}
@@ -1,9 +1,10 @@
1
1
  import { FormTypes } from '@oneblink/types';
2
- import { FormElementValueChangeHandler, FormElementConditionallyShownElement } from '../types/form';
3
- export default function useFormElementOptions<T>({ element, value, onChange, conditionallyShownOptionsElement, onFilter, }: {
2
+ import { FormElementValueChangeHandler, FormElementConditionallyShownElement, UpdateFormElementsHandler } from '../types/form';
3
+ export default function useFormElementOptions<T>({ element, value, onChange, conditionallyShownOptionsElement, onFilter, onUpdateFormElements, }: {
4
4
  element: FormTypes.FormElementWithOptions;
5
5
  value: unknown | undefined;
6
6
  onChange: FormElementValueChangeHandler<T>;
7
7
  conditionallyShownOptionsElement: FormElementConditionallyShownElement | undefined;
8
8
  onFilter?: (choiceElementOption: FormTypes.ChoiceElementOption) => boolean;
9
+ onUpdateFormElements: UpdateFormElementsHandler;
9
10
  }): FormTypes.ChoiceElementOption[];
@@ -1,5 +1,6 @@
1
1
  import * as React from 'react';
2
- export default function useFormElementOptions({ element, value, onChange, conditionallyShownOptionsElement, onFilter, }) {
2
+ import { useLoadDynamicOptionsEffect } from './useDynamicOptionsLoaderState';
3
+ export default function useFormElementOptions({ element, value, onChange, conditionallyShownOptionsElement, onFilter, onUpdateFormElements, }) {
3
4
  const conditionallyShownOptions = conditionallyShownOptionsElement === null || conditionallyShownOptionsElement === void 0 ? void 0 : conditionallyShownOptionsElement.options;
4
5
  //options that are shown due to conditional logic
5
6
  const shownOptions = React.useMemo(() => {
@@ -48,6 +49,7 @@ export default function useFormElementOptions({ element, value, onChange, condit
48
49
  value,
49
50
  conditionallyShownOptionsElement === null || conditionallyShownOptionsElement === void 0 ? void 0 : conditionallyShownOptionsElement.dependencyIsLoading,
50
51
  ]);
52
+ useLoadDynamicOptionsEffect(element, onUpdateFormElements);
51
53
  return filteredOptions;
52
54
  }
53
55
  //# sourceMappingURL=useFormElementOptions.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useFormElementOptions.js","sourceRoot":"","sources":["../../src/hooks/useFormElementOptions.ts"],"names":[],"mappings":"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","sourcesContent":["import { FormTypes } from '@oneblink/types'\nimport * as React from 'react'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n} from '../types/form'\n\nexport default function useFormElementOptions<T>({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onFilter,\n}: {\n element: FormTypes.FormElementWithOptions\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<T>\n conditionallyShownOptionsElement:\n | FormElementConditionallyShownElement\n | undefined\n onFilter?: (choiceElementOption: FormTypes.ChoiceElementOption) => boolean\n}) {\n const conditionallyShownOptions = conditionallyShownOptionsElement?.options\n //options that are shown due to conditional logic\n const shownOptions = React.useMemo<FormTypes.ChoiceElementOption[]>(() => {\n if (!element.options) {\n return []\n }\n if (!conditionallyShownOptions && !onFilter) {\n return element.options\n }\n return element.options.filter((option) => {\n return (\n !conditionallyShownOptions ||\n conditionallyShownOptions.some(({ id }) => id === option.id)\n )\n })\n }, [conditionallyShownOptions, element.options, onFilter])\n\n //options that are shown based on conditional logic and user input\n const filteredOptions = React.useMemo<FormTypes.ChoiceElementOption[]>(() => {\n const reducedOptions = shownOptions.filter(\n (option) => !onFilter || (onFilter(option) && !option.displayAlways),\n )\n if (element.type === 'autocomplete') {\n const alwaysShownOptions = shownOptions.filter(\n (option) => option.displayAlways,\n )\n reducedOptions.push(...alwaysShownOptions)\n }\n return reducedOptions\n }, [shownOptions, element.type, onFilter])\n\n React.useEffect(() => {\n if (\n !element.options ||\n conditionallyShownOptionsElement?.dependencyIsLoading\n ) {\n return\n }\n\n if (\n typeof value === 'string' &&\n value &&\n !shownOptions.some((option) => value === option.value)\n ) {\n onChange(element, undefined)\n return\n }\n\n if (Array.isArray(value)) {\n const newValue = value.filter((selectedValue) =>\n shownOptions.some((option) => selectedValue === option.value),\n )\n if (newValue.length !== value.length) {\n const newValueArray = newValue.length ? newValue : undefined\n onChange(element, newValueArray as T | undefined)\n }\n }\n }, [\n element,\n shownOptions,\n onChange,\n value,\n conditionallyShownOptionsElement?.dependencyIsLoading,\n ])\n\n return filteredOptions\n}\n"]}
1
+ {"version":3,"file":"useFormElementOptions.js","sourceRoot":"","sources":["../../src/hooks/useFormElementOptions.ts"],"names":[],"mappings":"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","sourcesContent":["import { FormTypes } from '@oneblink/types'\nimport * as React from 'react'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n UpdateFormElementsHandler,\n} from '../types/form'\nimport { useLoadDynamicOptionsEffect } from './useDynamicOptionsLoaderState'\n\nexport default function useFormElementOptions<T>({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onFilter,\n onUpdateFormElements,\n}: {\n element: FormTypes.FormElementWithOptions\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<T>\n conditionallyShownOptionsElement:\n | FormElementConditionallyShownElement\n | undefined\n onFilter?: (choiceElementOption: FormTypes.ChoiceElementOption) => boolean\n onUpdateFormElements: UpdateFormElementsHandler\n}) {\n const conditionallyShownOptions = conditionallyShownOptionsElement?.options\n //options that are shown due to conditional logic\n const shownOptions = React.useMemo<FormTypes.ChoiceElementOption[]>(() => {\n if (!element.options) {\n return []\n }\n if (!conditionallyShownOptions && !onFilter) {\n return element.options\n }\n return element.options.filter((option) => {\n return (\n !conditionallyShownOptions ||\n conditionallyShownOptions.some(({ id }) => id === option.id)\n )\n })\n }, [conditionallyShownOptions, element.options, onFilter])\n\n //options that are shown based on conditional logic and user input\n const filteredOptions = React.useMemo<FormTypes.ChoiceElementOption[]>(() => {\n const reducedOptions = shownOptions.filter(\n (option) => !onFilter || (onFilter(option) && !option.displayAlways),\n )\n if (element.type === 'autocomplete') {\n const alwaysShownOptions = shownOptions.filter(\n (option) => option.displayAlways,\n )\n reducedOptions.push(...alwaysShownOptions)\n }\n return reducedOptions\n }, [shownOptions, element.type, onFilter])\n\n React.useEffect(() => {\n if (\n !element.options ||\n conditionallyShownOptionsElement?.dependencyIsLoading\n ) {\n return\n }\n\n if (\n typeof value === 'string' &&\n value &&\n !shownOptions.some((option) => value === option.value)\n ) {\n onChange(element, undefined)\n return\n }\n\n if (Array.isArray(value)) {\n const newValue = value.filter((selectedValue) =>\n shownOptions.some((option) => selectedValue === option.value),\n )\n if (newValue.length !== value.length) {\n const newValueArray = newValue.length ? newValue : undefined\n onChange(element, newValueArray as T | undefined)\n }\n }\n }, [\n element,\n shownOptions,\n onChange,\n value,\n conditionallyShownOptionsElement?.dependencyIsLoading,\n ])\n\n useLoadDynamicOptionsEffect(element, onUpdateFormElements)\n\n return filteredOptions\n}\n"]}
@@ -158,7 +158,6 @@ export function generateValidationSchema(elements, elementIdsWithLookupsExecuted
158
158
  case 'calculation':
159
159
  case 'image':
160
160
  case 'html':
161
- case 'infoPage':
162
161
  case 'heading': {
163
162
  return partialSchema;
164
163
  }
@@ -478,6 +477,7 @@ export function generateValidationSchema(elements, elementIdsWithLookupsExecuted
478
477
  },
479
478
  };
480
479
  }
480
+ case 'infoPage':
481
481
  case 'form': {
482
482
  if (formElement.elements) {
483
483
  return {