diff --git a/.changeset/rude-frogs-run.md b/.changeset/rude-frogs-run.md new file mode 100644 index 000000000..bb0a6dc6d --- /dev/null +++ b/.changeset/rude-frogs-run.md @@ -0,0 +1,13 @@ +--- +'@lion/ajax': minor +--- + +**BREAKING** public API changes: + +- `AjaxClient` is now `Ajax` +- `AjaxClientFetchError` is now `AjaxFetchError` +- `request` and `requestJson` methods of `Ajax` class are renamed as `fetch` and `fetchJson` respectively +- `getCookie` and `validateOptions` is not part of the public API any more +- Removed the `setAjax` +- `createXSRFRequestInterceptor` renamed as `createXsrfRequestInterceptor` +- Exporting `createCacheInterceptors` instead of `cacheRequestInterceptorFactory` and `cacheResponseInterceptorFactory` diff --git a/docs/docs/tools/ajax/features.md b/docs/docs/tools/ajax/features.md index 4e3a81364..efac229c6 100644 --- a/docs/docs/tools/ajax/features.md +++ b/docs/docs/tools/ajax/features.md @@ -3,12 +3,7 @@ ```js script import { html } from '@lion/core'; import { renderLitAsNode } from '@lion/helpers'; -import { - ajax, - AjaxClient, - cacheRequestInterceptorFactory, - cacheResponseInterceptorFactory, -} from '@lion/ajax'; +import { ajax, createCacheInterceptors } from '@lion/ajax'; import '@lion/helpers/define'; const getCacheIdentifier = () => { @@ -25,8 +20,13 @@ const cacheOptions = { timeToLive: 1000 * 60 * 10, // 10 minutes }; -ajax.addRequestInterceptor(cacheRequestInterceptorFactory(getCacheIdentifier, cacheOptions)); -ajax.addResponseInterceptor(cacheResponseInterceptorFactory(getCacheIdentifier, cacheOptions)); +const [cacheRequestInterceptor, cacheResponseInterceptor] = createCacheInterceptors( + getCacheIdentifier, + cacheOptions, +); + +ajax.addRequestInterceptor(cacheRequestInterceptor); +ajax.addResponseInterceptor(cacheResponseInterceptor); ``` ## GET request @@ -34,14 +34,16 @@ ajax.addResponseInterceptor(cacheResponseInterceptorFactory(getCacheIdentifier, ```js preview-story export const getRequest = () => { const actionLogger = renderLitAsNode(html``); + const fetchHandler = name => { ajax - .request(`../assets/${name}.json`) + .fetch(`../assets/${name}.json`) .then(response => response.json()) .then(result => { actionLogger.log(JSON.stringify(result, null, 2)); }); }; + return html`