@luomus/laji-form 15.1.66 → 15.1.68

package/lib/components/fields/SingleActiveArrayField.js

@@ -911,13 +911,13 @@ const headerFormatters = {
                 this.fetch = (props) => {
                     const { namedPlaceID } = (props.that.props.formData || {})[props.idx] || {};
                     if (namedPlaceID)
-                        props.that.props.formContext.apiClient.fetchCached(`/named-places/${namedPlaceID}`, undefined, { failSilently: true }).then(response => {
+                        props.that.props.formContext.apiClient.get("/named-places/{id}", { path: { id: namedPlaceID } }).then(response => {
                             if (this.mounted && response.name !== this.state.name)
                                 this.setState({
                                     namedPlaceID,
                                     name: response.name
                                 });
-                        });
+                        }).catch(() => { });
                 };
                 this.state = {};
             }

package/lib/components/fields/SortArrayField.js

@@ -69,7 +69,7 @@ class TaxonomicComparer extends Comparer {
     }
     initialize() {
         return __awaiter(this, void 0, void 0, function* () {
-            this.idToIdx = (yield this.formContext.apiClient.fetchCached("/taxa", Object.assign(Object.assign({}, this.options.query), { pageSize: 10000, selectedFields: "id" })))
+            this.idToIdx = (yield this.formContext.apiClient.get("/taxa", { query: Object.assign(Object.assign({}, this.options.query), { pageSize: 10000, selectedFields: "id" }) }))
                 .results.reduce((idToIdx, { id }, idx) => {
                 idToIdx[id] = idx;
                 return idToIdx;

package/lib/components/fields/UnitCountShorthandField.js

@@ -82,7 +82,7 @@ let UnitCountShorthandField = class UnitCountShorthandField extends React.Compon
                 resolve({ success: undefined });
                 return;
             }
-            apiClient.fetchCached("/autocomplete/pairCount", { q: value, taxonID: taxonId }).then(suggestion => {
+            apiClient.get("/shorthand/unit/water-bird-pair-count", { query: { query: value, taxonID: taxonId } }).then(suggestion => {
                 if (timestamp !== this.promiseTimestamp) {
                     reject();
                     return;

package/lib/components/fields/UnitListShorthandArrayField.js

@@ -69,8 +69,8 @@ let UnitListShorthandArrayField = class UnitListShorthandArrayField extends Reac
             this.onHide();
             const { translations, notifier, apiClient } = this.props.formContext;
             this.props.formContext.services.blocker.push();
-            apiClient.fetch("/autocomplete/unit", { q: value, list: true, includePayload: true }).then(({ payload: { units, nonMatchingCount } }) => {
-                units = units.map(unit => {
+            apiClient.get("/shorthand/unit/list", { query: { query: value } }).then(({ results, nonMatchingCount }) => {
+                const units = results.map(unit => {
                     unit = (0, utils_1.getDefaultFormState)(this.props.schema.items, unit);
                     unit = (0, utils_1.bringRemoteFormData)(unit, this.props.formContext);
                     unit = (0, utils_1.assignUUID)(unit);

package/lib/components/fields/UnitShorthandField.js

@@ -51,7 +51,6 @@ const ReactContext_1 = __importDefault(require("../../ReactContext"));
 const components_1 = require("../components");
 const AutosuggestWidget_1 = require("../widgets/AutosuggestWidget");
 const ArrayFieldTemplate_1 = require("../templates/ArrayFieldTemplate");
-const LINE_TRANSECT_IDS = ["MHL.1", "MHL.27", "MHL.28"];
 let UnitShorthandField = class UnitShorthandField extends React.Component {
     constructor(props) {
         super(props);
@@ -125,13 +124,13 @@ let UnitShorthandField = class UnitShorthandField extends React.Component {
     render() {
         const { uiSchema, formContext, disabled, readonly } = this.props;
         const { SchemaField } = this.props.registry.fields;
-        const shorthandFieldName = (0, utils_1.getUiOptions)(this.props.uiSchema).shorthandField;
+        const { shorthandField, lineTransect } = (0, utils_1.getUiOptions)(this.props.uiSchema);
         const toggleButton = this.getToggleButton();
         const tailUiSchema = (0, utils_1.getNestedTailUiSchema)(uiSchema);
-        let help = tailUiSchema && tailUiSchema[shorthandFieldName] && tailUiSchema[shorthandFieldName]["ui:belowHelp"];
-        const uiSchemaWithoutHelp = (0, utils_1.isEmptyString)(help) ? uiSchema : (0, utils_1.updateTailUiSchema)(uiSchema, { [shorthandFieldName]: { "ui:belowHelp": { $set: undefined } } });
-        const id = (shorthandFieldName && this.props.idSchema[shorthandFieldName]) ?
-            this.props.idSchema[shorthandFieldName].$id :
+        let help = tailUiSchema && tailUiSchema[shorthandField] && tailUiSchema[shorthandField]["ui:belowHelp"];
+        const uiSchemaWithoutHelp = (0, utils_1.isEmptyString)(help) ? uiSchema : (0, utils_1.updateTailUiSchema)(uiSchema, { [shorthandField]: { "ui:belowHelp": { $set: undefined } } });
+        const id = (shorthandField && this.props.idSchema[shorthandField]) ?
+            this.props.idSchema[shorthandField].$id :
             `${this.props.idSchema.$id}_shortHandField`;
         let innerUiSchema = undefined;
         if (this.state.showSchema) {
@@ -140,7 +139,7 @@ let UnitShorthandField = class UnitShorthandField extends React.Component {
             innerUiSchema = Object.assign(Object.assign({}, innerUiSchema), { "ui:options": Object.assign(Object.assign({}, innerOptions), { buttons: [...(innerOptions.buttons || []), toggleButton] }) });
         }
         return !this.state.showSchema ? (React.createElement("div", { className: "laji-form-field-template-item", id: `_laji-form_${id}` },
-            React.createElement(CodeReader, { translations: this.props.formContext.translations, onChange: this.onCodeChange, value: this.props.formData[shorthandFieldName], formID: (0, utils_1.getUiOptions)(this.props.uiSchema).formID || formContext.formID || formContext.uiSchemaContext.formID, help: help, id: id, formContext: formContext, disabled: disabled, readonly: readonly, className: "laji-form-field-template-schema" }),
+            React.createElement(CodeReader, { translations: this.props.formContext.translations, onChange: this.onCodeChange, value: this.props.formData[shorthandField], formID: (0, utils_1.getUiOptions)(this.props.uiSchema).formID || formContext.formID || formContext.uiSchemaContext.formID, help: help, id: id, formContext: formContext, disabled: disabled, readonly: readonly, lineTransect: lineTransect, className: "laji-form-field-template-schema" }),
             React.createElement("div", { className: "laji-form-field-template-buttons" }, (0, ArrayFieldTemplate_1.getButton)(toggleButton)))) : (React.createElement(SchemaField, Object.assign({}, this.props, { uiSchema: innerUiSchema })));
     }
 };
@@ -185,14 +184,14 @@ let CodeReader = class CodeReader extends React.Component {
         this.onAutosuggestChange = (formData) => {
             this.props.onChange(formData);
         };
-        this.onSuggestionSelected = ({ payload: { unit } }) => {
+        this.onSuggestionSelected = ({ unit }) => {
             const { formContext } = this.props;
             unit = (0, utils_1.bringRemoteFormData)(unit, formContext);
             this.props.onChange(unit);
         };
         this.renderSuggestion = (suggestion) => {
             const { translations } = this.props;
-            return suggestion.payload.isNonMatching
+            return suggestion.isNonMatching
                 ? React.createElement("span", { className: "text-muted" },
                     suggestion.value,
                     " ",
@@ -212,8 +211,8 @@ let CodeReader = class CodeReader extends React.Component {
             }
             else if (value.length >= 3) {
                 this.mounted && this.setState({ loading: true });
-                this.apiClient.fetchCached("/autocomplete/unit", { q: value, formID: this.props.formID, includePayload: true }).then(response => {
-                    this.props.onChange(response.payload.unit);
+                this.apiClient.get("/shorthand/unit/line-transect", { query: { query: value } }).then(response => {
+                    this.props.onChange(response.unit);
                 }).catch(() => {
                     this.mounted && this.setState({ failed: true, loading: false });
                 });
@@ -230,18 +229,15 @@ let CodeReader = class CodeReader extends React.Component {
         this.mounted = false;
     }
     render() {
-        const { translations, readonly, disabled } = this.props;
+        const { translations, readonly, disabled, lineTransect } = this.props;
         let validationState = null;
         if (this.state.failed === true)
             validationState = "warning";
         else if (!(0, utils_1.isEmptyString)(this.props.value) && this.props.value === this.state.value)
             validationState = "success";
-        const { formID, formContext } = this.props;
-        const inputElem = LINE_TRANSECT_IDS.includes(formID) ? (React.createElement(components_1.FetcherInput, { id: this.props.id, loading: this.state.loading, value: this.state.value, validationState: validationState, onChange: this.onFetcherInputChange, onBlur: this.getCode, onKeyDown: this.onKeyDown, readonly: readonly, disabled: disabled })) : (React.createElement("div", { className: "unit-shorthand" },
-            React.createElement(AutosuggestWidget_1.Autosuggest, { autosuggestField: "unit", query: {
-                    formID,
-                    includeNonMatching: true
-                }, onSuggestionSelected: this.onSuggestionSelected, renderSuggestion: this.renderSuggestion, onChange: this.onAutosuggestChange, formContext: formContext, allowNonsuggestedValue: false })));
+        const { formContext } = this.props;
+        const inputElem = lineTransect ? (React.createElement(components_1.FetcherInput, { id: this.props.id, loading: this.state.loading, value: this.state.value, validationState: validationState, onChange: this.onFetcherInputChange, onBlur: this.getCode, onKeyDown: this.onKeyDown, readonly: readonly, disabled: disabled })) : (React.createElement("div", { className: "unit-shorthand" },
+            React.createElement(AutosuggestWidget_1.Autosuggest, { autosuggestField: "unit", onSuggestionSelected: this.onSuggestionSelected, renderSuggestion: this.renderSuggestion, onChange: this.onAutosuggestChange, formContext: formContext, allowNonsuggestedValue: false })));
         const { FormGroup, HelpBlock } = this.context.theme;
         return (React.createElement(FormGroup, { validationState: this.state.failed ? "error" : undefined },
             inputElem,

package/lib/components/widgets/AutosuggestWidget.js

@@ -38,6 +38,15 @@ var __importStar = (this && this.__importStar) || (function () {
         return result;
     };
 })();
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -63,7 +72,7 @@ const components_1 = require("../components");
 const ReactContext_1 = __importDefault(require("../../ReactContext"));
 const InformalTaxonGroupChooserWidget_1 = require("./InformalTaxonGroupChooserWidget");
 function renderFlag(suggestion, prepend) {
-    return (suggestion && suggestion.payload || {}).finnish
+    return (suggestion || {}).finnish
         ? React.createElement(React.Fragment, null,
             prepend || null,
             React.createElement("img", { src: "https://cdn.laji.fi/images/icons/flag_fi_small.png", width: "16" }))
@@ -73,10 +82,11 @@ class _AutosuggestWidget extends React.Component {
     render() {
         if (this.props.options) {
             switch (this.props.options.autosuggestField) {
+                case "taxa":
                 case "taxon":
-                    return React.createElement(TaxonAutosuggestWidget, Object.assign({}, this.props));
+                    return React.createElement(TaxonAutosuggestWidget, Object.assign({}, this.props, { options: Object.assign(Object.assign({}, this.props.options), { autosuggestField: "taxa" }) }));
                 case "unit":
-                    return React.createElement(UnitAutosuggestWidget, Object.assign({}, this.props));
+                    return React.createElement(UnitAutosuggestWidget, Object.assign({}, this.props, { basePath: "/shorthand/unit/trip-report" }));
                 case "friends":
                 case "person":
                     return React.createElement(FriendsAutosuggestWidget, Object.assign({}, this.props));
@@ -97,6 +107,7 @@ class _AutosuggestWidget extends React.Component {
             let component = undefined;
             switch (options.autosuggestField) {
                 case "taxon":
+                case "taxa":
                     component = TaxonAutosuggestWidget;
                     break;
                 case "unit":
@@ -176,11 +187,7 @@ function TaxonAutosuggest(ComposedComponent) {
                                 orWriteSpeciesNameLabel || this.props.formContext.translations.orWriteSpeciesName))));
                 };
                 this.onTaxonImgSelected = (taxonID, taxon) => {
-                    this.autosuggestRef.selectSuggestion({
-                        key: taxonID,
-                        value: taxon.vernacularName,
-                        payload: taxon
-                    });
+                    this.autosuggestRef.selectSuggestion(Object.assign({ key: taxonID, value: taxon.vernacularName }, taxon));
                 };
                 this.setAutosuggestRef = (elem) => {
                     this.autosuggestRef = elem;
@@ -212,19 +219,20 @@ function TaxonAutosuggest(ComposedComponent) {
                 }
             }
             getSuggestionFromValue(value) {
-                if (this.isValueSuggested(value)) {
-                    return this.props.formContext.apiClient.fetchCached(`/taxa/${value}`).then(({ vernacularName, scientificName }) => {
+                return __awaiter(this, void 0, void 0, function* () {
+                    if (this.isValueSuggested(value)) {
+                        const { vernacularName, scientificName } = yield this.props.formContext.apiClient.get(`/taxa/${id}`);
                         if (vernacularName !== undefined) {
                             return { value: vernacularName, key: value };
                         }
                         if (scientificName !== undefined) {
                             return { value: scientificName, key: value };
                         }
-                    });
-                }
-                else {
-                    return Promise.reject();
-                }
+                    }
+                    else {
+                        throw new Error("Unknown taxon");
+                    }
+                });
             }
             isValueSuggested(value) {
                 return !(0, utils_1.isEmptyString)(value) && !!value.match(/MX\.\d+/);
@@ -272,10 +280,10 @@ let UnitAutosuggestWidget = class UnitAutosuggestWidget extends React.Component
         this.renderSuggestion = this.renderSuggestion.bind(this);
     }
     renderSuggestion(suggestion) {
-        const { count, maleIndividualCount, femaleIndividualCount } = suggestion.payload.interpretedFrom;
+        const { count, maleIndividualCount, femaleIndividualCount } = suggestion.interpretedFrom;
         const [countElem, maleElem, femaleElem] = [count, maleIndividualCount, femaleIndividualCount].map(val => val && React.createElement("span", { className: "text-muted" }, val));
-        const taxonName = suggestion.payload.unit.identifications[0].taxon;
-        const name = suggestion.payload.isNonMatching
+        const taxonName = suggestion.unit.identifications[0].taxon;
+        const name = suggestion.isNonMatching
             ? React.createElement("span", { className: "text-muted" },
                 taxonName,
                 " ",
@@ -318,10 +326,11 @@ class FriendsAutosuggestWidget extends React.Component {
         this.isValueSuggested = this.isValueSuggested.bind(this);
     }
     getSuggestionFromValue(value) {
-        const { showID } = (0, utils_1.getUiOptions)(this.props);
-        const { isAdmin } = this.props.formContext.uiSchemaContext;
-        if (this.isValueSuggested(value)) {
-            return this.props.formContext.apiClient.fetchCached(`/person/by-id/${value}`).then(({ fullName, group, id }) => {
+        return __awaiter(this, void 0, void 0, function* () {
+            const { showID } = (0, utils_1.getUiOptions)(this.props);
+            const { isAdmin } = this.props.formContext.uiSchemaContext;
+            if (this.isValueSuggested(value)) {
+                const { fullName, group, id } = yield this.props.formContext.apiClient.get(`/person/by-id/${value}`);
                 if (fullName) {
                     const addGroup = str => group ? `${str} (${group})` : str;
                     const addID = str => isAdmin && showID ? `${str} (${id})` : str;
@@ -330,11 +339,11 @@ class FriendsAutosuggestWidget extends React.Component {
                         key: value
                     };
                 }
-            });
-        }
-        else {
-            return Promise.reject();
-        }
+            }
+            else {
+                throw new Error("Unknown friend");
+            }
+        });
     }
     isValueSuggested(value) {
         return !(0, utils_1.isEmptyString)(value) && value.match(/MA\.\d+/);
@@ -382,22 +391,21 @@ class BasicAutosuggestWidget extends React.Component {
         this.isValueSuggested = this.isValueSuggested.bind(this);
     }
     getSuggestionFromValue(value) {
-        const { autosuggestField, nameField } = this.props;
-        if (this.isValueSuggested(value)) {
-            const apiClient = this.props.formContext.apiClient;
-            const fetch = (this.props.cache ? apiClient.fetchCached : apiClient.fetch).bind(apiClient);
-            return fetch(`/${autosuggestField}/by-id/${value}`).then(result => {
+        return __awaiter(this, void 0, void 0, function* () {
+            const { autosuggestField, nameField } = this.props;
+            if (this.isValueSuggested(value)) {
+                const result = yield this.props.formContext.apiClient.get(`/${autosuggestField}/by-id/${value}`, undefined, this.props.cache);
                 if (result[nameField]) {
                     return {
                         value: result[nameField],
                         key: value
                     };
                 }
-            });
-        }
-        else {
-            return Promise.reject();
-        }
+            }
+            else {
+                throw new Error("Not autosuggested value");
+            }
+        });
     }
     isValueSuggested(value) {
         const regexp = new RegExp(this.props.validValueRegexp);
@@ -536,12 +544,12 @@ class Autosuggest extends React.Component {
             const { findExactMatch } = this.props;
             return findExactMatch
                 ? findExactMatch(suggestions, inputValue)
-                : suggestions.find(suggestion => (suggestion && suggestion.value.toLowerCase() === inputValue.trim().toLowerCase() && (!suggestion.payload || !suggestion.payload.isNonMatching)));
+                : suggestions.find(suggestion => (suggestion && suggestion.value.toLowerCase() === inputValue.trim().toLowerCase() && !suggestion.isNonMatching));
         };
         this.findTheOnlyOneMatch = (suggestions) => {
             if (!Array.isArray(suggestions))
                 suggestions = [suggestions];
-            const filtered = suggestions.filter(suggestion => !suggestion || !suggestion.payload || !suggestion.payload.isNonMatching);
+            const filtered = suggestions.filter(suggestion => !suggestion || !suggestion.isNonMatching);
             if (filtered.length === 1) {
                 return filtered[0];
             }
@@ -549,7 +557,7 @@ class Autosuggest extends React.Component {
         this.findNonMatching = (suggestions) => {
             if (!Array.isArray(suggestions))
                 suggestions = [suggestions];
-            const filtered = suggestions.filter(suggestion => suggestion && suggestion.payload && suggestion.payload.isNonMatching);
+            const filtered = suggestions.filter(suggestion => suggestion && suggestion.isNonMatching);
             if (filtered.length === 1) {
                 return filtered[0];
             }
@@ -572,11 +580,15 @@ class Autosuggest extends React.Component {
             }
             const { autosuggestField, query = {} } = this.props;
             this.setState({ isLoading: true });
-            const request = () => {
+            const request = () => __awaiter(this, void 0, void 0, function* () {
                 let timestamp = Date.now();
                 this.promiseTimestamp = timestamp;
-                const fetch = (this.props.cache ? this.apiClient.fetchCached : this.apiClient.fetch).bind(this.apiClient);
-                fetch("/autocomplete/" + autosuggestField, Object.assign({ q: value, includePayload: true, matchType: "exact,partial", includeHidden: false }, query)).then(suggestions => {
+                try {
+                    let suggestionsResponse = yield this.apiClient.get(this.props.basePath || "/autocomplete" + "/" + autosuggestField, { query: Object.assign({ 
+                            // Hack for laji-form in Kotka, since it uses API that isn't laji-api and q was renamed to query in laji-api
+                            q: value, query: value, matchType: "exact,partial", includeHidden: false }, query) }, this.props.cache);
+                    // Hack for laji-form in Kotka, since it uses API that isn't laji-api and might have different response signature.
+                    let suggestions = Array.isArray(suggestionsResponse) ? suggestionsResponse : suggestionsResponse.results;
                     if (this.props.prepareSuggestion) {
                         suggestions = suggestions.map(s => this.props.prepareSuggestion(s));
                     }
@@ -586,12 +598,13 @@ class Autosuggest extends React.Component {
                     this.mounted
                         ? this.setState({ isLoading: false, suggestions }, () => this.afterBlurAndFetch(suggestions))
                         : this.afterBlurAndFetch(suggestions);
-                }).catch(() => {
+                }
+                catch (e) {
                     this.mounted
                         ? this.setState({ isLoading: false }, this.afterBlurAndFetch)
                         : this.afterBlurAndFetch();
-                });
-            };
+                }
+            });
             if (this.timeout) {
                 clearTimeout(this.timeout);
             }
@@ -802,10 +815,10 @@ class Autosuggest extends React.Component {
             ? this.props.highlightFirstSuggestion
             : !this.props.allowNonsuggestedValue;
         const { renderExtra } = props;
-        return (React.createElement(React.Fragment, null,
+        return React.createElement(React.Fragment, null,
             renderExtra && renderExtra(),
             React.createElement("div", { className: (0, utils_1.classNames)("autosuggest-wrapper", props.wrapperClassName) },
-                React.createElement(ReactAutosuggest, { id: `${this.props.id}-autosuggest`, inputProps: inputProps, renderInputComponent: this.renderInput, suggestions: suggestions, renderSuggestion: this.renderSuggestion, onSuggestionsFetchRequested: this.onSuggestionsFetchRequested, onSuggestionsClearRequested: this.onSuggestionsClearRequested, onSuggestionSelected: this.onSuggestionSelected, onUnsuggestedSelected: this.onUnsuggestedSelected, highlightFirstSuggestion: highlightFirstSuggestion, suggestionsOpenOnFocus: !this.isSuggested(), theme: cssClasses, formContext: this.props.formContext, ref: this.setRef }))));
+                React.createElement(ReactAutosuggest, { id: `${this.props.id}-autosuggest`, inputProps: inputProps, renderInputComponent: this.renderInput, suggestions: suggestions, renderSuggestion: this.renderSuggestion, onSuggestionsFetchRequested: this.onSuggestionsFetchRequested, onSuggestionsClearRequested: this.onSuggestionsClearRequested, onSuggestionSelected: this.onSuggestionSelected, onUnsuggestedSelected: this.onUnsuggestedSelected, highlightFirstSuggestion: highlightFirstSuggestion, suggestionsOpenOnFocus: !this.isSuggested(), theme: cssClasses, formContext: this.props.formContext, ref: this.setRef })));
     }
 }
 exports.Autosuggest = Autosuggest;
@@ -842,21 +855,22 @@ class _TaxonWrapper extends React.Component {
         this.fetch(value);
     }
     fetch(value) {
-        if (!value) {
-            this.setState({ scientificName: "", cursiveName: false });
-        }
-        else {
-            this.props.formContext.apiClient.fetchCached(`/taxa/${value}`).then(({ scientificName, cursiveName, vernacularName, taxonRank, informalTaxonGroups, finnish }) => {
-                if (!this.mounted)
-                    return;
-                this.setState({ value, taxonRank, informalTaxonGroups, taxon: { scientificName, vernacularName, cursiveName, finnish } });
-                (0, InformalTaxonGroupChooserWidget_1.getInformalGroups)(this.props.formContext.apiClient).then(({ informalTaxonGroupsById }) => {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!value) {
+                this.setState({ scientificName: "", cursiveName: false });
+            }
+            else {
+                this.props.formContext.apiClient.get(`/taxa/${value}`).then(({ scientificName, cursiveName, vernacularName, taxonRank, informalGroups, finnish }) => {
                     if (!this.mounted)
                         return;
-                    this.setState({ informalTaxonGroupsById });
+                    this.setState({ value, taxonRank, informalTaxonGroups: informalGroups, taxon: { scientificName, vernacularName, cursiveName, finnish } });
+                    (0, InformalTaxonGroupChooserWidget_1.getInformalGroups)(this.props.formContext.apiClient).then(({ informalTaxonGroupsById }) => {
+                        if (!this.mounted)
+                            return;
+                        this.setState({ informalTaxonGroupsById });
+                    });
                 });
-            });
-            this.props.formContext.apiClient.fetchCached(`/taxa/${value}/parents`).then(parents => {
+                const parents = (yield this.props.formContext.apiClient.get(`/taxa/${value}/parents`)).results;
                 if (!this.mounted)
                     return;
                 const state = { order: undefined, family: undefined };
@@ -874,13 +888,12 @@ class _TaxonWrapper extends React.Component {
                     }
                 }
                 this.setState(Object.assign(Object.assign({}, state), { higherThanOrder: !state.order && !state.family }));
-            });
-            this.props.formContext.apiClient.fetchCached("/metadata/ranges/MX.taxonRankEnum").then(taxonRanks => {
+                const taxonRanks = yield this.props.formContext.apiClient.get("/metadata/ranges/MX.taxonRankEnum");
                 if (!this.mounted)
                     return;
                 this.setState({ taxonRanks: (0, utils_1.dictionarify)(taxonRanks, function getKey(rank) { return rank.id; }, function getValue(rank) { return rank.value; }) });
-            });
-        }
+            }
+        });
     }
     render() {
         const { id, formContext, value, children, placement, inputValue, isSuggested } = this.props;
@@ -995,7 +1008,7 @@ class TaxonImgChooser extends React.Component {
     }
     componentDidMount() {
         this.mounted = true;
-        this.props.formContext.apiClient.fetchCached(`/taxa/${this.props.id}`, { includeMedia: true }).then(taxon => {
+        this.props.formContext.apiClient.get(`/taxa/${this.props.id}`, { query: { includeMedia: true } }).then(taxon => {
             if (!this.mounted)
                 return;
             if (taxon.multimedia && taxon.multimedia.length) {
@@ -1042,7 +1055,7 @@ const TaxonName = ({ scientificName, vernacularName = "", cursiveName, finnish }
     return (React.createElement(React.Fragment, null,
         `${vernacularName}${vernacularName ? " " : ""}`,
         cursiveName ? React.createElement("i", null, _scientificName) : _scientificName,
-        renderFlag({ payload: { finnish } }, " ")));
+        renderFlag({ finnish }, " ")));
 };
 class ReactAutosuggest extends React.Component {
     constructor(props) {

package/lib/components/widgets/InformalTaxonGroupChooserWidget.js

@@ -161,7 +161,7 @@ function getInformalGroups(apiClient) {
     if (informalTaxonGroups) {
         return Promise.resolve({ informalTaxonGroups, informalTaxonGroupsById });
     }
-    return apiClient.fetchCached("/informal-taxon-groups/tree").then(response => {
+    return apiClient.get("/informal-taxon-groups/tree").then(response => {
         // Contains the current taxon group.
         const informalTaxonGroups = mapGroupsById(response.results);
         // Contains all groups in flat object.

package/lib/components/widgets/InputWithDefaultValueButtonWidget.js

@@ -54,9 +54,8 @@ class InputWithDefaultValueButtonWidget extends React.Component {
             else if (apiQueryForDefaultValue) {
                 const { path, query = {}, resultKey, cache = false } = apiQueryForDefaultValue;
                 const apiClient = this.props.formContext.apiClient;
-                const fetch = (cache ? apiClient.fetchCached : apiClient.fetch).bind(apiClient);
                 this.setState({ fetching: true });
-                return fetch(path, query).then(result => {
+                return apiClient.get(path, { query }, cache).then(result => {
                     if (result[resultKey]) {
                         this.props.onChange(result[resultKey]);
                     }

package/lib/validation.js

@@ -39,7 +39,7 @@ exports.toErrorSchema = toErrorSchema;
 const lajiValidate = __importStar(require("@luomus/laji-validate"));
 function initializeValidation(apiClient) {
     lajiValidate.extend(lajiValidate.validators.remote, {
-        fetch: (...params) => apiClient.fetchRaw(...params)
+        fetch: (...params) => apiClient.apiClient.fetch(...params)
     });
 }
 exports.default = ({ errors: error, warnings: warning }, data) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luomus/laji-form",
-  "version": "15.1.66",
+  "version": "15.1.68",
   "description": "React module capable of building dynamic forms from Laji form json schemas",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -28,7 +28,8 @@
     "test:docker": "npm run test:docker:build && npm run test:docker:run --",
     "test:lightweight": "npx playwright test --project chromium",
     "test:docker:build": "docker build -t laji-form-test -f test.Dockerfile .",
-    "test:docker:run": "docker run laji-form-test"
+    "test:docker:run": "docker run laji-form-test",
+    "generate:api-client": "openapi-typescript https://apitest.laji.fi/explorer-json -o ./generated/api.d.ts --properties-required-by-default"
   },
   "keywords": [
     "react-jsonschema-form",
@@ -71,7 +72,7 @@
     "@playwright/test": "^1.40.1",
     "@stylistic/eslint-plugin": "^5.4.0",
     "@types/jasmine": "^3.7.7",
-    "@types/node": "^20.17.0",
+    "@types/node": "^24.5.2",
     "@typescript-eslint/eslint-plugin": "^8.44.1",
     "@typescript-eslint/parser": "^8.44.1",
     "copy-webpack-plugin": "^9.0.1",
@@ -82,6 +83,7 @@
     "eslint-plugin-react-hooks": "^5.2.0",
     "mini-css-extract-plugin": "^2.1.0",
     "notus": "^0.3.2",
+    "openapi-typescript": "^7.9.1",
     "querystring": "^0.2.1",
     "rimraf": "^2.5.4",
     "style-loader": "^3.0.0",