https://github.com/romeovs/next-optimistic-shared-components

https://github.com/romeovs/next-optimistic-shared-components

Last synced: 24 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/romeovs/next-optimistic-shared-components
• Owner: romeovs
• Created: 2024-09-11T18:26:35.000Z (2 months ago)
• Default Branch: main
• Last Pushed: 2024-09-11T19:12:40.000Z (2 months ago)
• Last Synced: 2024-09-12T04:52:01.107Z (2 months ago)
• Language: TypeScript
• Size: 16.6 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Example for state in different components

In this next app we have a single page with two components that both 

need to read the same bit of state.

As per Next's docs, it is fine to kick of two independent requests

for that state since the data cache will deduplicate them.

AFAICT, there is currently no other way to "share" this bit of state between the

components.

The `Incement` component renders a button that alters the state with a server action 

and it uses `useOptimistic` to render a snappier UI, since updating the state is slow.

Is there a way to also optimistically update the `Count` component without 

changing the structure of the app too much? 

Note that this is a simplified example. In the real world app you can imagine the

Count component to belong to the cart count of a user.

## Running the example

Run the example app using:

```sh

next

```

The server will start on at .