From 278a59555d34f495f4f18b415ad7bbc756f96449 Mon Sep 17 00:00:00 2001 From: slorber Date: Fri, 24 Sep 2021 14:55:14 +0200 Subject: [PATCH 1/6] add doc for conditional fetch --- README.md | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 3d366a2..8224e89 100644 --- a/README.md +++ b/README.md @@ -20,10 +20,10 @@ Don't expect it to grow in size, it is **feature complete**: - Can trigger manual refetch - Options to customize state updates - Can mutate state after fetch +- Returned callbacks are stable ## Small size -- Tiny - Way smaller than popular alternatives - CommonJS + ESM bundles - Tree-shakable @@ -299,6 +299,21 @@ const StarwarsHero = ({ id }) => { }; ``` +#### How to handle conditional fetch? + +You can enable/disable the fetch logic directly inside the async callback. In some cases you know your API won't return anything useful. + +```tsx +const asyncSearchResults = useAsync(async () => { + // It's useless to call a search API with an empty text + if (text.length === 0) { + return []; + } else { + return getSearchResultsAsync(text); + } +}, [text]); +``` + #### How to have better control when things get fetched/refetched? Sometimes you end up in situations where the function tries to fetch too often, or not often, because your dependency array changes and you don't know how to handle this. From 1621a593a576544e69810aa6cf6080d65c5b3d54 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Lorber?= Date: Thu, 30 Sep 2021 17:29:44 +0200 Subject: [PATCH 2/6] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 8224e89..67bb5e7 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# React-async-hook +# React-Async-Hook [![NPM](https://img.shields.io/npm/dm/react-async-hook.svg)](https://www.npmjs.com/package/react-async-hook) [![Build Status](https://travis-ci.com/slorber/react-async-hook.svg?branch=master)](https://travis-ci.com/slorber/react-async-hook) From d7e735722455ca7232a8e405c06e985a62f2520a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Lorber?= Date: Wed, 6 Oct 2021 12:32:11 +0200 Subject: [PATCH 3/6] Update README.md --- README.md | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/README.md b/README.md index 67bb5e7..e43f70d 100644 --- a/README.md +++ b/README.md @@ -22,6 +22,9 @@ Don't expect it to grow in size, it is **feature complete**: - Can mutate state after fetch - Returned callbacks are stable + + + ## Small size - Way smaller than popular alternatives @@ -37,6 +40,16 @@ Don't expect it to grow in size, it is **feature complete**: | **Use-HTTP** | [![](https://img.shields.io/bundlephobia/min/use-http.svg)](https://bundlephobia.com/package/use-http) | [![](https://img.shields.io/bundlephobia/minzip/use-http.svg)](https://bundlephobia.com/package/use-http) | | **Rest-Hooks** | [![](https://img.shields.io/bundlephobia/min/rest-hooks.svg)](https://bundlephobia.com/package/rest-hooks) | [![](https://img.shields.io/bundlephobia/minzip/rest-hooks.svg)](https://bundlephobia.com/package/rest-hooks) | +--- + +# Sponsor + +**[ThisWeekInReact.com](https://thisweekinreact.com)**: the best newsletter to stay up-to-date with the React ecosystem: + +[![ThisWeekInReact.com banner](https://user-images.githubusercontent.com/749374/136185889-ebdb67cd-ec78-4655-b88b-79a6c134acd2.png)](https://thisweekinreact.com) + +--- + ## Things we don't support (by design): - stale-while-revalidate From 1baee4a48e195cba5ad59351f16b7b64176aa04a Mon Sep 17 00:00:00 2001 From: polemius <48512663+polemius@users.noreply.github.com> Date: Fri, 22 Oct 2021 19:12:06 +0200 Subject: [PATCH 4/6] Fix small typo --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index e43f70d..1f99baa 100644 --- a/README.md +++ b/README.md @@ -263,7 +263,7 @@ const SearchStarwarsHeroExample = () => { You can use the `useAsyncAbortable` alternative. The async function provided will receive `(abortSignal, ...params)` . The library will take care of triggering the abort signal whenever a new async call is made so that only the last request is not cancelled. -It is your responsability to wire the abort signal appropriately. +It is your responsibility to wire the abort signal appropriately. ```tsx const StarwarsHero = ({ id }) => { From f089cce2b1236abff1fe213b9c282eb765ec90e1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Lorber?= Date: Mon, 30 May 2022 18:57:40 +0200 Subject: [PATCH 5/6] Update README.md --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 1f99baa..1b31052 100644 --- a/README.md +++ b/README.md @@ -33,6 +33,7 @@ Don't expect it to grow in size, it is **feature complete**: | Lib | min | min.gz | | -------------------- | ---------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- | +| **Suspend-React** | [![](https://img.shields.io/bundlephobia/min/suspend-react.svg)](https://bundlephobia.com/package/suspend-react) | [![](https://img.shields.io/bundlephobia/minzip/suspend-react.svg)](https://bundlephobia.com/package/suspend-react) | | **React-Async-Hook** | [![](https://img.shields.io/bundlephobia/min/react-async-hook.svg)](https://bundlephobia.com/package/react-async-hook) | [![](https://img.shields.io/bundlephobia/minzip/react-async-hook.svg)](https://bundlephobia.com/package/react-async-hook) | | **SWR** | [![](https://img.shields.io/bundlephobia/min/swr.svg)](https://bundlephobia.com/package/swr) | [![](https://img.shields.io/bundlephobia/minzip/swr.svg)](https://bundlephobia.com/package/swr) | | **React-Query** | [![](https://img.shields.io/bundlephobia/min/react-query.svg)](https://bundlephobia.com/package/react-query) | [![](https://img.shields.io/bundlephobia/minzip/react-query.svg)](https://bundlephobia.com/package/react-query) | From 9351dab27b4e42623b9acdacbf3524ef220035b1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Lorber?= Date: Fri, 17 Jun 2022 19:14:40 +0200 Subject: [PATCH 6/6] Update README.md --- README.md | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index 1b31052..81543d4 100644 --- a/README.md +++ b/README.md @@ -5,6 +5,16 @@ This **tiny** library only **does one thing**, and **does it well**. +--- + +# Sponsor + +**[ThisWeekInReact.com](https://thisweekinreact.com/react-async-hook)**: the best newsletter to stay up-to-date with the React ecosystem: + +[![ThisWeekInReact.com banner](https://user-images.githubusercontent.com/749374/136185889-ebdb67cd-ec78-4655-b88b-79a6c134acd2.png)](https://thisweekinreact.com/react-async-hook) + +--- + Don't expect it to grow in size, it is **feature complete**: - Handle fetches (`useAsync`) @@ -23,7 +33,6 @@ Don't expect it to grow in size, it is **feature complete**: - Returned callbacks are stable - ## Small size @@ -41,14 +50,6 @@ Don't expect it to grow in size, it is **feature complete**: | **Use-HTTP** | [![](https://img.shields.io/bundlephobia/min/use-http.svg)](https://bundlephobia.com/package/use-http) | [![](https://img.shields.io/bundlephobia/minzip/use-http.svg)](https://bundlephobia.com/package/use-http) | | **Rest-Hooks** | [![](https://img.shields.io/bundlephobia/min/rest-hooks.svg)](https://bundlephobia.com/package/rest-hooks) | [![](https://img.shields.io/bundlephobia/minzip/rest-hooks.svg)](https://bundlephobia.com/package/rest-hooks) | ---- - -# Sponsor - -**[ThisWeekInReact.com](https://thisweekinreact.com)**: the best newsletter to stay up-to-date with the React ecosystem: - -[![ThisWeekInReact.com banner](https://user-images.githubusercontent.com/749374/136185889-ebdb67cd-ec78-4655-b88b-79a6c134acd2.png)](https://thisweekinreact.com) - --- ## Things we don't support (by design):