Oluwasetemi / Oluwasetemi/react-note

Bug: Suspense component missing fallback prop in hooks.md

Open
#45 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
Vue
Stars
3
Forks
13
PR merge metrics
No merged PRs in 30d

Description

Description

In pages/hooks.md, the <Suspense> component is used without the required fallback prop.

Location

File: pages/hooks.md
Line: 602

Current Code

return (
  <Suspense>
    <ul>
      {users.map((user) => (
        <div key={user.id}>
          ...
        </div>
      ))}
    </ul>
  </Suspense>
)

Expected Code

return (
  <Suspense fallback={<div>Loading...</div>}>
    <ul>
      {users.map((user) => (
        <div key={user.id}>
          ...
        </div>
      ))}
    </ul>
  </Suspense>
)

Why This Matters

  • The fallback prop is required for Suspense to display a loading state while async content resolves
  • Without it, users see nothing while data is loading, resulting in poor UX
  • This is a teaching material, so it should demonstrate correct usage

References

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Open pages/hooks.md around line 602 and compare the Suspense example with the linked React Suspense documentation. Update the teaching example to demonstrate the required fallback behavior, then re-read the example to confirm the loading-state usage is clear and complete.

Written by the indexing model from the issue text.

Assessment

Tech stack
react
Domain
documentation
Issue type
Documentation
Difficulty
1/5
Estimated time
Under an hour
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.