From cf578f822b6f93b82b6f63f8672c1b51f280fd88 Mon Sep 17 00:00:00 2001 From: Jonathan Bouchard <jonathaneutron@hotmail.com> Date: Fri, 25 Oct 2019 17:50:05 -0400 Subject: [PATCH] Missing highlighted line in concurrent mode patterns example (#2490) --- content/docs/concurrent-mode-patterns.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/content/docs/concurrent-mode-patterns.md b/content/docs/concurrent-mode-patterns.md index 7be9f5bf..b09168c5 100644 --- a/content/docs/concurrent-mode-patterns.md +++ b/content/docs/concurrent-mode-patterns.md @@ -152,7 +152,7 @@ Now, this feels a lot better! When we click Next, it gets disabled because click Let's take another look at all the changes we've made since the [original example](https://codesandbox.io/s/infallible-feather-xjtbu): -```js{3-5,11,14,19} +```js{3-5,9,11,14,19} function App() { const [resource, setResource] = useState(initialResource); const [startTransition, isPending] = useTransition({ @@ -185,7 +185,7 @@ It took us only seven lines of code to add this transition: * We've imported the `useTransition` Hook and used it the component that updates the state. * We've passed `{timeoutMs: 3000}` to stay on the previous screen for at most 3 seconds. * We've wrapped our state update into `startTransition` to tell React it's okay to delay it. -* We're using `isPending` to communicate the state transition progress to the user. +* We're using `isPending` to communicate the state transition progress to the user and to disable the button. As a result, clicking "Next" doesn't perform an immediate state transition to an "undesirable" loading state, but instead stays on the previous screen and communicates progress there.