@luomus/laji-form 15.1.67 → 15.1.69

package/lib/ApiClient.d.ts

@@ -1,90 +1,47 @@
 import { Translations } from "./components/LajiForm";
 import { Lang } from "./types";
-import type { paths } from "generated/api";
-export declare class LajiApiError extends Error {
-    statusCode: number;
-    constructor(message: string, statusCode: number);
-}
 interface Query {
     [param: string]: any;
 }
+interface Options {
+    failSilently?: boolean;
+    [option: string]: any;
+}
 export interface ApiClientImplementation {
-    fetch: (path: string, query: Query, options: any) => Promise<Response>;
+    fetch: (path: string, query: Query, options: any) => Promise<any>;
 }
-type RelaxQuery<P, K extends string> = P extends {
-    query: infer Q;
-} ? Omit<P, "query"> & (Record<string, unknown> extends Omit<Q, Extract<keyof Q, K>> ? {
-    query?: Omit<Q, Extract<keyof Q, K>> & Partial<Pick<Q, Extract<keyof Q, K>>>;
-} : {
-    query: Omit<Q, Extract<keyof Q, K>> & Partial<Pick<Q, Extract<keyof Q, K>>>;
-}) : P;
-type MiddlewareInjectedKeys = "collectionID" | "formID" | "personToken";
-type Parameters<T> = "parameters" extends keyof T ? T["parameters"] : never;
-type ExtractContentIfExists<R> = R extends {
-    content: infer C;
-} ? C[keyof C] : null;
-type ExtractRequestBodyIfExists<R> = R extends {
-    requestBody: {
-        content: infer C;
-    };
-} | {
-    requestBody?: {
-        content: infer C;
-    };
-} ? C[keyof C] : never;
-type HttpSuccessCodes = 200 | 201 | 202 | 203 | 204 | 205 | 206 | 207 | 208 | 226;
-type IntersectUnionTypes<A, B> = A extends B ? A : never;
-type WithResponses<T> = T & {
-    responses: unknown;
-};
-type Path = keyof paths & string;
-type PathWithMethod<M extends string> = keyof {
-    [P in keyof paths as paths[P] extends Record<M, any> ? P : never]: paths[P];
-};
-type Method<P extends Path> = Exclude<keyof {
-    [K in keyof paths[P] as paths[P][K] extends undefined | never ? never : K]: paths[P][K];
-}, "parameters">;
-type Responses<P extends Path, M extends Method<P>> = WithResponses<paths[P][M]>["responses"];
-type CacheNode = {
-    branches: Map<string, CacheNode>;
-    queries: Map<string, Promise<any>>;
-    path: string;
-};
 /**
- * ApiClient with automatically generated typings for laji-api. An `ApiClientImplementation` must be provided, that will
- * perform the actual requests. The implementation acts as a middleware for injecting access token and person token.
- *
- * Get requests are automatically cached, and they will flush if the resource receives a POST/PUT/DELETE request.
+ * ApiClient "interface". Wraps the given apiClient as a singleton object.
+ * Given apiClient must implement fetch().
  */
 export default class ApiClient {
     apiClient: ApiClientImplementation;
     lang: Lang;
     translations: Translations;
-    cacheTree: CacheNode;
+    cache: {
+        [path: string]: {
+            [cacheKey: string]: Promise<any>;
+        };
+    };
     on: {
         [path: string]: (() => void)[];
     };
     constructor(apiClient: ApiClientImplementation, lang: Lang | undefined, translations: Translations);
-    private flush;
-    private getCacheNode;
-    /** The response is cached until the resource receives a POST/PUT/DELETE request. */
-    get<P extends PathWithMethod<"get">, R extends Responses<P, "get" extends Method<P> ? "get" : never>>(path: P, params?: RelaxQuery<Parameters<paths[P]["get"]>, MiddlewareInjectedKeys>, useCache?: boolean): Promise<ExtractContentIfExists<R[IntersectUnionTypes<keyof R, HttpSuccessCodes>]>>;
-    /** Subscribe to a GET request. It re-emits when the resource receives a POST/PUT/DELETE request. */
-    subscribe<P extends PathWithMethod<"get">, R extends Responses<P, "get" extends Method<P> ? "get" : never>>(path: P, params: RelaxQuery<Parameters<paths[P]["get"]>, MiddlewareInjectedKeys> | undefined, onFulfilled: (response: ExtractContentIfExists<R[IntersectUnionTypes<keyof R, HttpSuccessCodes>]>) => void, onError?: () => void, 
-    /**
-     * Store doesn't sync it's search indices right away after data is changed, so delaying the request can be useful
-     */
-    delay?: number): () => void;
-    put<P extends PathWithMethod<"put">, R extends Responses<P, "put" extends Method<P> ? "put" : never>>(path: P, params?: RelaxQuery<Parameters<paths[P]["put"]>, MiddlewareInjectedKeys>, body?: ExtractRequestBodyIfExists<paths[P]["put"]>): Promise<ExtractContentIfExists<R[IntersectUnionTypes<keyof R, HttpSuccessCodes>]>>;
-    post<P extends PathWithMethod<"post">, R extends Responses<P, "post" extends Method<P> ? "post" : never>>(path: P, params?: RelaxQuery<Parameters<paths[P]["post"]>, MiddlewareInjectedKeys>, body?: ExtractRequestBodyIfExists<paths[P]["post"]>): Promise<ExtractContentIfExists<R[IntersectUnionTypes<keyof R, HttpSuccessCodes>]>>;
-    delete<P extends PathWithMethod<"delete">, R extends Responses<P, "delete" extends Method<P> ? "delete" : never>>(path: P, params?: RelaxQuery<Parameters<paths[P]["delete"]>, MiddlewareInjectedKeys>): Promise<ExtractContentIfExists<R[IntersectUnionTypes<keyof R, HttpSuccessCodes>]>>;
     /**
      * Implementing apiClient must return a promise that passes the raw response as 1st arg.
      * @param path URL for GET.
      * @param query Object, where keys are param names and values are param values.
      * @returns a Promise.
      */
-    fetch<P extends Path, M extends Method<P>, R extends Responses<P, M>>(path: P, method: M, params?: Parameters<paths[P][M]>, body?: ExtractRequestBodyIfExists<paths[P][M]>, options?: any): Promise<ExtractContentIfExists<R[IntersectUnionTypes<keyof R, HttpSuccessCodes>]>>;
+    fetchRaw(path: string, query?: Query, options?: any): Promise<any>;
+    fetch<T>(path: string, query?: Query, options?: Options): Promise<T>;
+    getCacheKey(query?: Query, options?: Options): string;
+    fetchCached<T>(path: string, query?: Query, options?: Options): Promise<T>;
+    invalidateCachePath(path: string): void;
+    invalidateCachePathQuery(path: string, query: string): void;
+    flushCache: () => void;
+    onCachePathInvalidation(path: string, callback: () => void): void;
+    removeOnCachePathInvalidation(path: string, callback: () => void): void;
     setLang(lang: Lang): void;
 }
 export {};

package/lib/ApiClient.js

@@ -1,200 +1,96 @@
 "use strict";
-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)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.LajiApiError = void 0;
-class LajiApiError extends Error {
-    constructor(message, statusCode) {
-        super(message);
-        this.statusCode = statusCode;
-    }
-}
-exports.LajiApiError = LajiApiError;
-const splitAndResolvePath = (path, params) => {
-    // parse path into segments based on path parameters
-    // eg. "/person/{personToken}/profile" -> ["/person", "/{personToken}", "/profile"]
-    const segments = path.split(/(\/\{[^}]+\})/).filter(Boolean);
-    if (!params) {
-        return segments;
-    }
-    // resolve path parameters (eg. replace '/{personToken}' with params.path.personToken)
-    for (let i = 1; i < segments.length; i++) {
-        const segment = segments[i];
-        segments[i] = segment.replace(/\{([^}]+)\}/, (match, p1) => { var _a; return (_a = params["path"][p1]) !== null && _a !== void 0 ? _a : ""; });
-    }
-    return segments;
-};
 /**
- * ApiClient with automatically generated typings for laji-api. An `ApiClientImplementation` must be provided, that will
- * perform the actual requests. The implementation acts as a middleware for injecting access token and person token.
- *
- * Get requests are automatically cached, and they will flush if the resource receives a POST/PUT/DELETE request.
+ * ApiClient "interface". Wraps the given apiClient as a singleton object.
+ * Given apiClient must implement fetch().
  */
 class ApiClient {
     constructor(apiClient, lang = "en", translations) {
-        this.lang = "en";
-        this.cacheTree = { branches: new Map(), queries: new Map(), path: "" };
+        this.cache = {};
         this.on = {};
+        this.flushCache = () => {
+            this.cache = {};
+        };
         this.apiClient = apiClient;
         this.lang = lang;
         this.translations = translations;
     }
-    flush(path, params) {
-        var _a;
-        const segments = splitAndResolvePath(path, params);
-        let node = this.cacheTree;
-        const nodesToFlush = [];
-        for (let i = 0; i < segments.length; i++) {
-            const segment = segments[i];
-            if (node.branches.has(segment)) {
-                node = node.branches.get(segment);
-                nodesToFlush.push(node);
-            }
-            else {
-                break;
-            }
-        }
-        for (let i = 0; i < nodesToFlush.length; i++) {
-            const node = nodesToFlush[i];
-            node.queries = new Map();
-            (_a = this.on[node.path]) === null || _a === void 0 ? void 0 : _a.forEach(fn => fn());
-        }
-    }
-    getCacheNode(path, params) {
-        const segments = splitAndResolvePath(path, params);
-        const serializedQuery = hashRecord((params === null || params === void 0 ? void 0 : params.query) || {});
-        let node = this.cacheTree;
-        for (let i = 0; i < segments.length; i++) {
-            const segment = segments[i];
-            if (node.branches.has(segment)) {
-                node = node.branches.get(segment);
-            }
-            else {
-                const newNode = { branches: new Map(), queries: new Map(), path: segments.join("") };
-                node.branches.set(segment, newNode);
-                node = newNode;
-            }
-            if (i === segments.length - 1) {
-                continue;
-            }
-            if (node.queries.has(serializedQuery)) {
-                return node;
-            }
+    /**
+     * Implementing apiClient must return a promise that passes the raw response as 1st arg.
+     * @param path URL for GET.
+     * @param query Object, where keys are param names and values are param values.
+     * @returns a Promise.
+     */
+    fetchRaw(path, query, options) {
+        const _query = Object.assign({ lang: this.lang }, (query || {}));
+        if (!_query.lang) {
+            delete _query.lang;
         }
-        return node;
+        return this.apiClient.fetch(path, _query, options).catch(() => {
+            throw new Error(this.translations[this.lang].RequestFailed);
+        });
     }
-    ;
-    /** The response is cached until the resource receives a POST/PUT/DELETE request. */
-    get(path_1, params_1) {
-        return __awaiter(this, arguments, void 0, function* (path, params, useCache = true) {
-            let cacheNode;
-            let serializedQuery;
-            if (useCache) {
-                serializedQuery = hashRecord(params === null || params === void 0 ? void 0 : params.query);
-                cacheNode = this.getCacheNode(path, params);
-                if (cacheNode.queries.has(serializedQuery)) {
-                    return cacheNode.queries.get(serializedQuery);
-                }
+    fetch(path, query, options = {}) {
+        const { failSilently = false } = options, fetchOptions = __rest(options, ["failSilently"]);
+        return this.fetchRaw(path, query, fetchOptions).then(response => {
+            if (!failSilently && response.status >= 400) {
+                throw new Error("Request failed");
             }
-            const result = this.fetch(path, "get", params);
-            if (useCache) {
-                cacheNode.queries = cacheNode.queries;
-                cacheNode.queries.set(serializedQuery, result);
+            if (response.status === 204) {
+                return undefined;
             }
-            return result;
+            return response.json();
+        }).catch(() => {
+            if (this.cache[path])
+                delete this.cache[path][this.getCacheKey(query, options)];
+            throw new Error(this.translations[this.lang].RequestFailed);
         });
     }
-    /** Subscribe to a GET request. It re-emits when the resource receives a POST/PUT/DELETE request. */
-    subscribe(path, params, onFulfilled, onError, 
-    /**
-     * Store doesn't sync it's search indices right away after data is changed, so delaying the request can be useful
-     */
-    delay) {
-        if (!this.on[path])
-            this.on[path] = [];
-        const fn = delay
-            ? () => { setTimeout(() => this.get(path, params).then(onFulfilled, onError), delay); }
-            : () => { this.get(path, params).then(onFulfilled, onError); };
-        this.on[path].push(fn);
-        this.get(path, params).then(onFulfilled, onError);
-        return () => {
-            this.on[path] = this.on[path].filter(_fn => _fn !== fn);
-        };
+    getCacheKey(query, options) {
+        return JSON.stringify(query) + JSON.stringify(options);
     }
-    put(path, params, body) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const result = yield this.fetch(path, "put", params, body);
-            this.flush(path, params);
-            return result;
-        });
+    fetchCached(path, query, options) {
+        const cacheKey = this.getCacheKey(query, options);
+        if (!this.cache[path])
+            this.cache[path] = {};
+        this.cache[path][cacheKey] = cacheKey in this.cache[path] ? this.cache[path][cacheKey] : this.fetch(path, query, options);
+        return this.cache[path][cacheKey];
     }
-    post(path, params, body) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const result = this.fetch(path, "post", params, body);
-            this.flush(path, params);
-            return result;
-        });
+    invalidateCachePath(path) {
+        delete this.cache[path];
+        if (this.on[path]) {
+            this.on[path].forEach(callback => callback());
+        }
     }
-    delete(path, params) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const result = this.fetch(path, "delete", params);
-            this.flush(path, params);
-            return result;
-        });
+    //TODO on invalidation callbacks
+    invalidateCachePathQuery(path, query) {
+        if (this.cache[path])
+            delete this.cache[path][query];
     }
-    /**
-     * Implementing apiClient must return a promise that passes the raw response as 1st arg.
-     * @param path URL for GET.
-     * @param query Object, where keys are param names and values are param values.
-     * @returns a Promise.
-     */
-    fetch(path_1, method_1, params_1, body_1) {
-        return __awaiter(this, arguments, void 0, function* (path, method, params, body, options = {}) {
-            const _query = Object.assign({ lang: this.lang }, ((params === null || params === void 0 ? void 0 : params.query) || {}));
-            if (!_query.lang) {
-                delete _query.lang;
-            }
-            const pathSegments = splitAndResolvePath(path, params);
-            options = Object.assign(Object.assign({}, options), { headers: Object.assign(Object.assign({}, (options.header || {})), { "API-Version": 1, "Accept-Language": this.lang }) });
-            if (body && !otherThanJSON(body)) {
-                options = Object.assign(Object.assign({}, options), { headers: Object.assign(Object.assign({}, (options.header || {})), { "Content-Type": "application/json", "Accept": "application/json" }) });
-                body = JSON.stringify(body);
-            }
-            const response = yield this.apiClient.fetch(pathSegments.join(""), _query, Object.assign({ method, body }, options));
-            if (response.status >= 400) {
-                const error = yield response.json();
-                throw new LajiApiError(error === null || error === void 0 ? void 0 : error.message, response.status);
-            }
-            return (response.headers.get("Content-Type") || "").includes("application/json")
-                ? response.json()
-                : response.text();
-        });
+    onCachePathInvalidation(path, callback) {
+        if (!this.on[path])
+            this.on[path] = [];
+        this.on[path].push(callback);
+    }
+    removeOnCachePathInvalidation(path, callback) {
+        if (this.on[path]) {
+            this.on[path] = this.on[path].filter(fn => fn !== callback);
+        }
     }
     setLang(lang) {
         this.lang = lang;
-        this.cacheTree = { branches: new Map(), queries: new Map(), path: "" };
+        this.flushCache();
     }
 }
 exports.default = ApiClient;
-const otherThanJSON = (body) => body instanceof FormData ||
-    body instanceof Blob ||
-    body instanceof ArrayBuffer ||
-    body instanceof URLSearchParams ||
-    body instanceof ReadableStream;
-function isRecord(value) {
-    return typeof value === "object" && value !== null && !Array.isArray(value);
-}
-const sortRecordRecursively = (record) => (Object.entries(record)
-    .sort(([aKey, aVal], [bKey, bVal]) => aKey > bKey ? 1 : aKey < bKey ? -1 : 0)
-    .reduce((acc, [key, value]) => {
-    acc[key] = isRecord(value) ? sortRecordRecursively(value) : value;
-    return acc;
-}, Object.create(null)));
-const hashRecord = (record) => JSON.stringify(sortRecordRecursively(record || {}));

package/lib/components/LajiForm.js

@@ -510,7 +510,7 @@ class LajiForm extends React.Component {
         this.state = this.getStateFromProps(props);
     }
     UNSAFE_componentWillReceiveProps(props) {
-        if (props.apiClient && props.apiClient !== this.apiClient.apiClient) {
+        if (props.apiClient && props.apiClient !== this.apiClient) {
             this.apiClient = new ApiClient_1.default(props.apiClient, props.lang, this.translations);
         }
         if (this.apiClient && "lang" in props && this.props.lang !== props.lang) {

package/lib/components/fields/AnnotationField.js

@@ -38,15 +38,6 @@ 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 __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -143,24 +134,29 @@ exports.default = AnnotationField;
 class AnnotationBox extends React.Component {
     constructor(props) {
         super(props);
-        this.onAnnotationSubmit = (_a) => __awaiter(this, [_a], void 0, function* ({ formData }) {
+        this.onAnnotationSubmit = ({ formData }) => {
             const { type } = this.getAddOptions();
             const rootID = this.props.formContext.services.rootInstance.getFormData().id;
             this.props.formContext.services.blocker.push();
-            const body = Object.assign(Object.assign({}, formData), { targetID: this.props.id, rootID, type, byRole: "MMAN.formAdmin" });
-            try {
-                const annotation = yield this.props.formContext.apiClient.post("/annotations", undefined, body);
+            this.props.formContext.apiClient.fetchRaw("/annotations", undefined, {
+                method: "POST",
+                body: JSON.stringify(Object.assign(Object.assign({}, formData), { targetID: this.props.id, rootID, type, byRole: "MMAN.formAdmin" }))
+            }).then(response => {
+                if (response.status >= 400) {
+                    throw new Error("Request failed");
+                }
+                return response.json();
+            }).then(annotation => {
                 this.props.formContext.services.blocker.pop();
                 const annotationContext = (0, Context_1.default)(`${this.props.formContext.contextId}_ANNOTATIONS`);
                 const annotations = [annotation];
                 annotationContext[this.props.id] = annotations;
                 this.setState({ annotations: annotations, fail: false });
-            }
-            catch (e) {
+            }).catch(() => {
                 this.props.formContext.services.blocker.pop();
                 this.setState({ fail: true });
-            }
-        });
+            });
+        };
         this.onAnnotationChange = (formData) => {
             let state = {};
             if (this.state.fail !== undefined) {
@@ -217,30 +213,30 @@ class AnnotationBox extends React.Component {
             return add && addSchema ? (React.createElement(LajiForm_1.default, Object.assign({}, metadataForm, { schema: addSchema, uiSchema: addUiSchema || _uiSchema, onSubmit: this.onAnnotationSubmit, onChange: this.onAnnotationChange, renderSubmit: renderSubmit, formData: addFormData, lang: lang, apiClient: this.props.formContext.apiClient.apiClient, uiSchemaContext: this.props.formContext.uiSchemaContext }), React.createElement("div", null,
                 this.state.fail !== undefined &&
                     React.createElement(Alert, { variant: this.state.fail ? "danger" : "success" }, translations[this.state.fail ? "SaveFail" : "SaveSuccess"]),
-                renderSubmit && React.createElement(components_1.Button, { id: "submit", type: "submit", onClick: this.onAnnotationSubmit }, translations.Submit)))) : null;
+                renderSubmit && React.createElement(components_1.Button, { id: "submit", type: "submit" }, translations.Submit)))) : null;
         };
         this.getUiSchema = () => {
             const { uiSchema } = this.props;
             const { metadataForm = {} } = this.state;
             return uiSchema || Object.assign(Object.assign({}, metadataForm.uiSchema), { "ui:shortcuts": Object.assign(Object.assign({}, ((metadataForm.uiSchema || {})["ui:shorcuts"] || {})), (this.props.formContext.services.keyHandler.shortcuts)), "ui:showShortcutsButton": false });
         };
-        this.onDelete = (id) => () => __awaiter(this, void 0, void 0, function* () {
-            try {
-                yield this.props.formContext.apiClient.delete("/annotations/{id}", { path: { id } });
+        this.onDelete = (id) => () => {
+            this.props.formContext.apiClient.fetchRaw(`/annotations/${id}`, undefined, {
+                method: "DELETE"
+            }).then(() => {
                 const annotationContext = (0, Context_1.default)(`${this.props.formContext.contextId}_ANNOTATIONS`);
                 const annotations = this.state.annotations.filter(({ id: _id }) => _id !== id);
                 annotationContext[this.props.id] = annotations;
                 this.setState({ deleteFail: false, annotations });
-            }
-            catch (e) {
+            }).catch(() => {
                 this.setState({ deleteFail: true });
-            }
-        });
+            });
+        };
         this.state = { annotations: props.annotations || [] };
     }
     componentDidMount() {
         this.mounted = true;
-        this.props.formContext.apiClient.get(`/forms/${this.props.formId}`, { query: { format: "schema" } })
+        this.props.formContext.apiClient.fetchCached(`/forms/${this.props.formId}`, { lang: this.props.lang, format: "schema" })
             .then(metadataForm => {
             if (!this.mounted)
                 return;

package/lib/components/fields/AudioArrayField.js

@@ -38,15 +38,6 @@ 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 __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -127,18 +118,14 @@ const LajiAudio = React.forwardRef((props, ref) => {
     const [mp3Url, setMp3Url] = useState(null);
     const [wavUrl, setWavUrl] = useState(null);
     const [flacUrl, setFlacUrl] = useState(null);
-    useEffect(() => __awaiter(void 0, void 0, void 0, function* () {
-        let response;
-        try {
-            response = yield props.apiClient.get(`/audio/${props.id}`);
+    useEffect(() => {
+        props.apiClient.fetchCached(`/audio/${props.id}`, undefined, { failSilently: true }).then(response => {
             setMp3Url(response.mp3URL);
             setWavUrl(response.wavURL);
             setFlacUrl(response.flacURL);
-        }
-        catch (e) {
-        }
-        props.onLoaded && props.onLoaded(true);
-    }));
+            props.onLoaded && props.onLoaded(true);
+        });
+    });
     return !mp3Url ? React.createElement(react_spinner_1.default, { style: props.style }) : (React.createElement("div", null,
         React.createElement("audio", { controls: true, style: props.style, ref: ref, onPause: props.onStop },
             React.createElement("source", { src: mp3Url })),

package/lib/components/fields/AutosuggestField.d.ts

@@ -7,8 +7,8 @@
  *  suggestionValueField: <fieldName> (the field which the value for autosuggest is pulled from)
  *  suggestionReceivers: {
  *    <fieldName>: <suggestion path>,     (when an autosuggestion is selected, these fields receive the autosuggestions value defined by suggestion path.
- *    <fieldName2>: <suggestion path 2>,   Example: autosuggestion = {key: "MLV.2", value: "kalalokki", informalGroups: ["linnut"]}
- *   }                                              suggestionReceivers: {someFieldName: "key", someFieldName2: "/informalgroups/0"}
+ *    <fieldName2>: <suggestion path 2>,   Example: autosuggestion = {key: "MLV.2", value: "kalalokki", payload: {informalGroups: ["linnut"]}}
+ *   }                                              suggestionReceivers: {someFieldName: "key", someFieldName2: "/payload/informalgroups/0"}
  *                                         If fieldName start  with '$', then a function from autosuggestFieldSettings parses the suggestion. Example: $taxonGroup
  *                                         If fieldName start  with '/', it is handled as a JSON pointer.
  *  uiSchema: <uiSchema> (uiSchema which is passed to inner SchemaField)

package/lib/components/fields/AutosuggestField.js

@@ -43,7 +43,7 @@ const Context_1 = __importDefault(require("../../Context"));
 const deepmerge_1 = __importDefault(require("deepmerge"));
 const suggestionParsers = {
     taxonGroup: suggestion => {
-        return (suggestion.informalGroups || []).map(item => typeof item === "string" ? item : item.id);
+        return suggestion.payload ? suggestion.payload.informalTaxonGroups.map(item => typeof item === "string" ? item : item.id) : [];
     }
 };
 const parseQuery = (query, props, taxonGroups) => {
@@ -70,8 +70,8 @@ const parseQuery = (query, props, taxonGroups) => {
  *  suggestionValueField: <fieldName> (the field which the value for autosuggest is pulled from)
  *  suggestionReceivers: {
  *    <fieldName>: <suggestion path>,     (when an autosuggestion is selected, these fields receive the autosuggestions value defined by suggestion path.
- *    <fieldName2>: <suggestion path 2>,   Example: autosuggestion = {key: "MLV.2", value: "kalalokki", informalGroups: ["linnut"]}
- *   }                                              suggestionReceivers: {someFieldName: "key", someFieldName2: "/informalgroups/0"}
+ *    <fieldName2>: <suggestion path 2>,   Example: autosuggestion = {key: "MLV.2", value: "kalalokki", payload: {informalGroups: ["linnut"]}}
+ *   }                                              suggestionReceivers: {someFieldName: "key", someFieldName2: "/payload/informalgroups/0"}
  *                                         If fieldName start  with '$', then a function from autosuggestFieldSettings parses the suggestion. Example: $taxonGroup
  *                                         If fieldName start  with '/', it is handled as a JSON pointer.
  *  uiSchema: <uiSchema> (uiSchema which is passed to inner SchemaField)
@@ -168,7 +168,7 @@ class AutosuggestField extends React.Component {
                 return formData;
             };
             if (autosuggestField === "unit") {
-                let { unit } = suggestion;
+                let { unit } = suggestion.payload;
                 if (unit.unitType) {
                     unit.informalTaxonGroups = unit.unitType;
                     delete unit.unitType;

package/lib/components/fields/EnumRangeArrayField.js

@@ -60,7 +60,7 @@ function EnumRangeArrayField(props) {
         propsOnChange(value);
     }, [propsOnChange]);
     const getEnumOptionsAsync = (0, react_1.useCallback)(() => __awaiter(this, void 0, void 0, function* () {
-        const enums = yield props.formContext.apiClient.get(`/metadata/ranges/${range}`);
+        const enums = yield props.formContext.apiClient.fetchCached(`/metadata/ranges/${range}`);
         return enums.map(({ value }) => ({ value, label: value }));
     }), [props.formContext.apiClient, range]);
     const { Label } = props.formContext;

package/lib/components/fields/GeocoderField.js

@@ -292,8 +292,15 @@ let GeocoderField = class GeocoderField extends React.Component {
                     }, 30 * 1000);
                     !bounds.overlaps(globals_1.FINLAND_BOUNDS)
                         ? fetchForeign()
-                        : this.props.formContext.apiClient.post("/coordinates/location", undefined, geometry).then().then(handleResponse(props.formContext.translations.Finland, "municipality", "biologicalProvince", "biogeographicalProvince")).catch((e) => {
-                            fail(typeof e === "string" ? e : e.message);
+                        : this.props.formContext.apiClient.fetchRaw("/coordinates/location", undefined, {
+                            method: "POST",
+                            headers: {
+                                "accept": "application/json",
+                                "content-type": "application/json"
+                            },
+                            body: JSON.stringify(geometry)
+                        }).then(response => response.json()).then(handleResponse(props.formContext.translations.Finland, "municipality", "biologicalProvince", "biogeographicalProvince")).catch((e) => {
+                            fail(e.message);
                         });
                 }));
             };

package/lib/components/fields/ImageArrayField.d.ts

@@ -99,7 +99,7 @@ export declare function MediaArrayField<LFC extends Constructor<React.Component<
         processFile: (file: File) => Promise<ProcessedFile>;
         onMediaMetadataUpdate: ({ formData }: {
             formData: any;
-        }) => Promise<void>;
+        }) => void;
         getMetadataPromise: () => Promise<MediaMetadataSchema>;
         getMaxFileSizeAsString: () => string;
         getAllowedMediaFormatsTranslationKey: () => "AllowedFileFormat" | "AllowedFileFormats";
@@ -170,7 +170,7 @@ export declare class Thumbnail extends React.PureComponent<ThumbnailProps, Thumb
     componentDidMount(): void;
     componentWillUnmount(): void;
     UNSAFE_componentWillReceiveProps(props: ThumbnailProps): void;
-    updateURL: ({ id, apiClient, apiEndpoint }: ThumbnailProps) => Promise<void>;
+    updateURL: ({ id, apiClient, apiEndpoint }: ThumbnailProps) => void;
     render(): JSX.Element | null;
 }
 export {};