Update example code

fveracoechea · Jul 3, 2023 · ba6a434 · ba6a434
1 parent 27353fe
commit ba6a434
Show file tree

Hide file tree

Showing 6 changed files with 39 additions and 49 deletions.
diff --git a/example/app/layout.tsx b/example/app/layout.tsx
@@ -0,0 +1,16 @@
+export const metadata = {
+  title: 'Next.js',
+  description: 'Generated by Next.js',
+}
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  )
+}
diff --git a/example/pages/index.tsx → example/app/page.tsx b/example/pages/index.tsx → example/app/page.tsx
@@ -1,15 +1,10 @@
-import { Suspense } from 'react';
-
-import dynamic from 'next/dynamic';
-
 import Posts from '../components/Posts';
 
 export default function Docs() {
   return (
     <div>
       <h1>Example</h1>
       <br />
-
       <Posts />
     </div>
   );

diff --git a/example/components/Posts.tsx b/example/components/Posts.tsx
@@ -1,4 +1,6 @@
-import { Fetchtastic, suspender } from '../../lib/src';
+import { cache } from 'react';
+
+import { Fetchtastic } from '../../lib/src';
 
 type Post = {
   title: string;
@@ -17,7 +19,7 @@ function isPost(data: unknown): data is Post {
   );
 }
 
-export function assertPosts(data: unknown) {
+function assertPosts(data: unknown) {
   if (data && Array.isArray(data) && data.every(isPost)) {
     return data;
   }
@@ -28,23 +30,20 @@ const api = new Fetchtastic('https://jsonplaceholder.typicode.com')
   .appendHeader('Accept', 'application/json')
   .appendHeader('Content-Type', 'application/json');
 
-export default function Posts() {
-  const posts = suspender(() =>
-    api
-      .get('/postss')
-      .notFound(() => console.log('not found!'))
-      .json(assertPosts)
-      .catch(() => []),
-  );
+const fetPosts = cache(() =>
+  api
+    .get('/posts')
+    .notFound(() => console.log('not found!'))
+    .json(assertPosts)
+    .catch(() => [] as Post[]),
+);
 
-  function addPost() {
-    api.post('/posts', { title: 'test', body: 'test' }).resolve();
-  }
+export default async function Posts() {
+  const posts = await fetPosts();
 
   return (
     <main>
       <h2>Posts</h2>
-      <button onClick={addPost}>Add new post</button>
       {posts.map(post => (
         <article key={post.id} style={{ padding: 16, background: '#f2f2f2', marginBottom: 16 }}>
           <h3>{post.title}</h3>

diff --git a/example/tsconfig.json b/example/tsconfig.json
@@ -1,5 +1,13 @@
 {
   "extends": "tsconfig/nextjs.json",
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "../lib/src/index.ts"],
-  "exclude": ["node_modules"]
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    "../lib/src/index.ts",
+    ".next/types/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
 }
diff --git a/lib/src/react/index.ts b/lib/src/react/index.ts
diff --git a/lib/src/react/suspender.ts b/lib/src/react/suspender.ts