From ffbe7af307e67737ad3887e578c1f32cb132d674 Mon Sep 17 00:00:00 2001
From: LankyMoose <lankymoose@noreply.git.sheetjs.com>
Date: Tue, 16 Jul 2024 05:06:22 +0000
Subject: [PATCH] Update the kaioken docs around 'useAsync' to reflect current
 API (#15)

Reviewed-on: https://git.sheetjs.com/sheetjs/docs.sheetjs.com/pulls/15
Co-authored-by: LankyMoose <lankymoose@noreply.git.sheetjs.com>
Co-committed-by: LankyMoose <lankymoose@noreply.git.sheetjs.com>
---
 docz/docs/03-demos/02-frontend/01-kaioken.md | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/docz/docs/03-demos/02-frontend/01-kaioken.md b/docz/docs/03-demos/02-frontend/01-kaioken.md
index 15ad90a..3190c1b 100644
--- a/docz/docs/03-demos/02-frontend/01-kaioken.md
+++ b/docz/docs/03-demos/02-frontend/01-kaioken.md
@@ -224,7 +224,7 @@ import { read, utils } from 'xlsx';
 
 /* Fetch and parse the file */
 // highlight-next-line
-const [ pres, loading, error ] = useAsync<President[]>(async() => {
+const { data: pres, loading, error } = useAsync<President[]>(async() => {
   /* Download from https://docs.sheetjs.com/pres.numbers */
   const f = await fetch("https://docs.sheetjs.com/pres.numbers");
   const ab = await f.arrayBuffer();
@@ -331,7 +331,7 @@ interface President {
 
 export default function SheetJSKaiokenAoO() {
   /* Fetch and parse the file */
-  const [ pres, loading, error ] = useAsync<President[]>(async() => {
+  const { data: pres, loading, error } = useAsync<President[]>(async() => {
     const f = await (await fetch("https://docs.sheetjs.com/pres.xlsx")).arrayBuffer();
     const wb = read(f); // parse the array buffer
     const ws = wb.Sheets[wb.SheetNames[0]]; // get the first worksheet
@@ -371,10 +371,10 @@ export default function SheetJSKaiokenAoO() {
 Typically the JSX structure uses ternary expressions for testing status:
 
 ```jsx
-const [ pres, loading, error ] = useAsync(async() => { /* ... */ });
+const { data, loading, error } = useAsync(async() => { /* ... */ });
 
 return ( <>
-  { pres ? (
+  { data ? (
       <b>Data is loaded</b>
     ) : loading ? (
       <b>Loading ...</b>