Function Posts

examples/preact/basic/src/index.tsx:14–56

({ setPostId }: { setPostId: (id: number) => void })

}

function Posts({ setPostId }: { setPostId: (id: number) => void }) {
  const [posts, setPosts] = useState<Post[]>([])
  const [loading, setLoading] = useState(true)
  const [error, setError] = useState<Error | null>(null)

  useEffect(() => {
    fetch('https://jsonplaceholder.typicode.com/posts')
      .then((res) => res.json())
      .then((data) => {
        setPosts(data)
        setLoading(false)
      })
      .catch((err) => {
        setError(err)
        setLoading(false)
      })
  }, [])

  return (
    <div>
      <h1>Posts</h1>
      <div>
        {loading ? (
          'Loading...'
        ) : error ? (
          <span>Error: {error.message}</span>
        ) : (
          <>
            <div>
              {posts.map((post) => (
                <p key={post.id}>
                  <a onClick={() => setPostId(post.id)} href="#">
                    {post.title}
                  </a>
                </p>
              ))}
            </div>
          </>
        )}
      </div>
    </div>
  )
}

const getPostById = async (id: number): Promise<Post> => {
  const response = await fetch(